Visual

Understand how to determine the look of your Page

The Visual category of the Page settings editor lets you change the active template and configure colors of both sections along with fonts and headers.

Below you can see the already configured Page with highlighted components. By comparing the components to their names you can easier find your way around the editor.

1. Main section
2. Navigation section
3. Primary font
4. Secondary font
5. Main section link
6. Header
7. Page name
8. Selected element

In oder to learn how to configure your Page so that its visual layer is customized, read the steps below.

Steps

Note

By accessing the Visual category of the editor you can see the color compositions of the active Template which has been selected during the creating Page process, e.g. Violet. You can change the template by clicking on the drop-down list or proceed to selecting the Main section and Navigation section colors.

1. Set the colors of the Main section using the color picker, HEX code, or RGB codes.

   

   Tip

   Use the minus icon to turn off the configuration of individual colors. That way they will automatically match the background color to create the best possible composition. You can always configure them manually by clicking the plus icon.

   

2. Turn on the toggle if you want the request type icons to be visible on the Page.

   

3. Set the colors of the Navigation section using the color picker, HEX code, or RGB codes.

Result

The visual layer of you Page is configured.

Next up

To finish the Page configuration, proceed to publishing. You can also continue editing by moving to the General category of the Page settings.