Nested / Sub Dropdown Menu for (Almost) Any Shopify theme Based off of Timber
- Replace site-nav.liquid with the snippet below.
- Add the styles below to timber.scss.liquid.
- Go make popcorn.
- Check your homepage to see if this has worked.
- It didn't work.
- Eat the popcorn and try to figure out what went wrong.
If this modification breaks your theme, chances are the issues lies with these two lines: border: 1px solid $colorBorder; background-color: $colorBody;
Replace these sass variables with hex colours. i.e. border: 1px solid #ccc; background-color: #fff;
Thank you for this. It worked first time with the supply theme. Just a query, is there a way to have the "grandchild" list not appear below the "child list" and rather, when hovering over "child list" the grandchild" list appears to the right.
See an example if found on another site:
When hovering the mouse over Speakers, the categories under Speakers appear to the right.