Adding icons rather than text

This plugin is amazing – I’m not good at plugins, so don’t know how to branch off of it myself, but I feel that Discourse has a nice “simplicity” feel to it – it would be great to support images/icons.

Here is a ghetto way of how I achieved a Discord icon:


(Minus the color saturation – HDR screenshot bugs are the worst)


After installed, make a new CSS component, or edit the theme directly:

Here is what I used –

    color: white;
        background-image: url('');
        background-repeat: no-repeat;
        background-size: 22px;
            color: rgba(0, 0, 0, 0);
            text-decoration: none;
                box-shadow: 0px 2px lightgray;

  • I had issues with hover effects, so a bottom box shadow on hover is the best I got, since these are images instead of unicode:


  • I named the above example d because you have to name it something. I make the font 0 opacity, so it gets hidden, but d allows me to utilize the d class.

  • Is there a way to do this? Probably. But this is the ghetto way to bring about ideas until something better reveals itself :slight_smile:


First of all this is a theme component, not a plugin. It is better to specify this before users get confused and try to install it like a plugin.

The second thing is, why you use this theme component instead of Iconified Header Links which serves the purpose of adding icons to the menu? :open_mouth:


Heck, that’s why I didn’t make a component – I’m still learning the terms.

Because it’s not cool enough to show up in that last of lazy-link-install components, I suppose ;D if the text links should be there, I wish the icons were there, too! It’s pretty awesome looking. Gonna check it out now.

EDIT: Works wonderfully.