The API could be called Site Theme or Site Color Palette.
It essentially would make it possible to switch between different site themes/color palettes in real-time on the live site using code. This can mainly be used to add a themes feature to the site, for example a dark theme/mode and a light mode/theme. Instead of changing all the elements’ color, with this API you would just change the current/selected theme and all colors change accordingly to the theme. The themes are set up on the wix editor (in the new themes menu). The menu would need to have the option to add various themes and each one would have an id.
To change the current theme the code would be something lile:
import wixThemes from 'wix-themes';
$w.onReady(()=>{
if (wixThemes.getCurrentTheme === 'light') {
wixThemes.setTheme('dark');
} else {
wixThemes.setTheme('light');
}
}
I imagine a problem with this approach which is that the page would first load with the default theme and then change to the other theme and the user would notice that. To avoid this I propose 2 solutions:
- the selected theme is saved in the computer as a cookie and the page loads automatically with that theme
- a way to run a script before the page is rendered. This script would run on backend and send the correct theme to the frontend.
Hopefully I made myself clear and I hope this will be implemented as I think many of us wish a better way to implement light and dark mode options for our sites.