Header
How to edit header in your store?
Last updated
How to edit header in your store?
Last updated
The header is a content block at the upper part of your website that appears on every page. It usually contains the logo of a store, the main navigation menu, and other elements such as a search bar, language selector, etc.
The header plays a vital role in branding your site, helping visitors navigate, and displaying your most important pages.
You can freely customize your header to suit your business needs by choosing the main menu, and other addons.
Steps:
Go to Online Store > Themes > Customize.
Choose Header section
Make necessary changes > Save.
Click Select menu to connect a menu (assembled in the Navigation admin). You can choose your desktop menu and mobile menu separately.
Set the menu's dropdown to be opened by clicking or hovering on the menu items using the Dropdown menu trigger setting.
Enable the Show separator line checkbox to delineate the header from other sections with a separator line.
Decide how the logo and menu are displayed on your header.
Set your header to be visible when scrolling up or always visible using the Sticky header setting.
You can also enable a separator line between the header and other sections below.
You can enable a transparent header to create a visually appealing and immersive experience for your customer. This feature allows the first section to seamlessly blend below your header, rather than appearing separate.
Enable transparent header: Enable transparent header for your theme
Color: Change the color of the text on transparent header
Decide the logo position on mobile view:
Logo left, hamburger menu icon right
Logo center, hamburger menu icon left.
Enable language selector: to include a Language selector dropdown for customers to select their preferred language.
Enable country/region selector: to include a Country selector dropdown for customers to select their region and currency.
To add, remove, or edit menus in your Shopify store, see
To add your logo, go to Theme settings > .
Show social media icons: based on your settings in Theme settings > .
