How can I add a multi-column header bar on my website?

2 0 0

Hi there,


I'm trying to add a multi column bar into my header below the menu but am not able to figure out how. Announcement bars rotate but I'd like to have a sticky 3 column section calling out key points around the brand... i.e. social proof, free delivery etc. Does anyone know how? I'd also want custom links.... 


An example below:




Reply 1 (1)

Shopify Expert
3477 461 520

Hi @DigitalYR ,

As your requirement: "create Multiple columns in header", you can follow my guide: 

Step 1: Make a multi-column nested menu (meganav) in the header: 

Online store => Navigation => Add menu

view - 2024-01-08T095518.955.png

Step 2: Select # to make multi-column nested menu. In this example, Collections is the parent page.

view - 2024-01-08T095552.809.png

Step 3: Make some nested page. In this example, Collection 1 is children page. After you make a new menu item, you Drag and drop that page in parent page.

view - 2024-01-08T095621.276.png

You can create another children page nested and save these changes: 

view - 2024-01-08T095649.754.png

Result like image: 

view - 2024-01-08T095720.339.png

Step 4: Online Store =>  Themes => Customize: In Header Sections, you choose new menu that has just been created and save the changes. 

view - 2024-01-08T095803.360.png

So after all, you can create a multi-column nested menu (meganav) in the header if you want.

I hope it helps, please tick mark as solution for me! 

Have a nice day!


If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development