Header

Choose between different properties which will affect color style, spacing or the way the Site Header behaves

• Color style — affects both the backgound color and text items color of Site Header
  • Background — background color of Site Header
  • Background transparency — transparency level of background color, measured in percents (valid values from 1 to 100)
  • Color skin — color skin of Site Header items: menu items, icons, logo. You could choose between Light (or white) and Dark (almost black)
  • Light Color Skin — choose the color for Light Skin
  • Dark Color Skin — choose the color for Dark Skin

• Spacing  — space, either vertical (top & bottom) or horizontal (right or left), around Site Header, measured in pixels
• Border Bottom — choose color and width for the bottom border of Site Header (pixels)
  • Color — choose the color for border
  • Width (pixels)
• Enable shadow — add shadow to Site Header
• Behaviour — choose the way Site Header behaves; it could be:
  • Regular — this is a standard Site Header that stays on top of the page. When viewers scroll down, it goes out of view. This a good choice if you want a simple and elegant look for your site.
  • Fixed — this type of Site Header stays fixed on top of the page when visitors scroll. This is a good choice if you want your viewers to have access to Main navigation all the time.
  • Sticky — this type of header is initially on top of the page and goes out of view when visitors scroll down (after a certain amount of scroll from the page top). Then, it appears again, but not including Above Area (if enabled) this time.

This is the most important menu of your site. It has the following options:

• Main menu — the main menu of theme and it refers to first level menu items
  • Top & Bottom Spacing
  • Position — (valid just for Logo Side) choose an alignment for your main menu inside Site Header: Left, Center or Right
  • Font-size — menu items could have a certain font-size, measured in pixels
  • Font-weight — how light or bold the menu items could look
  • Letter-spacing — the space between letters of menu items, measured in pixels

• Submenus — the Dropdown menus of Main menu items
  • Background — choose any color from color picker.
  • Color skin — color skin for Dropdown menus. You could choose between Light (or white) and Dark (almost black)
  • Font-size — menu items could have a certain font-size, measured in pixels
  • Font-weight — how light or bold the menu items could look
  • Letter-spacing — the space between letters of menu items, measured in pixels
• Social menu  — the social menu of theme, that consists of social icons
  • Font-size — social icons could have a certain font-size, measured in pixels

When Search Area is enabled, a search icon appears in the Site Header and when clicked, a search bar will unfold, depending on its behaviour, either at the top of the page or in fullscreen mode.

• Enabled — check this if you want to have a Search Area for your site
• Color style — affects both the backgound color and content items color of Search Area
  • Background — background color of Search Area
  • Color skin  — color skin of Search Area items (it refers at those items which appear when Search Area icon is clicked): search text field, explanation text, close-button. You could choose between Light (or white) and Dark (almost black)
• Behaviour  — choose the way Search Area behaves; it could be:
  • Covering header — when the search-icon is clicked, the Search Area covers the Site Header with a certain amount of pixels
  • Fullscreen — when the search-icon is clicked, the Search Area covers the whole screen
• Text field — this is the text that appears by default in the search field

The Sidebar displays information other than the main content of the web page. When enabled, a sidebar icon appears in the header and when clicked, a right sidebar will unfold. You can fill the sidebar with content by adding widgets in Appearance → Widgets.

• Enabled — check this if you want to have a Sidebar linked to the Site Header
• Color style — affects both the backgound color and content items color of the Sidebar
  • Background — background color of Sidebar
  • Color skin  — color skin of Sidebar items (it refers at those items which appear when Sidebar icon is clicked): its title and widgets. You could choose between Light (or white) and Dark (almost black)
• Spacing  — the amount of space the Sidebar could have
  • Width — sidebar width, measured in pixels
  • Top & bottom — vertical spacing around Sidebar content (title and widgets), measured in pixels
  • Left & right — horizontal spacing around Sidebar content (title and widgets), measured in pixels
• Title — this is the text that appears by default in the search field
• Menu icon — the Header Sidebar icon located in Main menu of theme
  • Size — sidebar icon could have a certain size (small, medium, large)

The area is displayed right above the Site Header and is conceived for additional notices and tools (like menus and social icons) for your site. It consists of the following options:

• Color Style — affects both the backgound color and text items color of Above Area
  • Background — background color of Above Area
  • Color skin  — color skin of Above Area items. You could choose between Light (or white) and Dark (almost black)
• Spacing (pixels) — the amount of space the Above Area could have
  • Top & bottom — vertical spacing around Above Area content, measured in pixels
  • Left & right — horizontal spacing around Above Area content, measured in pixels
• Border Bottom — choose color and width for the bottom border of Site Header (pixels)
• Site Notice — enter the site additional notices here
  • Font-size — site notice font-size, measured in pixels
  • Font-weight — how light or bold the site notice could look
• Menu — the Above Area menu
  • Font-size — menu items could have a certain font-size, measured in pixels
  • Font-weight — how light or bold the menu items could look
  • Letter-spacing — the space between letters of menu items, measured in pixels
• Social menu  — the Above Area social menu, that consists of social icons
  • Font-size — social icons could have a certain font-size, measured in pixels

The Site Header of your Theme has a specific look on mobile devices in order to adapt itself to the screen size. As the Site Header appears with a different layout, you might need to change couple of its style options.

• Color style — affects both the backgound color and content items color of Site Header on mobile devices
  • Background — background color of Mobile Menu
  • Color skin  — color skin of Mobile Menu items. You could choose between Light (or white) and Dark (almost black)