What are style guides?
Style guides provide site builders with the tools to create theme-specific settings which affect the style and layout of a website.
The primary uses for the Style guides are:
- Creating a website where the appearance needs to change depending on the active theme. Useful when using context to switch a theme. For example, switching the theme if a user is logged in.
- You are applying global styling and appearance changes to a website using a simple to use interface. Very useful if you want to allow non-technical users the ability to apply visual changes to the website's theme within a governed set of overrides you define.
- You are creating design systems for multi-brand, multi-site solutions, where each brand needs to apply specific branding to a master design system.
Style guides are forms that generate theme-specific tokens. The tokens can be used as values to CSS properties or as values to settings within Site Studio elements. There are three steps to using style guides:
- Set-up style guide forms within Site Studio > Style guides.
- Use the tokens generated by the style guides exposed within the token browser.
- Apply values to the style guides within Appearance > Settings
Style guides can use theme inheritance. A sub-theme will automatically inherit the settings of its parent theme. Changes made to sub-theme settings will override its parent theme settings. When you edit a value in a style guide, it will display an 'Edited' tag.
For more detailed information, see Style guide manager in the user guide.