Header Builder

WebGatha comes with six predefined header styles with different settings and options, by using them in combination, you can create a customized header.

Header Builder allows you to create a custom header, which you can use as header.
You can set which header to use for all pages using theme settings in Theme Options. The header builder is an intuitive drag and drop header editor. With the help of a header builder, you can create customized, eye-catching and impressive unlimited headers with an infinite number of styles by just drag and drop.

You can use a component at different locations, like Top Bar, Main Header or in the Header Bottom, and you can set individual properties for each. The header builder provides better and precise control over header elements. Header builder also provides the facility to create customized and responsive headers for mobile devices too, which gives a great user experience on all devices and platforms.


Enable Header Builder in Theme Options

By default, the theme will display predefined header styles. You can display custom header by enabling it by selecting “Header Builder” in Theme Options > Header > Site Header > “Select header type” field. Enabling custom header will enable another field, named “Select Custom Header”, next to the “Select header type” field, in which you can choose custom header built-in Header Builder section.


Header Builder Sections

A header consists of three sections:
1. Top Bar: As the name suggests, it’s the top area of the header.
2. Main Header: As the name suggests, it’s the main area of the header.
3. Header Bottom: As the name suggests, this row is located at the bottom of the header.


Header Builder Components

Header builder comes with the below components:

  1. Account: Add a login and register links and form.
  2. Button: Create buttons with various styles and options.
  3. Cart: Add WooCommerce Cart icon.
  4. Compare: Add WooCommerce Compare icon.
  5. Currency: Add WooCommerce currency switcher dropdown.
  6. Divider: Add a separator to divide the header content.
  7. Email: Add email address.
  8. Static Block: Select and add a Static Block content.
  9. Language: Add language switcher/selector dropdown.
  10. Logo: Add a logo in the header. Settings to customize the logo options are available in the theme options.
  11. Menu: Add any existing WordPress menus to the header.
  12. Phone Number: Add a phone number to the header.
  13. Primary Menu: Add menu assigned in the Primary menu location.
  14. Search: Add a WordPress search form.
  15. Social Profile: Add social profile links to the header. Social profiles can be managed from Theme Options.
  16. Space: Add horizontal space between two elements.
  17. Text Block: Add text/HTML content with WYSIWYG editor.
  18. Wishlist: Add WooCommerce Wishlist icon.


Suggest Edit