Hello, I’m trying to get my website so that nested/submenus will remain, hover to drop down, on desktop but to have them auto open when the menu tab is clicked on mobile. Currently on mobile when you click on the menu drop down the “Shop” menu is expandable but with it being a parent menu (requiring…

Hi @Thehumblebee , I understood your request, go to section-header.min.css and paste this at the bottom of the file: @media (max-width: 720px){ .navigation-list-item>.navigation-list { display: block !important; } } It will display fine.

Hi @Thehumblebee , Please follow these steps: Step 1: Go to Online store > Themes > Actions > Edit code. Step 2: Go to Assets > theme-collection.min.css and paste this at the bottom of the file: @media (max-width: 720px){ .main-navigation .navigation-dropdown-toggle { width: 100%; backgroun…

Thanks for your assistance but that didn’t do anything.

Hi @Thehumblebee , Sorry for the confusion, you can move all the code to file: section-header.min.css Just you need to move all the code I show to the file: section-header.min.css , it will work fine. Hope it helps!

hi @Thehumblebee , I checked and the code still hasn’t been copied. And are you wanting this: https://i.imgur.com/exy93Fm.png You can check the link: https://thehumblebeeandco.com/collections/all

I removed the code because it was causing the menu header to flash from black to the button in mobile view. The “Shop” menu you posted is a nested menu with the + allowing the submenu to drop down. I want it to be expanded automatically when you open the menu in mobile view. Shopify requires me to …

That did the trick, thank you so much!

@LitExtension Hi! I am facing the same issue in colorblock theme. I could not find section-header.min.css in my theme files to add the code. If you can guide me with the same, it would be really helpful to me. Thankyou in advance.

Hi @Janani , You can create a question on the community and send me the link. I will check it. Because this will help build a better community. Thank you.

Hi! I posted the question in the community board. Here is the link below. https://community.shopify.com/topic/1687695 Looking forward to your response. Thankyou.

How can I optimize mobile menu navigation for better customer experience?

Technical Q&A

Thehumblebee October 27, 2021, 2:15pm 5

Yeah, still no change. All the code did moved to section-header was cause the top menu bar to flash when opening in mobile view. The menu still stays nested instead of expanded.

Topic		Replies	Views
Mobile Navigation Menu - Automatically Open First Sub-Menu Shopify Discussion shop-performance	5	88	July 5, 2024
Sublinks Dropdown on Hover in Narrative Theme Store Design	5	31	February 18, 2022
How to make submenus auto-visible in mobile view on Colorblock theme? Technical Q&A	2	24	August 8, 2022
Drawer menu on mobile sub categories not collapsed Store Design design	4	29	January 21, 2023
Supply Theme - Mobile Navigation Submenu not working Technical Q&A shopify-theme	4	99	November 15, 2022

How can I optimize mobile menu navigation for better customer experience?

Related topics