Not open for further replies.


Pixel Exit Staff
How do I add icons to my custom sidebar boxes?

First you'll need to get your CSS identifier for the extra block. Let's use the Recent Status Updates block from the widget framework:


Easiest way is to find it is via Firefox's Firebug plugin, default source code, you can also use Chrome's web developer to view the code. It should look something like this:

For this adding the code would be something along the lines of:

.sidebar #statusUpdates h3:before {
display: inline-block;
content: url(@imagePath/xenforo/sources/stafficon.png);
height: 16px;
line-height: 32px;
padding: 0 4px;
vertical-align: top;
width: 16px;

You'll need to replace the content url with a link to your icon. All the current icons I use are 16x16. If you have trouble with a block let us know.
Not open for further replies.

Pre-Sale Questions

If you have any questions or concerns you want to ask before you make a purchase don't hesitate to use one of our multiple support channels for your convenience.