The general layout controls the design of your entire campaign landing page.

Under the layout tab in the backend, you can define the colors, fonts, button design, and more for your entire campaign.

In the following sections, we will introduce you to the settings that control the general layout:

The background color or picture set in the general layout will show on the entire campaign landing page including all of the game flow pages. To change the background on individual sections or flow pages you will use the frontend editor.

The base color affects a few different elements including the color behind the background color, the line in the registration form, and your campaign’s pre-loader.

The text color and font that you set under your general layout will be the default for all of your campaign’s text and headers. You can change the color for specific elements in the frontend or under the font styles tab. Read more below.

Under the ‘Font styles’ tab, you can set the specific design for different text types. For example, you can set a text size of 70 pixels for header one (H1) And you can set a font weight of 700 which is a bold font.

Make sure that your font styles are also updated for mobile. If you leave settings blank under font styles the platform will use the defaults that you set under the general layout tab.

Under general layout, you can also set the design of your buttons. You can decide your button background color text color, border thickness, and more. The layout set here will impact the design of buttons within the game, for example in a quiz.

In the following example, the button has a transparent background and a rounded border. On hover, the button has a solid color and a different text color.

You can also set a design for a secondary button. You can decide whether a button uses the primary or secondary style in the frontend editor.

The preloader is what shows while your campaign page is loading and the favicon is what shows in the browser tab while your campaign is open. All of the general campaign layout settings can also be edited globally, under account settings if they should be the same for every campaign you build.

For more information, you can check out the following resources:

You can also access the full layout settings in the bottom right corner of the frontend editor. This way you can change the overall layout while also being able to quickly preview the changes immediately.

Some general layout settings can also be edited directly in the editor, when you don't have any sections selected in the navigator.