Designing your Site - Theme
One of the first actions to do when creating a new site is to set the style of all the different sections and to set default parameters that will later be used throughout the site, without having to set them individually (like fonts, links and headings settings). You can do this from the
Theme tab, which is divided into three sections:
Layout,
Style and
Colors
From this tab you can select the master page's layout (
Plain,
Vertical,
Horizontal) and build it's sections:
Header,
Footer,
Side Panels,
Content Top and
Content Bottom
A new site is created with a default blank Header and Footer.
In order to build a s new section or change the default ones, click on the relevant section and choose a preset (currently available for the Header, Footer and Side panels). Once you choose the preset, a new section is created using the default name: “Section - Section 1” (visible in this panel and also under the Sections area in the left management panel)
You can remove a section added here by clicking on the relevant section and then clicking on the
Remove section link at the bottom of the tab:
You can go to the
Sections area in the
Sitemap and change the name of the section or remove it completely:
You can choose your master page's style (the presentation settings for backgrounds, fonts, headings, links etc.) from a presets list (according to the chosen layout) and use it as is or you can customize it to your specific needs
From the
Customize tab you can set the page width and style the different layers of the master page:
Layer 1- Full page style including link, link hover and headings
Layer 2- divides the page into Header, Footer and main area according to the layout and allows to style each
Layer 3- allows to style the middle content area (excluding sections) and different sections
Layer 4- available only when you add a Side Panel or Content Top/Bottom- allows to style the middle content area (excluding sections) and different sections
You can edit the style of your master page under Theme or your components using the Style Editor. The editor contains five settings options: Appearance, Background, Layout, Effects, Advanced:
In this tab you can design text elements (fonts, alignment etc.)
In this tab you can design the background color or set a background image / pattern instead
In this tab you can design the margins and padding of the element
In this tab you can add transparency, borders, rounded corners and shadows
In this tab you can set sizes, floating settings and more
In this tab you can choose a color palette for the site from existing presets and use it as is or customize the palette to your needs
The palette is built so that the five main colors are located in the upper row and by editing them all the rest change automatically. The rest of the colors are shades of the main colors, first three rows are lighter and the last two rows are darker. For palette customization we recommend editing only the five main colors