List Shopify themes integration
This is a list of the most popular Shopify themes and how Smart Menu works with them.
If your theme is not in the list, it does NOT mean Smart Menu is incompatible with it. Please contact us if you can add the menu to your theme.
✔ = fully compatible | Δ = work on some cases | ✘ = incompatible
If your theme is not in the list, it does NOT mean Smart Menu is incompatible with it. Please contact us if you can add the menu to your theme.
✔ = fully compatible | Δ = work on some cases | ✘ = incompatible
| Theme | Compatibility | Menu type | Note |
|---|---|---|---|
| Debut | ✔ | Horizontal menu | |
| Dawn | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Spotlight | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Craft | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Sense | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Refresh | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Trade | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Studio | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Origin | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Ride | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Publisher | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Taste | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Crave | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Colorblock | ✔ | Horizontal menu | If the "Auto" method does not work, please use CSS selector method with these selectors: desktop > .list-menu.list-menu--inline, mobile > .menu-drawer__menu.list-menu |
| Minimog | ✔ | Horizontal menu | CSS selector: desktop > .m-header__desktop .m-menu, mobile > .m-menu-drawer__navigation.m-menu-mobile |
| Jumpstart | ✔ | Horizontal menu | |
| Venture | ✔ | Horizontal menu | |
| Boundless | Δ | Horizontal menu | Sidebar menu |
| Simple | ✔ | Vertical menu | |
| Narrative | ✘ | Fullscreen vertical menu | Incompatible |
| Brooklyn | ✔ | Horizontal menu | Theme will change horizontal menu to sidebar if menu is too long. Please contact us to make it always show the horizontal menu. |
| Supply | ✔ | Horizontal menu | |
| Minimal | ✔ | Horizontal menu | |
| Pop | ✘ | Vertical menu | Incompatible |
| Warehouse | ✔ | Horizontal menu + Condensed menu | Only work with Horizontal menu. In theme settings, please choose menu as Inline, not Condensed. |
| Prestige | ✔ | Horizontal menu + Slide bar | Should change navigation style in theme settings to Center. Use CSS selector method to replace both desktop and mobile menus. |
| Empire | ✔ | Horizontal menu | In theme settings, must remove Main menu in Header > Quick links |
| Impulse | ✔ | Horizontal menu | Cannot work if theme's using logo center, menu split → change Logo position to "Logo center, menu below". In theme settings, should remove menu on toolbar. |
| District | ✔ | Horizontal menu | |
| Motion | ✔ | Horizontal menu | |
| Blockshop | ✔ | Horizontal menu | |
| Parallax | ✔ | Horizontal menu | |
| Testament | ✔ | Horizontal menu | |
| Venue | ✔ | Horizontal menu | Should change navigation style in theme settings to Center |
| Pipeline | ✔ | Horizontal menu | |
| Envy | ✔ | Horizontal menu | In theme settings, should remove main menu in Top bar |
| Icon | ✔ | Horizontal menu | In theme settings, must set navigation style as "Full horizontal", not "Slideout vertical" |
| Atlantic | ✔ | Horizontal menu | |
| Fashionopolism | ✔ | Horizontal menu | |
| Symmetry | ✔ | Horizontal menu | Only can work best when choose Menu alignment as "Underneath" in theme's settings. |
| Responsive | ✔ | Horizontal menu | Remember to add submenu background color in app |
| ShowTime | ✔ | Horizontal menu | |
| Mr Parker | ✔ | Horizontal menu | In theme settings, should set Logo position: inline and Alignment: left. If logo is set above navigation, should use CSS selector method |
| Theme | Compatibility | Menu type | Note |
|---|---|---|---|
| Retina | ✔ | Horizontal menu | |
| Vantage | ✔ | Horizontal menu | |
| Boost | ✔ | Horizontal menu | |
| Canopy | ✔ | Horizontal menu | In theme settings, should not choose Mobile navigation style on desktop |
| Modular | ✔ | Horizontal menu | In theme settings, should choose Navigation layout as Standard |
| Startup | Δ | Horizontal menu + Sidebar menu | Can only replace horizontal menu, not work with Drawer menu (sidebar) |
| Split | ✔ | Horizontal menu + Sidebar menu | In theme settings, should choose Desktop menu style as Classic |
| Grid | ✔ | Horizontal menu | |
| Masonry | ✔ | Vertical menu | |
| Flow | ✔ | Horizontal menu | |
| Sunrise | Δ | Horizontal menu + Sidebar menu | Can only replace horizontal menu, can't show up on mobile |
| Avenue | ✔ | Horizontal menu | |
| Loft | ✔ | Horizontal menu | |
| Showcase | Δ | Sidebar menu | Can only show as mobile menu in sidebar |
| Launch | ✔ | Horizontal menu | |
| Mobilia | ✔ | Horizontal menu | In theme settings, should remove Main menu in Top bar |
| Cascade | ✔ | Horizontal menu | |
| Pacific | ✔ | Horizontal menu | In theme settings, should remove Main menu in Sidebar |
| Artisan | ✔ | Horizontal menu | |
| Providence | ✔ | Horizontal menu | |
| Trademark | ✔ | Horizontal menu | In theme settings, should change logo position to left |
| Handy | ✔ | Horizontal menu | |
| Kingdom | ✔ | Vertical menu | |
| Galleria | Δ | Horizontal menu + Sidebar menu | Need to change navigation type in theme settings to Horizontal menu, not Minimal top. Should use CSS selector method. |
| Story | ✔ | Horizontal menu | |
| Palo Alto | ✔ | Horizontal menu | |
| Maker | ✔ | Horizontal menu | If menu is too long, theme turns to sidebar menu |
| Label | ✔ | Horizontal menu + Sidebar menu | |
| Colors | Δ | Horizontal menu + Sidebar menu | Must use CSS selector method. In theme settings, must uncheck the "Show on mobile" of horizontal menu |
| Kagami | ✔ | Horizontal menu | In theme settings, should change Navigation mode to Horizontal |
| Vogue | Δ | Vertical menu + Sidebar menu | If theme uses Compact header → only select mobile menu, leave "Select your main menu" blank |
| Ira | ✔ | Horizontal menu | |
| Local | Δ | Sidebar menu | |
| Editions | ✔ | Horizontal menu | |
| Capital | ✔ | Horizontal menu | |
| Reach | ✔ | Horizontal menu + Sidebar menu | In theme settings, should choose Navigation layout as Expanded |
| Editorial | ✔ | Horizontal menu | |
| California | Δ | Horizontal menu + Sidebar menu | Use CSS selector method: desktop > .menu ul, mobile > .side-nav ul |
| Alchemy | Δ | Sidebar menu | Only work as mobile menu in sidebar |
| Expression | ✔ | Horizontal menu | |
| Lorenza | Δ | Horizontal menu + Sidebar menu | If theme uses Compact menu → only select mobile menu, leave "Select your main menu" blank |
| Focal | ✔ | Horizontal menu | |
| Broadcast | ✔ | Horizontal menu | |
| Ella | ✔ | Horizontal menu | Use CSS selector method with these selectors: Desktop > #HeaderNavigation, Mobile > #navigation-mobile > div > div.site-nav-mobile.nav |
| Shoptimized | ✔ | Horizontal menu | |
| Booster | ✔ | Horizontal menu | |
| Wokiee | ✔ | Horizontal menu | |
| Fastor | ✔ | Horizontal menu | |
| Superstore | ✔ | Horizontal menu | In theme settings → Performance → need to uncheck "Use Turbolinks" option |
Updated on: 26/02/2025
Thank you!