Header

The header is a user’s first touchpoint upon entering an online store, offering a streamlined overview of key elements. It prominently displays the brand logo, main navigation links, and essential tools like the search bar and cart icon, setting the tone for a smooth and engaging shopping experience.

Steps:

1. Go to Online Store > Themes > Customize.

2. Choose Header section

3. Make necessary changes > Save.

Settings

• Width - Width of the header -> 3 options : Container / Streched / Full width

• Desktop logo position - 5 Options

  • Logo top left, menu left

  • Logo center ,menu below

  • Logo center, menu left

  • Logo center, menu drawer

  • Logo left, menu left

  • Logo left, menu center

• Logo image - Upload your store's logo

• Desktop logo width - Customize the size of the logo on desktop screens

• Mobile logo width - Customize the size of the logo on mobile screens

• Menu ( Navigation ) - To add, remove, or edit menus in your Shopify store, please refer to: Editing menus

You can create megamenu

• Sticky header - 3 Options => None, On scroll up, Always

• Show border - Show border bottom

Country/region selectort

To display the currency selector, language selector, and account icon on the storefront, configure these settings with in the Shopify admin.

Transparent header

• Enable - Home page only. For best results, use an image section such as slideshow.

• Text color

• Logo image - Displayed when transparent header is enabled. Uses the dimensions set on your main logo.

Mobile

• Mobile logo position - Center / Left

Spacing

• Bottom margin - Margin bottom of the header

Section padding

• Padding top - Padding top of the header

• Padding bottom - Padding bottom of the header