Jump to content

Customize drop down menu to include images

Recommended Posts

I am currently working on a website and I'm looking for help trying to workout a custom look for a drop-down menu. This is how it looks like right now:

 image.png.34aa207e46f15baaca7a3957645f5da3.png

Nothing wrong with it, it's just plain. 

This is how I would like for it to look like: 

image.thumb.png.1688afd17046a110a1ea1e5b17f8abc5.png

 

The drop down menu for this company displays images for the options. Can this be done in squarespace?

If it can, I would love to make it work for both desktop and mobile like Driscolls:

This is their mobile version:

image.thumb.jpeg.c150836c4b66212c822d0640c872a4ad.jpeg

 

 

Can anyone help or point me in the right direction please? Thanks a lot!

 

by the way website is: https://natureschoiceproduce.squarespace.com/
password: 
"berry"

 

 

Link to comment

Take a look a third party solutions for mega menus.

About: SQSP User for 17 yrs. Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF Digital, building Squarespace Extensions to supercharge your commerce website. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.
If my advice helped, you can thank me by clicking one of the feedback emojis below. I love coffee too.

Link to comment

I've seen Spark Plugin but I've never used any third party integrations. Have you had a good experience with a specific platform? Which one would you suggest? I'm exploring the options at this point. Thanks for the help!

Link to comment

I haven't used any of them (I'm a developer so I build my own) but I hear great reports about the Mega Menu plugin for Squarespace 7.1 by fellow Circle Leader @WillMyers.

About: SQSP User for 17 yrs. Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF Digital, building Squarespace Extensions to supercharge your commerce website. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.
If my advice helped, you can thank me by clicking one of the feedback emojis below. I love coffee too.

Link to comment

Thanks @paul2009!

@jorgeamrls, my mega menu plugin is one of my most popular ones. It can’t recreate the mobile menu exactly as drop-downs, as you have shown, but it follows the normal Squarespace structure on mobile where you can click into the folder and you can display your mega menu content there.

If you have any questions at all you can contact us via my support page too.

Hey-o, my name is Will and I help Squarespace designers and developers with technical things.

I would be happy to answer any questions you have about Javascript, CSS, or the meaning of life  - although I'm only an expert in 2 of these. 

Check out my plugin store or sign up for my newsletter

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.