Jump to content

Image card customisation css

Recommended Posts

Site URL: https://the-dead-rabbit.squarespace.com/

Hello everyone,

 

I'm trying to create a custom menu layout using squarespace, but I'm not sure how to achieve the desired look. I want to create a similar interface to the likes of deliveroo/seamless, and wondered if anyone could help with this? I'll attach the layout wireframe I've designed of what I'm looking for. I had considered customising the image card to display the content this way, but I also need to have a tab function at the top to go between "starters", "desserts" etc, much like squarespace's in-built menu block. 

 

Can anyone help? Thanks!

Screenshot 2022-03-16 at 15.40.30.png

Link to comment
2 hours ago, prcreative said:

Site URL: https://the-dead-rabbit.squarespace.com/

Hello everyone,

 

I'm trying to create a custom menu layout using squarespace, but I'm not sure how to achieve the desired look. I want to create a similar interface to the likes of deliveroo/seamless, and wondered if anyone could help with this? I'll attach the layout wireframe I've designed of what I'm looking for. I had considered customising the image card to display the content this way, but I also need to have a tab function at the top to go between "starters", "desserts" etc, much like squarespace's in-built menu block. 

 

Can anyone help? Thanks!

Screenshot 2022-03-16 at 15.40.30.png

Can you describe about 3 buttons on the top, what happen if we click on them?

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Keyword Highlighter
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment

Have you tried using the image block with this design?

image.thumb.png.9dccdc9473831c2b03af9c7287b6bcc5.png

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Keyword Highlighter
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
9 hours ago, prcreative said:

Hi yes, this is exactly what I've used. I need to make it smaller in size on desktop and stop it from stacking on mobile. Any ideas?

 

 

Screenshot 2022-03-23 at 15.47.57.png

Screenshot 2022-03-23 at 15.49.02.png

Your site is private now. Can you share it with a protected password so we can take a look?

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Keyword Highlighter
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
On 3/24/2022 at 5:19 PM, prcreative said:

No problem! Password is hello123

Hi. Which page are you referring to? We don't see it on homepage

https://the-dead-rabbit.squarespace.com/

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.