Jump to content

Multiple stores in one site different layout 7.1

Recommended Posts

Hi. I'm building a site that has two separate stores within it - in 7.1.
I want to make a change to the collection/store page.

One store is selling paintings that are all square so I want to do 1x1 - Love Store, and one they are mostly vertical - Painting Gallery- so I want to do 2x3.
For now, when I make a change to one store it changes the layout on the other.
I've attached screen grabs so you get the idea.

Is there a way or line of code I can drop in to make them each have their own layout? Actual individual product pages can stay the same. 

I hope this makes sense. Thanks.

Screen Shot 2020-05-20 at 11.24.31 AM.png

Screen Shot 2020-05-20 at 11.21.28 AM.png

Screen Shot 2020-05-20 at 11.22.54 AM.png

Screen Shot 2020-05-20 at 11.29.00 AM.png

Screen Shot 2020-05-20 at 11.22.30 AM.png

Link to comment
  • 5 months later...

Hey,
 

A summary block might be a good choice without any custom coding

1) go to your initial shop module and apply categories to your products ( e.g. square and vertical)
2) make a new page or section
3) use a Summary block and choose the shop as source
4) apply a certain aspect ration (1:1, 16:9.... vertical...)
5) use the advanced settings of the summary block to ONLY SHOW CATEGORY 1

so you can optimize the layout for your 2 categories!

Hope that helps!
 

Edited by ArminB
addition

About Armin:
Squarespace Expert Profile: https://www.squarespace.com/designer/profile/3649084
Website: www.braunsberger-media.com
Leaders Lodge: See my Profile

Link to comment
  • 1 year later...
On 11/2/2020 at 5:01 PM, ArminB said:

Hey,
 

A summary block might be a good choice without any custom coding

1) go to your initial shop module and apply categories to your products ( e.g. square and vertical)
2) make a new page or section
3) use a Summary block and choose the shop as source
4) apply a certain aspect ration (1:1, 16:9.... vertical...)
5) use the advanced settings of the summary block to ONLY SHOW CATEGORY 1

so you can optimize the layout for your 2 categories!

Hope that helps!
 

hey, this is a good idea.. I have thevsame problem.. but I don't have this nice rollover image switch affect it I don't use a shop site! any idea for that?

Link to comment
On 3/2/2022 at 3:46 AM, billyholiday said:

hey, this is a good idea.. I have thevsame problem.. but I don't have this nice rollover image switch affect it I don't use a shop site! any idea for that?

You can use Summary Block to pull products & This plugin to add rollover effect

Or we can use code to set rollover effect manually on each product

(The answer contains an affiliate link, which means I will receive a small commission if you click and buy the plugin according to the link above.)

 

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 6 months later...

 

works on 7.1.    Copy and paste this to CSS code for your website.  Worked for me.  now all images have the own correct aspect ratios without jumping thru hoops.  

 

/*original aspect ratio for images in store*/

// code #2//

 

/* list page */

.products.collection-content-wrapper .grid-item .grid-image-cover {

    object-fit: contain !important;

}

/* detail page */

img.ProductItem-gallery-slides-item-image {

    object-fit: contain !important;

    height: auto !important;

}

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.