Dropdown menu

Store Design
, , , , , , ,

Topic summary

A user working with Shopify’s free Fabric Theme wants to implement mixed navigation styles: full-width mega menus with images for some items, and simple dropdown menus for others without images—similar to the Prestige theme.

Current limitation:

  • Fabric displays all menus as full-width by default, regardless of content
  • Simple dropdowns only appear with flat, single-level sub-item structures

Proposed solution:

  • Customize theme files (header.liquid or mega-menu.liquid)
  • Use Liquid templating and CSS to conditionally apply different menu layouts based on whether images are present
  • This requires code-level modifications beyond the theme’s default settings

The discussion confirms this customization is technically feasible but requires manual theme editing.

Summarized with AI on October 27. AI used: claude-sonnet-4-5-20250929.
1

There are places in the header mega menu where we don’t use images,

Can’t we use a dropdown menu for such places??? Now even that is visible in full width. I am using the new free “Fabric Theme”.

1 Like
2

The Fabric Theme shows full-width mega menus by default, even without images. To use a simple dropdown, structure your menu with only one level of sub-items. For more control, you can customize the theme code or use CSS to narrow the menu width.

1 Like
3

Thank You for Your Reply!! Can we use simple dropdown for sub-items??

4

Yes, you can use a simple dropdown for sub-items by keeping the menu structure flat — just one level of sub-items under the main menu. Avoid adding multiple columns or nested items to trigger the simpler dropdown style.

1 Like
5

No. I also want to add images to the mega menu. I want to use the normal dropdown for menu items that don’t have images. Like this theme header . - https://themes.shopify.com/themes/prestige/styles/couture/preview

6

you can absolutely have images in the mega menu for certain items. The Fabric theme shows all menus as full-width by default, but to get simple dropdowns for items without images (like Prestige), you’ll need to customize the theme code. This involves editing header.liquid or mega-menu.liquid to apply different layouts based on each menu item. It’s doable with a bit of Liquid and CSS.