Jump to content

Summary Block - How to have different "Size/Spacing" from Mobile to Desktop

Recommended Posts

Hello,

Attached below is a screenshot "Web View" of a summary block with products on desktop. They are all tiny because of the spacing parameters I made.

Attached also is "Mobile View" this is how I want the summary block to look on mobile, 2 items in a row.

When I have my desired look on mobile, you can see it gets completely ruined on desktop, how can I have the spacing seperate for mobile and web?

If I make the desktop view look correct, it makes mobile view 1 product across whole screen, which makes it tiring to just scroll by products 1-by-1 on mobile.

Please advise, thank you,

 

https://www.mozerisfineantiques.com/

 

 

 

 

web view.jpg

mobile view.jpeg

Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

On 11/17/2022 at 1:25 PM, Faustas said:

Attached below is a screenshot "Web View" of a summary block with products. If I make the desktop view look correct, it makes mobile view 1 product across whole screen, which makes it tiring to just scroll by products 1-by-1 on mobile.

This can be difficult to manage with Summary Blocks because the size and spacing is set by item width instead of the number of columns that you want to display.

Although it is an additional purchase, I recommend the Lazy Summaries plugin. The author built this to allow a Summary Block to show more than 30 items, but it does far more than this! One excellent feature is that you can set the number of columns and do this independently for desktop, tablet and mobile 🙂

image.thumb.png.35aba6644b312e899d4be4ba97a39767.png

Did this help? Please give feedback by clicking an icon below  ⬇️

Improve your online store with our extensions.
About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Buy me a coffee

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.