This is a theme component that will allow you to add linked icons to the Discourse header easily.

Github repository link




Capture3: 640x500, 75%


Capture: 265x500, 75%

This component includes a theme setting that allows you to add as many links as you want, determine their icons, and decide which devices they show up on!

Capture4: 690x208

The pattern for links is as follows:


Title is.. well..the title you want the link to have.

URL is where you want the user to go when they click. Include protocol like https://
Alternatively, as @dnsmichi pointed out, you can also use relative links like /c/staff

Icon can be any FontAwesome 5 (free) icon name without the fa- ‘fab-‘ ‘fas-‘ or ‘far-‘ parts

If the icon you want to use does not show up, then add it to the svg_icons setting in the component. if you add new icons, they need to be prefixed with FontAwesome 5 prefixes like fab, far and fas.

View can have one of three values:

Desktop only

Mobile and desktop

Mobile only

Target can be:

Opens link in the same tab

Open link in a new tab

How do I install this?

follow the official theme installation guide here:

Then add the component to your theme as a theme component and you’re all set!


This is based on @techAPJ’s awesome tutorial here:

and on @vinothkannans’s Brand header theme which was a great reference for the structure of this component.