How to make the main menu clickable in shopify dawn 15.0

Shopify Discussion
, , , ,

Topic summary

Goal: make a top-level main menu item in Shopify Dawn 15.0 navigate to a collection/all-products page while it also has a dropdown.

• Default behavior: If a main menu item has submenus, clicking it opens the dropdown rather than following its link. Linking works only when no submenus exist.
• Non-code workaround: Remove all submenus from the main item, then set its link (e.g., to the desired collection or the all products page). This achieves click-through but sacrifices the dropdown.

• Proposed coded approach: Change theme behavior so the arrow controls the dropdown and the parent text navigates. Variants mentioned include hover to expand the dropdown, click on text to go to a link, or attaching hover to the arrow and link to the text.
• Technical note: This requires custom JS/HTML adjustments in the header/menu to separate the arrow and text click/hover actions. “Collection” refers to a grouped set of products; “all products” is the full catalog.

• Additional idea: Use a subcollection mirroring the main collection and link accordingly (details not provided).
• Status: No definitive code solution shared; discussion is open with requests for implementation guidance.

Summarized with AI on December 20. AI used: gpt-5.
1

I want to make mainmenu clickable in shopify.

When I click on it, it shows my sub menu but I want that when i click on it, it will redirect me to show all the products that is in that collection in the main menu.

I hope someone can help me with this problem.

Theme : Dawn 15.0;

2

Hello @myl1

To Make Main Menu Items Clickable:1. Edit the Navigation Menu:

  • Go to online store-------> Navigation.
  • Find the main menu you want to edit and click on it.

  1. Set the Link for the Main Menu Item:

    • For each main menu item that you want to make clickable, ensure it has a link to a collection or any other desired page.
    • Click on the menu item and set the “Link” field to the collection page.

let me know if this was helpful.

3

Hi Rahul,

Thank you for your response. I did this but it only clickable in the sub menu’s and not the main collection. I was wondering how to fix this!

4

You have to remove all your sub-menu from your main menu and then
provide your link of "product/all " to your main menu.
when there will be no Sub Menu in main Menu, the Main menu will be redirected to all products page.

5

But is there no possibility to add sub menu’s to a main menu? Because that is what I want

6

No, if you have sub-Menu beneath Main Menu then -----on click of Main Menu, sub Menu will be shown.
main menu cannot be redirected to all products without showing sub menu.

1 Like
7

Unless he wants to change this behavior, like clicking an arrow is dropdown, and clicking the text is a link to where he wants. If so, that’ll involve some code to change the behavior of menus in your theme.

8

@joshcorbett I currently have some custom js that allows the menu to dropdown when hovered over. Ideally I would like to have it so hover expands the dropdown and click goes to a link. If that isn’t possible I was thinking I could have the hover action attached to the arrow, and then have the link on the text of the parent menu item like you were saying in your comment. Could you explain a bit how you would separate the arrow and text action?

9

Just make a subcollection with the same name as your main collection and link to the main collection.