Header
The header is the top section of your store, containing key elements like the logo, navigation menu, search bar, and cart icon to help customers navigate the site easily.
Last updated
The header is the top section of your store, containing key elements like the logo, navigation menu, search bar, and cart icon to help customers navigate the site easily.
Last updated
To install Header section in our app. You can follow these steps and the images below:
From our app, click Library
In the Sections tab, search for the keyword "header".
Click Install and Customize the header you want
From the Shopify editor sidebar, click Add Section.
Select the header section you want.
HOW TO USE:
Click the hotspot to see the next step. You can also use -> <- on the header tab to follow.
Click Add Block.
Select the Mega Menu (Collection) block.
Enter the name of menu item. For example, I want to select the Shop item.
Select the number of column displayed on desktop.
Select the Collections to display on.
Click Add Block.
Click Mega Menu (Banner) block.
Enter the name of menu item. For example, I want to select the Shop item.
Select the Number of Column Displayed on Desktop.
Choose the Banner Position to left or right side.
Select the Image you want to set it up as banner.
In the Heading field, enter the title of banner.
Choose the Heading Size, and insert the Link of banner or URL of product.
Click Add Block.
Click Mega Menu (Products) block.
Enter the name of menu item. For example, I want to select the Shop item.
Select the Number of Column Displayed on Desktop.
Enter the Heading of product banner.
Choose the Heading Size.
Select the Products you want to display on the mega menu
Choose the Media Ratio.
Choose the Media Shape.
Adjust the Content Alignment.
Enable to show Add To Cart button.
Enable to show Price.
Enable to show The second image on hover.
Enable to show Vendor.
Enable to show Color Swatch
Click Add Block.
Click Mega Menu (Product Tabs).
Enter the name of menu item. For example, I want to select the Shop item.
Select the Collections you want to display on the mega menu
Select the Number of Product Column displayed on desktop.
Choose the Media Ratio.
Choose the Media Shape.
Adjust the Content Alignment.
Enable to show Add To Cart button.
Enable to show Price.
Enable to show The second image on hover.
Enable to show Vendor.
Enable to show Color Swatch.
Click Add Block.
Click Menu Label.
Enter the Label of menu. For example: Hot Items
Select the Color Background for the label.
Select the Color Text.
Enter the Menu Name for the label.
Select the Animation for the label.
Click Add Block.
Click Search Suggestions block.
Enable Recent Search function.
Enter the Popular Search Keywords.
Enter the Heading of Product Recommendation.
Choose the Heading Size.
Select the Product that you want to display on search bar.
Display the Number of Columns on desktop.
Choose the Media Ratio.
Choose the Media Shape.
Adjust the Content Alignment.
Enable to show Add To Cart button.
Enable to show Price.
Enable to show The second image on hover.
Enable to show Vendor.
Enable to show Color Swatch.
To open window in a full screen, click for better experience
If you would like to add or edit the menu, you can find instructions .