Skip to content

Setup Guide

This page serves as a first starting-point to customize the POWER THEME to your brand identity.

OK, let's go

WHERE TO START?

Let's begin by setting your primary brand color first (Colors => Brand Colors). You can see your changes taking effect on the header CTA button or when you hover over the first accordion item below. Don't worry, you can always revert your changes.

Awesome. What next?

The brand colors will be derived to all further color settings outside of the brand color section. Let's go to (Colors => POWER => Light Scheme).

And now?

Just to see whats possible and to get into theme settings, change background, text and title colors for the light scheme and reverse back to the theme defaults by clicking on the icon that appears next to the setting you changed.

Dark scheme

OH YEAH

Some of our POWER modules allow an easy switch between dark and light scheme like this POWER section module. To learn more about POWER section modules and our brand new POWER sub modules and POWER mini modules feel free to visit our documentation.

How about font-settings next?

Go to (Fonts => Basic Setup) to configure your base and accent font-family. Latter will be used for navigation, titles, menus, etc.

After that you are free to change the font-sizes, font-weights, line-heights and letter-spacings for specific elements like headings or body text (Fonts => Formatting).
The following section will help you to review your settings.

Typography

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam

H1 Heading 72

H2 Heading 38

H3 Heading 32

H4 Heading 24

H5 Heading 19
H6 Heading 16
Body text is 16px and this sentence here is NOT defined as an HTML paragraph. Lorem ipsum dolor sit amet.

(Not) very different, but this parapraph is indeed a HTML paragraph and it's font size is 16px. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed.

  • This is how your lists will be shown
  • You can change the bullet shape via Styling > Lists > Bullet Points
  • And change the colors via Colors > POWER > Dark/Light Scheme > Lists

TIP: With the 'View on:' option at the top center you have the ability to switch the preview of your settings to other POWER templates or pages you created with this theme.

We hope you are happy with your first configurations and that you got an idea of how the theme settings work.
The next section comes in handy if you need to change the base colors for the listed POWER CTA styles ;)

POWER Custom Button Styles - Light Background

 

Custom Button 01

Custom Button 02

Custom Button 03

Custom Button 04

 

POWER Custom Button Styles - Dark Background

 

Custom Button 01

Custom Button 02

Custom Button 03

Custom Button 04

 

CHECK OUT THE POWER THEME DOCUMENTATION