Header

In the Header section, you can find the settings where you can adjust each element of the header.

There are 4 sub-panels: Main, Sticky, Logo&Title, Menu, Buttons/Action, and Socials. See below for information on what each section contains.

The Header settings may differ depending on the Installed layout and selected Header Style.

Main

Header Layout

On the Header Layout field, you can select the header style of your website.

Let's have a look at the header styles:

Dealer:

Dealer Two:

Classified:

Classified Five:

Boats:

Motorcycle:

Rental:

Magazine:

Aircrafts:

Equipment:

Header Background Color

On the Header Background Color field, you can set the header background color.

The indicated color will not apply if the Transparent Header option for the page is enabled under the Page option area:

Mobile Header Background Color

‌Set the header background color on the Mobile Header Background Color field.

This option is available only on the Dealer, Motorcycles, and Magazine header styles.

Listing Layout Header Image for Non-transparent Option

‌Also, you can use the image as a header background. Upload your wished image under this field.

This option is available only in the Classified header style.

‌Here you can set the margins for the menu and icon area.

Header Text Color

‌On the Header text color section indicate the color of the text on the header area:

This option is not available on the Dealer Two, Classified, Classified Five, and Aircrafts header style.

‌Mobile Header Text Color

‌Here you can set the mobile header text color:

Header Socials Icon Color

Set the color of socials icons on the header area on the Header Socials Icon Color field.

This option is available only on the Dealer, Motorcycles, and Magazine header styles.

To specify which social to display on the header area go to the Header > Socials section in the Theme Options.

The social networks buttons will be displayed only if the links to these social networks are provided in the Socials tab (Theme Options > Socials)

‌Phone Settings

‌On the phone settings area, indicate the contact phone to display them on the header.

The Phone Settings option is available only on the Dealer, Motorcycles, Rental, and Equipment header styles. However, the available options in this section may vary depending on this header style.

On the Dealer header style, there are two phone fields: Main and Secondary. The Main contact phone displays on the mobile header.

Address Settings

‌On the Address settings area set the address section on the header. On the Address field specify your address. Pick the address Icon and indicate the icon size on the Address Icon section.

On the Google Map Address URL section insert the map embed link to show this address on the pop-up map.

To get the embed map code, open your needed address on Google Maps, click the Share button and open the Embed a map section. Use the link inside the SRC attribute:

Sticky

Here you can enable the Sticky header, set the paddings, and indicate the background color of the sticky header.

The sticky header does not work on the mobile header.

Logo & Title

In this section, you can set the website logo and title settings.

‌Logo

On the Logo field, upload the Logo file.

Logo Width (px)

Specify the logo image width in px on the Logo Width (px) field.

The height of the logo image will increase proportionately.

Text Logo Font Family

If there is no Logo image upload, the Website Title will be displayed instead of the logo. On the Text Logo Font Family area, configure the logo font settings as font family, font-weight & Style, font size, font color, and so on.

The website title can be changed on the Settings > General section of the admin dashboard.

Here you can set the header menu font and color settings.

‌You can select the font family, specify font-weight, and style, adjust the font size, text-align, text-transform, and line-height of the menu text. Also, select the Backup Font Family as the fallback if the main font will not be loaded.

SubMenu Font Family

On the SubMenu Font Family field set the sub menu's text Font Family, Font Color, and Backup Family:

Margin

Adjust the Menu section Margin options:

‌Item Padding

On the Item Padding field indicate the padding option for menu items:

Background Color

Here you can set the menu section background color.

This option is available only on the Dealer and Motorcycle header styles.

The indicated color will not apply if the Transparent Header option for the page is enabled under the Page option area:

Item Background Color

Set the background color of menu items blocks:

The Item Background Color option is not available on the Rental header style.

Item Hover Background Color

Indicate the menu item block hover color:

This option is available only on the Dealer and Motorcycle header styles.

Item Hover Text Color

On the Item Hover Text Color set the menu item text color on hover action:

The Item Hover Text Color option is not available on the Rental header style.

Buttons/Actions

‌On the Button/Action tab located the settings of the header icons.

Show Compare

Enable the Show Compare button to display it on the header area. Pick the icon, indicate the icon color, and set the icon size on the Compare Icon section:

The Show Compare option is not available on the Rental header style.

The compare page should be indicated under the Theme Option > Invetry Settings > Main > Compare Page field.

Show Cart

Display the WooCommerce cart on the header by enabling the Show Cart option:

The Show Cart option is not available on the Rental header style.

The cart requires the WooCommerce plugin to be installed and set up.

Compare and Cart Buttons Hover Background Color

‌Here you can set the Compare and Cart buttons background color on hover:

Compare and Cart Buttons Hover Text Color

Set the Compare and Cart buttons Text color on hover:

Show Profile

Enable the Show Profile button to display the Profile icon on the header.

The Add a Car button is available on the Classified and Classified Five header style.

On the Profile icon settings configure the icon options and set the profile button hover background color and profile button hover text color on appropriate fields:

Add a Car Button

Display the Add a Car on the header by enabling the Show Add a Car Button.

The Add a Car button displaying depends on the installed layout, not on the selected header style. The Add a Car button is available on the Classified Listing, Classified Listing Two/Three/Four, Classified Ads (with different types), and Classified Ads Two (with different types) layouts.

On the Label field indicate the Add a Car button text. Set the button options as background color, hover color, text color, add car icon settings on the appropriate fields. Enter the Add a Car page URL slug on the Link field as below:

The Add a car should be indicated under the Theme Option > User Dealer > Add a car field.

Show Search Button

Enable the WordPress default search option on the header area.

This option is available only on the Dealer header style.

Configure the search icon option on the Search Button Icon area. Indicate the icon hover background color and text color on hover on the Search Button Hover Background Color and Search Button Hover Icon Color fields respectively.

Socials

On the Socials section specify which socials to display on the header.

The social networks' buttons will be displayed only if the links to these social networks are provided in the Socials tab (Theme options > Socials)

PreviousTop Bar NextBlog Page

Last updated 3 years ago

Was this helpful?