Add a mega menu to your Squarespace 7.1 website without designing a single thing.
Most Squarespace mega menu plugins ask you to build your menu from scratch inside Squarespace blocks. You choose layouts, add images manually, set CSS color variables, and spend hours making it look right on every device.
This plugin works differently.
Paste two code blocks into Code Injection. Your existing Squarespace navigation the pages and folders you've already set up instantly becomes a premium mega menu. No layout decisions. No color setup. No image uploading. The plugin reads your site automatically.
How it actually works:
When a visitor hovers over a navigation item on desktop, a full-width dropdown panel appears. Folders become image card grids the plugin fetches photos from your pages automatically. Blog and Shop links show your latest products and posts with thumbnails and prices. Regular pages show a hero image preview with a call-to-action.
On mobile, your standard Squarespace hamburger is replaced with a custom fullscreen overlay menu complete with animated accordion sections, image grids, your site logo, and a Get Started button that matches your actual Squarespace button style.
The part that makes designers stop and look twice:
Every color is automatic. The plugin reads your Squarespace theme background color, text color, button color, heading fonts, body fonts and applies them to the menu. Install it on an orange site, it looks orange. Dark site, it goes dark. Light cream site, it adapts to cream with dark text. You never touch a CSS variable.
What's included:
Desktop hover dropdown mega menu
Custom mobile fullscreen menu (replaces Squarespace's basic mobile nav)
Automatic page image and video fetching
Theme-adaptive colors (reads your Squarespace CSS variables)
Social icons with brand colors
Scrolling ticker bar
Get Started CTA button (matches your header button style)
Installation guide with screenshots
Free setup support via email
FAQ
Common questions answered
-
No coding knowledge is required. The installation is two copy-paste steps: paste the Header code into the Header box in Code Injection, paste the Footer code into the Footer box. Save. Your mega menu is live. Most customers install it in under 3 minutes.
-
Yes this is one of the features that sets this plugin apart. It reads your Squarespace CSS variables and automatically detects your background color, text color, button color, and fonts. Whether your site is dark, light, orange, navy, or any other color, the menu adapts instantly with no manual color setup.
-
Yes. On mobile devices, the plugin installs a complete custom fullscreen menu not Squarespace's default mobile navigation. When visitors tap the hamburger icon, a full-screen overlay opens with accordion sections, image previews, your logo, and all your navigation links. It works on iOS and Android.
-
Your existing navigation structure stays exactly as it is in the Squarespace Pages panel. The plugin reads it automatically and transforms it folders become dropdown panels with image cards, pages become hero image previews, blogs and shops display recent items. You don't rebuild anything.
-
Yes, fully compatible with all Squarespace 7.1 templates including Fluid Engine layouts.
-
Most mega menu plugins require you to build your menu content using Squarespace blocks you design the layout, add images manually, and set CSS color variables. This plugin is plug and play. Your existing pages, folders, blog posts, and shop products become the menu content automatically. Colors adapt automatically. Images are fetched automatically. There is nothing to design.
-
You need a Business plan or higher to use Code Injection, which is required for this plugin.
-
Yes visit the demo link on the product page to see the mega menu live on a real Squarespace 7.1 site.
Still have a question? Email us →
ALSO FROM SQUARESPELL

