Header Specific Elements

As said above, you can add any content elements available in page builder to your header template. Here we will describe briefly header specific elements.

Menu

With this element you can add а menu to your header which you have created in Appearance – Menus :

Menu Source

select the menu to be displayed from the list of menus you have created in Appearance – Menus

Different Source for Mobile

if enabled you can then choose another menu to be displayed on mobile devices

Layout Desktop

you can choose which menu layout to use for the added menu element. For desktop you can choose between horizontal menu, hamburger menu, overlay menu or logo split menu layout. For tablet you can specify whether to use the same layout as chosen for desktop or the layout selected for mobile menus (in this case the menu will be automatically changed to hamburger icon).

Content for Offcanvas Area (Desktop)

in case of selecting “Hamburger” or “Overlay” as “Layout Desktop”, here you can select the content source for the offcanvas bar (“Hamburger” layout) / offcanvas overlay (“Overlay” layout). By default the menu selected in “Menu Source” will be used. However you can select “Section Template” to be used instead of menu. Check this article for more details on section templates

Layout Mobile

select the menu layout for mobile menus

Stretch Menu

with this setting you can stretch the horizontal menu on different devices.

Dropdown Spacing

specify the spacing between the main menu items and dropdown with submenus

Submenu Indicator

enable/disable submenu indicator for your first level in menu

Style Presets

by default all color and typography styles for menu are inherit from theme options. Additionally there are two color presets – light and dark. All this styles can be then customize in “Style” tab (Elementor) / “Appearance” tab (WPBakery).

Secondary Menu

This element is similar to Menu element – it helps to add a menu to your header. However, this secondary menu has another design and is aimed to display some additional “secondary” menu (in addition to the main menu).

Logo

It adds your website logo specified in Theme Options. You can specify which kind of logo to use for desktop and for mobile header. Learn more about  logo settings

Cart

This element adds a cart icon (with mini-cart dropdown) to your header. This works only in case WooCommerce plugin is installed. You can manage the cart icon and label colors in  Theme Options – WooCommerce – Cart & Checkout

Wishlist

This element adds a wishlist icon to your header. It works only in case YITH Wishlist plugin has been installed

My Account

Search Icon

It helps to add a search icon / button to your header with optional AJAX live search. All settings are described in details here

Search Form

This element adds the search form to your website’s header. It is like a search icon: here you can optionally enable AJAX live search, specify the post types for search etc.

Divider

Adds a vertical (or horizintal) separator line. This element is useful for separating different elements inside one header row / section.

Infotext (WPBakery) / Infobox (Elementor)

With this element you can quickly add an information text with an icon, for example phone number or opening hours. For quick editing this element includes a number of presets, which can be selected in Preset select box.

WPBakery:

Social Icons

This elements adds a set of social icons linked to your social profiles to your header.

WPBakery

In the Shape control you can select the shape preset for social icons. And in the Size preset you can quickly select the predefined icon size for the social icons.

Language Switcher

This element adds a language switcher to your header. It works only in case WPML Multilingual plugin is installed on your website. For WPML installation instructions please check this chapter

Currency Switcher

This header element helps you to add currency switcher to your website. It works basing on WooCommerce Multilingual plugin (part of WPML). You can find all detailed steps on configuring currencies for your website in this documentation.

Countdown