Header Theme Toggle

I’ve built a simple toggle for the header that switches between two themes on click.

ezgif-1-3a57fa471d85

:hammer_and_wrench: Github repo: https://github.com/awesomerobot/discourse-header-theme-toggle

:man_shrugging: How do I install a Theme or Theme Component?

In the theme component’s settings, you can define the two themes and optionally enable immediate reloading (sometimes required for more complex themes).


:warning: Please note

  • Both themes must have Theme can be selected by users enabled, and both themes must also have this theme component added.

  • The theme name is used in the toggle. I strongly recommend short names!

  • I have not yet added mobile support, so this only works on desktop for now

:beers: Inspired by @B-iggy’s Alien Night Theme & Theme Switcher Component, and heavily borrowing from @sam’s Hamburger Theme Selector

38 Likes

I like it, but it doesn’t play well with Hamburger Theme Selector

3 Likes

Ah, right I shouldn’t be reusing the same widget name there. I’ve just fixed it, so it should be better if you update the component.

8 Likes

Hey @awesomerobot is there a way to anchor this on middle, left side of the screen and stay middle through scrolling? :thinking: My header is occupied by a custom button menu so they overlap.

First of all great nifty component, I love it

A small suggestion: After the click it takes a while until the forum reloads. Can you display a spinning wheel on top of the buttons + grey out the buttons after the click when the reload setting is active?

Otherwise users might get confused why “nothing” is happening for first 3 seconds…