Enable Navigation

You can enable the links via the WP Dashboard > Appearance > Customize > Design > Breadcrumbs section.

Check the option Show an ellipsis for longer items to display ellipsis instead of breaking links into lines.

To define your site style, please:

1. Go to the WP Dashboard › Appearance › Customize panel
2. Switch to the Design › Global section
3. Choose your style

Common

All site-wide colors. Boxed layout background, accents, buttons, badges, and flags.

1. Go to the WP Dashboard › Appearance › Customize panel
2. Switch to the Design › Colors section
3. Use available color pickers to adjust color values

Header

Colors for header elements, menus, and off-canvas.

1. Go to the WP Dashboard › Appearance › Customize panel
2. Switch to the Header section
3. Choose appropriate section (header rows, off-canvas or submenus)
4. Use available color pickers to adjust color values

Footer

All footer related colors.

1. Go to the WP Dashboard › Appearance › Customize panel
2. Switch to the Footer › Colors section
3. Use available color pickers to adjust color values

Change Skin

You can choose between two basic presets of colors for the whole page: light and dark. To pick your skin, please:

1. Go to the WP Dashboard › Appearance › Customize panel
2. Go to the Design › Global section
3. Change the Skin option to your preferred value

Mode Switcher

You are not limited to use one skin at the time. To provide a better experience, you can allow your users to switch between skins (mods).
To do that, please add the Skin switcher to your header by following these simple steps:

1. Go to the WP Dashboard › Appearance › Customize panel
2. Open to the Header › Builder section
3. Place the Skin dropdown onto your header (screen)

Dark Mode Logo

If you want to use alternative logo for your dark mode, please do as follows:

1. Go to the WP Dashboard › Appearance › Customize panel
2. Choose the Site Identity section
3. Upload the Logo inverted
4. Optionally, provide the Logo inverted HDPI if you want to provide a high quality logo for retina devices
5. Optionally, upload the Mobile Logo inverted to provide different dark mode logo for mobile devices
6. Optionally, provide the Mobile Logo inverted HDPI if you want to provide a high quality mobile logo for retina devices

To switch from the stretched to boxed layout, please do as follows:

1. Go to the WP Dashboard › Appearance › Customize panel
2. Go to the Design › Global section
3. Change the Layout option to boxed
4. Optionally you can adjust the Boxed Layout Width and the Boxed Layout Background below

Font Control

Our custom font control consists of 3 panels:

Desktop

This view represents font settings for a desktop device (above 1023px). You can change:

• Font – font family
• Style – font style, available choices depend on the chosen font
• Size – text size
• Line height – the height of a line
• Letter spacing – increases or decreases the space between characters in a text
• Text transform – controls the capitalization of text

Tablet

This view represents font settings for a tablet device (between 1023px and 768px). Here you can override only the Size and Line height properties. Others are inherited from desktop setup.

Mobile

This view represents font settings for a tablet device (below 768px). Here you can override only the Size and Line height properties. Others are inherited from desktop setup.

Change Font For Desktop

To customize fonts for desktop, please do as follows:

1. Go to the WP Dashboard › Appearance › Customize panel
2. Go to the Design › Typography section
3. Click the + Add new button
4. Choose the element you want to customize, e.g. Button
5. Select the Desktop tab
6. Adjust font properties (watch changes on live preview)
7. Publish

Change Font For Smaller Devices

To customize fonts for tablets and phones, please do as follows:

1. Go to the WP Dashboard › Appearance › Customize panel
2. Go to the Design › Typography section
3. Click the + Add new button
4. Choose the element you want to customize, e.g. Button
5. Select the Tablet or Mobile tab
6. Adjust font properties (watch changes on live preview)
7. Publish

Remove Customization

If you want to remove your custom font setup, just remove the control. The element style will be reverted to its original state.