How do i add a different menu to my website having a hard time

How do i add a different menu to my website having a hard time

cupcosmos
Visitor
1 0 0

My website is cupcosmos.com I created a second page called Shirt Cosmo and would like to know how to make my second menu stick to it. My second menu is called Shirt Collection? I'm not tech savvy with code so if someone could write it and let me know where to put it that would be great. 

 

Thanks in advance 

Replies 3 (3)

KabirDev
Shopify Partner
248 61 75

To make your "Shirt Collection" menu stick to your "Shirt Cosmo" page on your Shopify site, you'll need to edit the Liquid template for that specific page in your theme's code. This typically involves accessing the Shopify admin, going to Online Store > Themes > Actions > Edit code, and then modifying the Liquid file for your "Shirt Cosmo" page. If you're not comfortable with coding, it's advisable to consult with a Shopify expert or use a Shopify app designed for custom menu creation, which can provide a user-friendly interface for this task.

- Control payment methods visibility at checkout by KlinKode PayRules app.
- Contact me directly at shahriar@kabirdev.com

PaulNewton
Shopify Partner
7721 678 1625

Hi@cupcosmos Implementation , or even workarounds, varies wildly among themes. 

If you want a literal second menu system with settins, etc and you need this customization then contact me by my email for services.
Contact info in forum signature.
ALWAYS please provide context, examples: store url, theme name, post url(s) , or any further detail in ALL correspondence.

 

 

The crudest way if you know how and know CSS for single item navigation rows is to just add the "second" menu as a links/submenu of the main navigation, then hide all the nav elements except the "second" menus links on the page through CSS and liquid.

 

Roughly, untested:

{% if page.handle == "shirts" %}
<style>
header nav.header__inline-menu .list-menu li:nth-child(1)
,header nav.header__inline-menu .list-menu li:nth-child(2)
,header nav.header__inline-menu .list-menu li:nth-child(3)
,header nav.header__inline-menu .list-menu li:nth-child(4)
,header nav.header__inline-menu .list-menu li:nth-child(5)
,header nav.header__inline-menu .list-menu li:nth-child(6) {
 display:none;
}
</style>
{% endif %}

 Though this means on every page NOT that page you need to hide these extra links with corresponding CSS.

Contact paull.newton+shopifyforum@gmail.com for the solutions you need


Save time & money ,Ask Questions The Smart Way


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Thank Paul with a Coffee for more answers or donate to eff.org


gr_trading
Shopify Partner
2025 148 205

Hi @cupcosmos ,

 

Please refer to the below video to implement different menu collection wise.

 

 

Don't forget to like and mark as solution if it helps...

For any custom development WhatsApp or connect at Email ID: support@grtrading.in for quick consultation. | Shopify Free codes
To support Buy Me a Coffee