Mega Menu V3 - Squarespace 7.1
This Mega Menu tutorial shows you how to add icons and short descriptions to certain menu items for a clearer and more engaging navigation experience.
It’s perfect for service-based or digital product-based websites, or even large-scale blogs that may require more clarity and differentiation between menu items.
What's included?
Helpful video installation guide
Code updates and bug fixes
Compatibility with all major browsers, including Chrome, Safari, and Firefox
Email help & support from the plugin creator
Requirements
Must have Squarespace 7.1 business plan or higher
If you want to include icons in your menu items, you will need access to photo-editing software to create the icons (Adobe Spark, Adobe Illustrator, Canva, Visme, Design Wizard, etc.).
The plugin works it's magic by using folder URLs that end with the string '-mega', so your current folder URLs will be altered when you follow the instructional guide. Note that folder URLs do not actually create new landing pages for your Squarespace site, so changing them will not hurt your SEO.
Optimize your main navigation's ease-of-use by adding subtext and icons to menu items that may need more clarity.
Optimized for a seamless desktop user experience.
Images and subtext are automatically added to respective desktop menus items
You decide whether the mega menu appears on hover or click
You decide whether the mega menus are full-width or not full-width
Folder menus have dropdown indicators to signify a flyout menu can be opened
Allows for desktop-specific customization options, including menu item heading subtext color, border color, background color, etc.
Optimized for an easy mobile experience
Images and subtext are automatically added to respective mobile menus items
Allows for mobile-specific customization options, including menu item heading & subtext color, border color, background color, etc.
Implements accessible menu functionality for a more inclusive online browsing experience.
The mega menu appears on mouse click or via an optimized mouse hover functionality for a better user experience
Implements conventional keyboard shortcuts and functions for keyboard users
Menu items include appropriate ARIA and role attributes for assistive technologies
Watch the video installation guide
FAQs About this Plugin
-
You can customize the menu button background colors, the border color of the menu items, the menu heading font size and color, the subtext/description that appears under each menu item, the icon that will display next to each menu item, which folder menus will include this menu display and which will remain normal, and if the menus will appear on click or hover.
-
You can add as many mega menus to your navigation as you want. I’ll show you how to add more than one in the tutorial video included with this plugin.
-
To be frank, I am a web developer, not a Graphic Designer, so my icon-creating skills are very basic; however, if you just need simple icons, I can help with that and the installation video guide included with this purchase will even walk you through how I use Canva to create icons.
-
No. Folder URLs by default do not create new pages on your website. Instead, they automatically redirect to the first page in the folder menu (Source: Squarespace Support). Because of this, it is unlikely that changing the folder URLs will mess anything up with SEO.
I have personally tested whether folder URLs count towards SEO by Google on multiple sites in addition to my own, and none of them were even indexed, so changing folder URLs to accommodate this plugin is generally safe.
-
This mega menu works well for service-based or digital product-based websites where you may want to provide more clarity and differentiation between offerings. The short descriptions that appear below the menu items can make a big difference for your users when navigating your site.
Try clicking the “Shop” menu item on this website’s navigation (the one you’re viewing right now) to see for yourself.
-
This plugin is not compatible with other mega menu plugins. If you are switching over from another mega menu plugin, you will need remove all files related to that plugin and replace them with the files you will get with the purchase of this plugin.
-
No, none of the plugins I create require external libraries. You will only need to use the files provided to you after your purchase.
-
No. this is strictly a Squarespace 7.1 plugin.
-
Sorry, but because of the digital nature of plugins, this product is non-refundable. However, I only want to help you succeed! If you are experiencing issues with this plugin, don’t hesitate to reach out via my contact page.
