The best mega menu examples put a search field and best-sellers at the top, tell shoppers what each category holds, and sort links by what earns.
In our archive, Oliver Kenyon's mega menu with one-line category descriptions (+$151,192/month) and Blend Commerce's always-visible mobile search bar (+19.62% conversion rate) are two of the clearest wins.
How we picked: every example below is a real test or before-and-after result from our database, chosen for a clear change and a reported number.
We did not run these tests ourselves; each one is credited to the team that did.
We cover ecommerce mega menus, mobile menus, and the header and menu changes that helped SaaS and lead-gen sites.
For the full set of tests, see our navigation menu tests hub, or browse more examples.
All 20 examples at a glance
| # | Example (brand or page) | What they did | Result | Type |
|---|---|---|---|---|
| 1 | Tennis gear brand | One-line descriptions and a testimonial, no images | +$151,192/month | Ecommerce |
| 2 | Anonymized store | Trending Now best-sellers row at the top | +$106,886 per month | Ecommerce |
| 3 | Garden furniture store | Search first, Clearance link with discount label | +$92,000/month | Ecommerce |
| 4 | Anonymized store | Search field inside the open menu | +$81,050/month | Ecommerce |
| 5 | Handbag store | Full-screen menu, tall tap rows | +$50,568 per month | Ecommerce |
| 6 | Anonymized store | Links sorted by revenue per session | +$48,607 per month | Ecommerce |
| 7 | Makeup brand | Shade quiz promo moved to the top | +$101,495/month | Ecommerce |
| 8 | Body Ecology | Dropdown replaced with a category page | +56.43% revenue/visitor | Ecommerce |
| 9 | Vegepod | Images beside mobile menu links | +42% revenue per visitor | Ecommerce |
| 10 | Cocohanee | Sub-categories shown on open | +28% conversion rate | Ecommerce |
| 11 | Sports nutrition brand | Drill-down panels, not accordion | +7.25% conversion | Ecommerce |
| 12 | Stone Creek Coffee | Grouped by flavor: Bright, Balanced, Bold | +11% revenue per visitor | Ecommerce |
| 13 | Anonymized store | Flat menu, no dropdowns | almost +12% checkouts | Ecommerce |
| 14 | YSL Beauty | Offers tab moved first | +10% transactions | Ecommerce |
| 15 | Fame on Central | Visible search field, not an icon | +19.62% conversion rate | Ecommerce |
| 16 | Goat Milk Stuff | Text labels on header icons | +10.37% conversion rate | Ecommerce |
| 17 | RMIT Online | Courses dropdown in mobile header | +7.78% lead form submissions | Lead gen |
| 18 | Cosentino | Contact link added to main menu | +140% leads from Contact page | Lead gen |
| 19 | Harvard Business Services | Clearer tab names, fewer tabs | +15.68% completed orders | Lead gen |
| 20 | Westfund | Get a Quote button in sticky nav | +10.82% quotes started | Lead gen |
Dollar figures per month are the practitioner's own estimates or forecasts from the test, not booked revenue.
Percentages are the lift on the metric named.
The 20 navigation and mega menu examples
1. Mega menu with one-line category descriptions and a testimonial
What they did: A tennis and racket gear brand tested three mega menus.
The winner added one line of spec-focused description under each category and a customer testimonial under the list, and it shrank the service links. A second variant used category thumbnails instead.
Why it works: The category names were already clear, so a picture added little.
A short line telling shoppers what is in each category helps them pick faster, and the testimonial adds trust at the moment they choose where to go.
Result: +$151,192/month (Oliver Kenyon put it at $0.77 per session).
The thumbnail version did not beat it. Run by Oliver Kenyon. See the test.
Copy this: Before you add images to every menu link, test a short description line under each category against them.
2. Mega menu with a Trending Now best-seller row
What they did: A swipeable Trending Now row of best-sellers went at the top of the mega menu.
Under it, each category got a thumbnail, a clear name and a short description, in a simpler layout.
Why it works: Many people open the menu without a set destination.
Best-sellers give them a product to click straight away, and clearer category links help everyone else.
Result: +$106,886 per month, forecast, from a $0.98 rise in revenue per session.
Three changes shipped together, so the share from each is unknown. Run by Oliver Kenyon. See the test.
Copy this: Put three to six of your top sellers at the top of the open menu, with images and prices.
3. Mobile menu with search on top and Clearance first
What they did: A garden furniture store's mobile menu got a search field at the top, then a colored Clearance link with an up to 60% off tag and no dropdown.
A customer quote came next, and the service links shrank into a small row at the bottom.
Why it works: Bargain hunters found the sale in one tap instead of digging through a dropdown.
Search at the top served shoppers who already knew what they wanted.
Result: +$92,000/month (about $1.22 extra per session, as reported by Oliver Kenyon). Run by Oliver Kenyon. See the test.
Copy this: If your sale section sells well, move it to the first link in the mobile menu and show the discount on the link.
4. Search bar inside the mobile mega menu
What they did: A search field went at the top of the open mobile menu, above the Men, Women and Sale links.
Before, search was only reachable from the header icon.
Why it works: The data showed most users opened the menu first and that search had the highest revenue per click.
Putting search where people already were removed a step.
Result: +$81,050/month, from +$0.05 revenue per session. That implies very high traffic. Run by Oliver Kenyon. See the test.
Copy this: Add a search field to the top of your open mobile menu, so shoppers do not have to close the menu to search.
5. Full-screen mobile mega menu with larger tap targets
What they did: A handbag store's mobile menu went from a short list of small, tightly spaced text links to a full-screen menu with a search bar, a tall row for each category, and sub-categories that expand in place.
Why it works: Small links packed together cause mis-taps on a phone.
Bigger rows and a clearer order make the menu easier to use with a thumb.
Result: +$50,568 per month, forecast. Lower bounce rates were reported, but no figures were shared for them. Run by Oliver Kenyon. See the test.
Copy this: Give every mobile menu row enough height for a thumb, and let it open full screen.
6. Mobile menu ordered by revenue per session
What they did: Menu items were reordered by revenue per session, so high-earning categories moved up and content links like Success Stories moved down.
A Best Sellers slider with images and star ratings went at the top, under search.
Why it works: Sorting by what earns puts the most useful links where people look first.
Result: +$48,607 per month, forecast ($583,284 per year). Run by Oliver Kenyon. See the test.
Copy this: Pull revenue per session for each menu link from your analytics and sort the menu by it.
7. Quiz promo at the top of the mobile menu
What they did: A 9-figure makeup brand moved its shade-matching quiz from a plain link near the bottom of the mobile menu to a promo at the very top, with shade swatches and a Take a quiz button. Five versions were tested in Intelligems.
Why it works: Quiz takers already converted at higher rates, but few found the link.
The same promo placed in the middle of the menu did not win, so position mattered.
Result: An estimated +$101,495/month for the quiz-at-top version.
A visual category menu and a best-seller cards menu also lost to it. Run by Convertibles. See the test.
Copy this: If you have a quiz or product finder that converts well, put it first in the menu, not last.
8. Products dropdown replaced with a category page
What they did: Body Ecology, a health foods and supplements store, replaced its Products dropdown (just category and product names) with a full category page that gave a short intro to each category.
Why it works: Shoppers who did not know the range could not choose from names alone.
A short intro per category helped them pick the right products, and order value went up.
Result: +56.43% revenue per visitor at 96% significance over two weeks.
Revenue per conversion rose from $100.33 to $143.61. Run by Frictionless Commerce. See the test.
Copy this: If your category names need explaining, link the top menu item to a page that explains them.
9. Small images beside mobile menu categories
What they did: Vegepod, a garden products brand, added a small image next to each key category in its text-only mobile menu. The test ran for 21 days.
Why it works: Images help when product names are unfamiliar.
Here the gain came mainly from higher order values.
Result: +42% revenue per visitor, with conversion rate +14% and average order value +24%. Run by Blend Commerce. See the test.
Copy this: Test images in the mobile menu if your category names alone don't show what's in them.
See the losers below before you assume it will work.
10. Sub-categories shown straight away in the mobile menu
What they did: Kids' clothing store Cocohanee changed its hamburger menu so sub-categories showed as soon as it opened, instead of needing a tap on each category first.
Why it works: Many visitors opened the menu but few used it.
Showing the next level removed a tap and made the options visible.
Result: +28% ecommerce conversion rate and +29% transactions.
Listing page visits, the main goal, rose only 4%, so the larger gains deserve caution. Run by VWO. See the test.
Copy this: If menu engagement is low, show the second level of links without an extra tap.
11. Drill-down mobile menu instead of an accordion
What they did: A sports nutrition brand swapped a mobile menu that expanded subcategories in place ('+' icons) for one where each category opens its own panel ('>' icons).
Why it works: Accordions push the rest of the menu down and get crowded.
A separate panel shows one set of choices at a time.
Result: +7.25% conversion rate and +6.72% revenue per visitor.
Main category clicks rose 6.52%. Run by Blend Commerce. See the test.
Copy this: If your mobile accordion gets long when opened, test a drill-down panel with a clear back link.
12. Coffee menu grouped by flavor
What they did: Stone Creek Coffee grouped coffees in the menu as Bright, Balanced and Bold instead of standard category names.
A second version added copy explaining each group.
Why it works: Shoppers think in taste, not in the roaster's range.
Grouping by the outcome they want lets new buyers choose without knowing the products.
Result: Variant 1: +11% revenue per visitor and +9% average order value.
Variant 2, with extra copy, lifted subscription revenue per visitor but hurt overall purchasing, so it lost. Run by Blend Commerce. See the test.
Copy this: Group products by the need or outcome customers describe in reviews and surveys, and keep the labels short.
13. Flat category menu instead of dropdowns
Conversion FanaticsWhat they did: A store replaced a few top-level categories with hover dropdowns full of sub-options with a flat menu linking straight to its main product lines.
Why it works: One click to a product range removed a level.
Result: Almost +12% successful checkouts. No other metrics or sample size were shared. Run by Conversion Fanatics. See the test.
Copy this: If you sell a handful of product lines, test linking them directly in the top bar.
14. Exclusive Offers tab moved first
What they did: YSL Beauty swapped two tabs in its homepage menu so Exclusive Offers, which led to current offers and gifts with purchase, came before New Products.
It ran for a month on more than 150,000 visitors.
Why it works: Offers and gifts with purchase give a reason to buy now.
Moving them first put that reason in front of more people.
Result: +10% transactions, with basket page visits +9% and checkout visits +13%. Run by AB Tasty. See the test.
Copy this: Test swapping the order of your first two menu items.
It is one of the cheapest tests you can run.
15. Always-visible mobile search bar instead of an icon
What they did: Apparel store Fame on Central replaced the magnifying-glass icon in its mobile header with a search field that stays visible, including in the sticky header.
Why it works: An icon hides search behind a tap.
A visible field invites shoppers who know what they want to skip browsing.
Result: +19.62% conversion rate and +31.30% revenue per visitor, at about 97% significance after one week. Run by Blend Commerce. See the test.
Copy this: If search users convert well on your site, show the search field in the mobile header instead of an icon.
16. Text labels on mobile header icons
What they did: Goat Milk Stuff, a soap and skincare brand, added short text labels beside its mobile header icons for Menu, Search, Account and Cart. It ran on mobile for two weeks.
Why it works: Icons alone make people guess.
A one-word label removes the guess, which helps new visitors most.
Result: +10.37% conversion rate on mobile and +2.95% revenue per visitor.
The brand kept the new version. Run by Blend Commerce. See the test.
Copy this: Add one-word labels under your header icons and check whether they still fit on small screens.
17. Courses dropdown in the mobile header
What they did: RMIT Online, the online learning arm of RMIT University, added a Courses dropdown right in its mobile header with one-tap links to nine course categories. Before, courses sat inside the hamburger menu.
Why it works: Lead-gen sites live on getting people to the right offer page.
Pulling the main thing people came for out of the hamburger saved a tap.
Result: +7.78% lead form submission rate over a 14-day split URL test, with category page click-through +35% sitewide. Run by RMIT Online. See the test.
Copy this: Pull your most-visited section out of the hamburger and into the visible mobile header.
18. Contact link added to the main menu
What they did: Cosentino, a building-materials maker, added a Contact item to its main desktop and mobile menus.
Before, the Contact page was only linked from the footer.
Why it works: People ready to talk need a visible way to reach sales.
The footer link barely changed, so the menu link reached new people.
Result: +140% leads from the Contact page, and Contact page visits more than doubled.
The win held when repeated in Canada and the UK. Run by Cosentino. See the test.
Copy this: If you sell through enquiries, check that Contact or Request a quote is in the main menu, not only the footer.
19. Clearer, fewer nav tabs
What they did: Harvard Business Services, a Delaware company formation agent, renamed vague tabs (Compare became Compare Prices, Get Started Now became Form a Company Now), added a How to Incorporate tab and removed Blog, About Us and Contact Us.
Why it works: Specific labels tell visitors what they get.
The new How to Incorporate tab exposed a page that sent many visitors straight to purchase.
Result: +15.68% completed orders on about 32,000 visitors.
Visits to the How to Incorporate page rose 382.45%.
All changes were tested together. Run by Harvard Business Services. See the test.
Copy this: Rename vague menu labels to say what the page does, and promote any page your analytics show leads straight to sales.
20. Get a Quote button in the sticky nav
What they did: Westfund, an Australian not-for-profit health fund, added a Get a Quote button to its floating top navigation.
Before, it appeared only in the homepage hero.
Why it works: Visitors who land on inner pages had no clear way into the quote funnel. A button that follows them fixes that.
Result: +10.82% quotes started, and new member joins rose 28.84%. Run by Insighten. See the test.
Copy this: Put your main conversion action in the sticky header as a button, not only on the homepage.
Patterns across the winners
Search belongs inside the menu and the mobile header
Search at the top of the open menu (+$81,050/month) and a visible search field instead of an icon (+19.62% conversion rate) both won.
Our site search guide and search tests go deeper.
Order the menu by what earns, not by habit
Sorting by revenue per session, moving Clearance or Exclusive Offers first, and putting a strong quiz on top all won.
The YSL Beauty tab swap shows how small the change can be.
Fewer taps and fewer levels on mobile
Showing sub-categories on open, drill-down panels and flat menus without dropdowns all cut a step.
See our mobile CRO guide for the wider pattern.
Help people choose, not just find
Short category descriptions, flavor groups and intro pages beat bare names when shoppers did not know the range.
Clearer labels did the same job for Harvard Business Services.
For SaaS and lead gen: keep the conversion action in the nav
Contact, Get a Quote and Courses links in the visible header lifted leads.
The exception is dedicated landing pages, where HubSpot removed the navigation and saw up to +28% conversions on middle-of-funnel pages.
Read more in our lead-gen landing page guide.
Examples that lost (what not to copy)
Collapsing collection links into one mega menu: a single-row header that hid every collection behind one image-led Collections item cut conversion 22.5%, mostly on mobile. Run by Clean Commit.
A busier, guided search: a highlighted search bar that opened with examples, product cards and suggested collections lowered conversion 12.0%, though the drop was not statistically significant. Clean Commit ran it too.
Images in the mobile menu, again: the same idea that won for Vegepod cut conversion 2% overall for Oaktree Memorials in a Blend Commerce test.
Header and footer redesign: decluttering the header and expanding the footer raised clicks but cut conversion 16.3%, though the drop did not reach statistical significance.
Swatch navigation change: at The Shade Store, a change to swatch navigation cut orders of popular swatches by about 82%, and Surefoot stopped the test early.
Real results from our archive
@oliverkenyon
Convertibles
Blend Commerce
Clean CommitBlend CommerceHow to test this on your own site
- Pull menu click data and revenue per session for each top-level link. Look for high earners sitting low in the list.
- Check site search logs. If people search for your main categories, the menu is hiding them.
- Test mobile and desktop separately, or at least read the results separately. One loser above, Clean Commit's single-row header, lost mostly on mobile.
- Change one idea per test where you can: order, labels, search placement or a promo slot. Bundled redesigns hide which part worked.
- Judge on revenue per visitor or orders, not menu clicks. Clean Commit's header redesign got more clicks and fewer sales.
If you are unsure how to group categories, a card sort shows how customers group your range.
For sticky headers and breadcrumbs, see our guide.
Watch out for
- Menu apps and heavy image panels can slow the page. Vasta found that swapping an app header for the theme's native header lifted conversion 17.02% at Canada Welding Supply.
- Forecast dollar figures. Many menu wins are monthly projections. Plan on your own numbers.
- Fake urgency in the menu. A Clearance label works when the discount is real; a permanent "ending soon" tag does not.