[TH] Style Switch [Deleted]

This is an interesting add-on, as I'm getting ready to deploy our upgrade.

Does this only work with one theme choice, or can it work with many?

I'm using the Flare theme, and already have a dark mode theme created for it--it is going to be the new official look for our forums. However, we have some users who absolutely hate change, and they will want to stick to the default XenForo theme, which we will also be offering. For them, who want the classic layout, I will also be creating a dark mode theme since it is a popular request.

My question would be...if they have either the Flare or XF theme chosen, will this dark mode add-on switch them to the matching dark versions of Flare and XF, or are we limited to using only one dark theme?
 
Mike Creuzer said:
You have your main parent theme where you make all the changes or whatever structure you have now should be fine. Your dark theme should be a child theme of this parent but doesn't have to be per se. You make a theme that is intentionally just light and not setup to change on detection, and one for the detection itself which will stay dynamic. That way the user can choose whether they want it to change via their operating system (say at night) or if they always want light or dark respectively.
Well the auto detect theme is necessary. Rest is more or less for the same reason as any organized frontend theme system.
Click to expand...

We’ve got ours setup as follows, one autodetect, one dark, one light. Users can select any of the following but autodetect is set by default. This way the theme will turn light or dark depending on the users operating system BUT if they prefer either light or dark they can also select that. I’d highly suggest as long as the default option is available for users to select, they should be able to pick it as well.
 
leebo said:
We’ve got ours setup as follows, one autodetect, one dark, one light. Users can select any of the following but autodetect is set by default. This way the theme will turn light or dark depending on the users operating system BUT if they prefer either light or dark they can also select that. I’d highly suggest as long as the default option is available for users to select, they should be able to pick it as well.
Click to expand...
Agreed. And that sounds correct.
 
Rudy said:
My question would be...if they have either the Flare or XF theme chosen, will this dark mode add-on switch them to the matching dark versions of Flare and XF, or are we limited to using only one dark theme?
Click to expand...


I kinda missed this part,
I’d suspect you could offer multiple dark options, but the plugin itself is only going to automatically show one. Users can manually select other options, but you can only “force” one dark mode by default.
 
leebo said:
I kinda missed this part,
I’d suspect you could offer multiple dark options, but the plugin itself is only going to automatically show one. Users can manually select other options, but you can only “force” one dark mode by default.
Click to expand...
Hey Leebo, that is correct. By default, you are only able to select one light style, one dark style, and one autodetect style. But as you said you could surely offer multiple versions and allow users to choose whichever they want.
 
Jake B. said:
We have documentation available for the setup here:

help.themehouse.com

Before Configuring [TH] Style Switch

Important things to note before you start configuring [TH] Style Switch
help.themehouse.com help.themehouse.com
Click to expand...

Yes but documentation are not clear or I am not understanding. Please update documentation with ScreenShot from Appearance > Styles. So we can easily understand for this auto-detect setup. I have posted 4 ScreenShot from this setup then Please let me confirm any one. Thanks
 
Nirjonadda said:
Yes but documentation are not clear or I am not understanding. Please update documentation with ScreenShot from Appearance > Styles. So we can easily understand for this auto-detect setup. I have posted 4 ScreenShot from this setup then Please let me confirm any one. Thanks
Click to expand...
The best configuration for maximum compatibility with [TH] Style Switch is to have one light style, one dark style, and a child style below each. For autodetect, you should add an additional child style below whichever style you wish to be the primary.
Click to expand...

Either
- Base (non-selectable)
-- Light Base (non-selectable)
--- Light
---- Autodetect
-- Dark Base (non-selectable)
--- Dark

or
- Base (non-selectable)
-- Light Base (non-selectable)
--- Light
-- Dark Base (non-selectable)
--- Dark
---- Autodetect

based on which one you want to be the primary style.
 
Lukas W. said:
Either
- Base (non-selectable)
-- Light Base (non-selectable)
--- Light
---- Autodetect
-- Dark Base (non-selectable)
--- Dark

or
- Base (non-selectable)
-- Light Base (non-selectable)
--- Light
-- Dark Base (non-selectable)
--- Dark
---- Autodetect

based on which one you want to be the primary style.
Click to expand...

So Autodetect only one child style?
 
BGObsession said:
Edited: nevermind - figured out which template to add the snippet to to put the toggle in the navbar, but it requires some coding skills to place it correctly. Support ticket submitted.
Click to expand...

Hi I tried to put the switch on the navbar too but this is what I got:

There's a white for in front of the switch and there whole thing is vertically misaligned.

Care to share what you did to make it work?

IMG_20200406_234841.webp
 
I am still trying to understand how exactly this would be setup. I've read through the documentation and it still isn't clear to me.

The setup I am aiming for.

  • Light Style (Primary)
  • Dark Style - selectable
  • Autodetect (Would like to be the default)

I would like for autodetect to detect the right one or the user can choose. Reading through the documents and comments it appears as if autodetect is applied to one style.
 
It looks like the issue is with the noscript template modification. If you switch this template modification off then it works. There are also some errors briefly shown during install.
 
AndrewSimm said:
I am still trying to understand how exactly this would be setup. I've read through the documentation and it still isn't clear to me.

The setup I am aiming for.

  • Light Style (Primary)
  • Dark Style - selectable
  • Autodetect (Would like to be the default)

I would like for autodetect to detect the right one or the user can choose. Reading through the documents and comments it appears as if autodetect is applied to one style.
Click to expand...
Hello,

Apologies for the delay on responding to this thread. Setting this up can be quite confusing but I can surely help.

As per this section of our documentation, you'll want to select your light style and the autodetect style within the "Light style definitions" and then select your dark style within the "Dark style definitions". Thereafter, select your primary light, dark, and autodetect style within the drop-down sections below. When setting the autodetect style, when someone views your site (depends if their browser/system is set to a dark/light interface) they will either be set to use your light or dark style IF you have the autodetect style set as default.

After, you can then set the toggle switch position and include any additional stylesheet names (if any are needed) within the "Additional stylesheets" fields although those aren't required if you aren't loading any additional stylesheets to use on your styles.

Let me know if you have any other questions when setting this up as I'd be happy to help! :)
 
You must log in or register to reply here.

Similar threads

Brad Padgett
[BP] Light Switch and Style Chooser [Deleted]
2 3
Replies
55
Views
3K
Brad Padgett
Brad Padgett
ThemeHouse
[TH] Force Style Plus [Deleted]
Replies
6
Views
1K
ThemeHouse
ThemeHouse
Back
Top Bottom