This is a theme component that will allow you to add custom text-based links to the header easily.

Github repository link:
https://github.com/discourse/discourse-custom-header-links

Demo:
https://theme-creator.discourse.org/theme/Johani/custom-header-links


Samples:

Desktop

Capture: 690x361

Mobile
Capture: 251x499, 75%

(due to very limited space I don’t recommend adding more than one link on mobiles)


Settings:

Adding links is straightforward. Every link needs 6 items. You enter comma delimited values in this order:

link text, link title, URL, view, target, hide on scroll

Link text: the text for the link.
Link title: the text that shows when the link is hovered.
URL: The path for the link (can be relative).
View: vdm = desktop and mobile, vdo = desktop only, vmo = mobile only.
Target: blank = opens in a new tab, self = opens in the same tab.
Hide on scroll: remove = hides the link when the title is expanded on topic pages keep = keeps the link visible even when the title is visible on topic pages.

If you’re not sure what hide on scroll does, here’s an example:

headerLinks: 690x388

Most Liked and Privacy are set to keep and so they remain visible. The other links are set to remove, and so are hidden when the title expands in the header. This only affects topic pages.

Links position: This setting allows you to change the default layout so links will appear on the left near the logo instead of on the right. Note that when positioned to the left, links will automatically be hidden when scrolling within topics to make room for the topic title.


How do I install this component?

Follow the theme installation guide and add the theme component to your active themes.

If you’re new to Discourse themes, you can learn more about them here.