The header is probably one of the first things you will want to set up on your website. The header consists of a series of elements such as logo, navigation menu, social icons and contact information. All these elements, such as colors, fonts, images, etc. can be customized by the Theme Options panel. 

Below is an example of how you can setup the Header Style 5.

Header style

Navigate to Theme Options > Headers > Style

  1. Select Header Style: Three
  2. Sticky Menu: Enable/Disable sticky menu
  3. Mobile Sticky Menu: Enable/Disable sticky menu in mobiles

Styling header colors

Before to customize header colors is important that you know which header style your website is using. If you don’t know which is one, navigate to Theme Options > Headers > Style to check the header style has been selected.

To customize header colors navigate to Theme Options > Styling > Headers and Select Header Type Header 3 & 5

Menu colors

  1. Background Color (Choose Background Color For Top Area): Select Color.
  2. Background Color (Choose Background Color For Menu Area): Select Color.
  3. Links color: Select Color
  4. Links Hover color: Select Color
  5. Links Hover Background color: Select Color
  6. Border color: Select Color
  7. Social Incos color: Select Color

Submenu dropdown colors

  1. Background Color: Select Color
  2. Links color: Select Color
  3. Links Hover color: Select Color (or Transparent)
  4. Border color: Select Color (or Transparent)

Create listing button colors

  1. Button Text color: Select Color
  2. Button Text Hover color: Select Color
  3. Button Color: Select Color
  4. Button Hover Color: Select Color
  5. Button Border: customize button borderline 
  6. Button Border Hover Color: Select Color (or Transparent)

Header typography

To customize the header typography Navigate to Theme Options > Typography and use the font options available in the Headers box.

Was this article helpful to you?