Why aren't the main menu links working?

[lillylove]

Can someone help me fix my main menu? The ones that have a dropdown aren't working. The dropdown links work, but the main link doesn't. 

https://www.oceanbreezeboutique.com/ 

[Roy-ロイ · Accepted solution]

Hi @lillylove, 

Looks like we need to make some code changes.

To get started, follow these steps:

1. Log in to your Shopify Admin panel.
2. Go to Online Store > Theme > Edit code.
3. In the code editor, navigate to the header.liquid file (note: this might vary depending on your theme, but typically mega menus are found here).
4. Find the code similar to the below one. 
   
5. Find the code with the nav element and classes "header__inline-menu header-mega-menu" (specific to the Ocean Breeze theme).
6. You will notice a 'details summary' tag and replace the span element within the summary tag. 
   
7. Replace the span tag with the below code and it should work! (We need to do similar work for the child and grandchild link if its present)

<a href="{{ link.url }}" {%- if link.child_active %} class="header__active-menu-item"{% endif %}>{{ link.title | escape }}</a>​

If you encounter any issues or need help, please don't hesitate to reach out. I'm here to assist you!

[lillylove]

This worked! Thank you! It did change the color of the menu items though. Can you please help me figure that out? I'd like them to be all black 

[PaulNewton]

Hi @lillylove The top level items are not rendering as links at all check theme settings to see if this is an option.

If there's no theme option you will need a theme customization.

On desktop if you've noticed the menus close too early,  that's because there is an unnecessary gap cause by the border between the top level item and the dropdowns so the hover state is lost when moving the mouse down.

If you need this fixed or 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.

[EBOOST]

Hi @lillylove ,

If you use a free theme from Shopify. May I suggest to update code these steps:

1. Go to Store Online-> theme -> edit code

2. Snippets/header-dropdown-menu.liquid

3. Wrap by <a> tag. Refer screenshot below to add code

 <a href="{{ link.url }}">

rmb add

</a>

[ToniG1]

Awesome! This worked! However, it changed the color of menu items with dropdown menus and hyperlinked them. I saw @lillylove had the same issue with the solution. Any tips?

[lillylove]

Click my name to see my other posts. I got a fix to this in the last few days

[ToniG1]

Awesome! Thank you!