Header
Last updated
Last updated
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.
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:
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:
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.
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.
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.
Here you can set the mobile header text 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)
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.
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:
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.
In this section, you can set the website logo and title settings.
On the Logo field, upload the Logo file.
Specify the logo image width in px on the Logo Width (px) field.
The height of the logo image will increase proportionately.
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.
On the SubMenu Font Family field set the sub menu's text Font Family, Font Color, and Backup Family:
Adjust the Menu section Margin options:
On the Item Padding field indicate the padding option for menu items:
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:
Set the background color of menu items blocks:
The Item Background Color option is not available on the Rental header style.
Indicate the menu item block hover color:
This option is available only on the Dealer and Motorcycle header styles.
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.
On the Button/Action tab located the settings of the header icons.
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.
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.
Here you can set the Compare and Cart buttons background color on hover:
Set the Compare and Cart buttons Text color on hover:
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:
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.
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.
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)