Vanilla's new Theme Editor makes it easy to create and modify custom theme templates so that your community and knowledge base can match your unique brand.
The Theme Editor editor was designed to modify our Foundation theme template, but if you have started, or are interested in integrating some of our new pages, widgets or components you may use the theme editor to modify your custom or legacy theme templates to prepare for the integration. Find out more about which pages and components you can integrate into your custom themes -
Creating a New Theme Template
As a new Vanilla customer, you will be using our Foundation theme template by default. To start creating your own custom template
- Navigate to the Themes section of your Dashboard settings
- The first thing you will see is your currently applied basic Foundation template
- Copy the Foundation template, this will launch the Theme Editor
Modifying a Custom or Legacy Theme Template
If you've been with us for a while you may already be using one of our legacy themes such as Bootstrap3, Defletor or TripleA, or you may have a completely custom theme. If this is the case, you can continue to manage and modify your theme in the same way you did before, but if you would like to start integrating our new pages, widgets and components you will need to create a new copy of your custom theme to be able to modify their styles and settings.
On the Themes page of your Dashboard settings make a copy of your existing theme to get started:
N.B. When you create a copy of a custom or legacy theme, the settings you apply in the theme editor will only impact your Foundation-based components.
Theme Editor Sections
The Theme Editor is broken down into five major sections:
Here you can update your global styles with the click of a button, and customize things like:
- Brand colours
- Banner Assets
- Button Styles
- Fonts and more.
Use the navigation menu and/or theme preview to configure settings for different sections and components.
You're able to see a preview of your updates as you pick and choose your various options.
Header and Footer
Easily insert the HTML for your Header and Footer in these sections.
Compliment your custom HTML Header and Footers with CSS.