Customizing Brand Header Theme Component

Dev
1

I’m trying to customize Discourse’s “Brand Header Theme Component”. I’m not sure what approach to take here. I want to add submenu items, e.g. my link structure would look like:

video
audio - books
          - lectures,
topics - web development
           - technology
           - engineering
support

But adding submenu items doesn’t come as a standard option with this component. I know there is a Discourse Header Submenus component which has some of the functionality I want, but only in desktop mode.

There are no plugin outlets available in this component that I’m aware of so I can’t inject code and I don’t think I can override the template because it isn’t part of the core discourse code base so I can’t access it as far as i know (although it is created and maintained by discourse).

The links will be fetched from an API but I’m just trying to hardcode them at this stage.

More generally - is it possible to customize theme components outside of the core discourse repo? What is the appropriate approach to take here?

Thank you for your help!

1 Like
3

Hi Harley,

Yes, you can customize the theme component by forking it and make the changes in the code as per your requirement. You should then be able to install that component on your instance via your fork’s GitHub URL.

4

Thanks for responding Meghna! Thats great and I’ve made a start with that. I ran into a problem with this approach though - I tried to input new settings into my forked theme component (via my Discourse instance’s theme component admin panel) but the settings from the original theme component were still making it through to my own forked version. I could see a new component was there but it had the same settings as the old one. Do you think it could be because they have the same name? I also tried deleting the original theme component from my theme but that removed both the original and the forked version from the preview of my theme. Thanks for your help!