The header is the top block present on all pages of the website. You can customize the structure and visual display of this block in Website → Design → Design editor → Header section.
In the design editor, you can change the colors of the background and header elements.
Header style
In this section, you can define the basic header settings.
Height — the height of the header, possible values are S, M, L.
Header background — the header color.
Homepage header background — a different color to display the header on the home page, if necessary.
Elements color — the color of the elements in the header, such as the language switcher, shopping cart, etc.
Icons color — the color of the icons that accompany the header elements.
Links color — the color of the links in the header.
Header top line
Separately, you can set the background and color of the elements for the top line of the header.
Quantity badge
Quantity badges are product quantity informers that appear in the header elements, namely, the number of products in the favorites, comparison list, and shopping cart. You can set the background of the icon and the color of the number displayed in it.
Header elements
In this tab, you can define the display style of complex header elements such as shopping cart and catalog menu, as additional settings are available for these elements.
Shopping cart
Icon — defines the type of the cart icon in the header.
Icon color — defines the color of the cart icon in the header.
Elements — the presence of additional items, for example, the total price of items in the cart, etc.
Catalog navigation menu
The catalog menu block can be displayed as a button in the header or as a regular menu. In this tab, you can set the background colors for the menu, the colors and style of displaying category names, as well as include icons for the main categories and subcategories in the catalog.
Header layout
If you want to change the location of an individual element in the header or enable/disable the display of an element, please contact the support team.
You can see examples of different header layouts in our Template gallery.
List of all possible header elements
Navigation menu
Social media
Language switcher
Currency switcher
Products comparison
Favorites
Personal account
Logo
Catalog categories menu
Slogan
Contact information
Hours of operation
Shopping cart