Theme customization

‚Äč

Theme node

The theme node is located under the settings node in your content tree. There you can change colors, fonts, logos and more.

Fonts

By default Igloo uses Roboto Font. To change this first change the Embed Font under Theme -> General. Next change the font stack on Body Font & Heading Font

Under the theme node you can add two logos, one that works on a dark background and one that works on a light background. We recommend that you use .svg image for you logo.

Theme Explorer

When you're previewing the content you're working with, you can use the Theme Explorer to change colors on the website, set different fonts for the headings and text as well as customize various other aspects of the website.

To access the Theme Explorer, follow these steps:

  1. Select a piece of content from the Content tree

  2. Use the Preview feature at the bottom of the page

  3. Access the Theme Explorer by selecting the green pencil-button in the right side of the screen

The Theme Explorer contains the following sections:

  • Colors: Define the colors being used throughout the website

  • Text: Change the fonts used for headings and the main body of text

  • Header: Customize how the header of the site should look

  • Footer: Change the theme and size of the Footer

  • Grid: Define various size-dimensions for the Grid widget

  • Forms: Set the border radius for buttons in forms on the website

Any changes made and saved through the Theme Explorer will automatically be saved to the Theme settings.