Updating theme settings
Our themes offer a large number of sensible settings that you can use to brand and customize your help center. You can access the settings by customizing your theme in Zendesk Guide. You can also add your own settings when making changes to the layout and functionality of your theme, if desired.
We’ve taken theme to the absolute limit in our themes, ensuring that most common branding and customization tasks can be completed using them alone. You can also take comfort in the knowledge that because our themes are designed to be customized, if you do need to make changes to page templates or the code you can do so easily and without creating an ongoing support and maintenance headache.
Using variables in CSS
Setting variables can be used in both CSS and the theme’s Sass source files by assigning a variable to a CSS property in the same way you would assign a normal value:
.button {
color: $button_color;
}
The variable name, in this example button_color, is the setting identifier from the manifest file.
You can also use single curly brackets to embed the variable in a CSS expression:
.container {
max-width: #{$container_width}px
}
Using variables in page templates
Setting variables become properties of the settings object in page templates. As with any Curlybars object, you can use double curly brackets and dot notation to insert a property in a page template. For example:
<h1>
{{setting.homepage_heading}}
</h1>
<div class="hero" style="background: url('{{settings.homepage_background_image}}')">
...
</div>