Jump to content

Can the "Reviews" placement be swapped with "Related Products" placement?

Go to solution Solved by KwameAndCo,

Recommended Posts

Currently I have a client that is using both the "reviews" and "related products" built in functionality. However, because the automatic placement for the "related products" is below the "reviews", it isn't doing him any good. Is there some code to place "related products" above the "reviews"? Ideally, I'd actually like them to be side-by-side in two columns...but just flipping them would be better than how it's currently laid out. Thanks so much!

Link to comment

Link to site. I can take a look.

Work With Me 🖥️💻📱

Please remember to tag me so that I get a notification and respond to your help requests.

If my answers have helped you, please drop a like and mark my answer as best to help other users find solutions quickly.

You can also thank me or make requests by buying me a coffee . (Caffeine fuels me to take more requests)

For Squarespace Tips & Tricks, visit @squareskills (Youtube 📺 Tutorials)

For Premium and FREE plugins, visit Squareskills (Plugin Store) 🧩

Some links may be affiliate/referral links.

Link to comment
  • Solution

Cool designs!

You can use the following.

/*Squareskills product page reorder*/
#pdp .collection-content-wrapper  {
  display: flex;
  flex-direction: column;
}
.collection-content-wrapper .ProductItem-additional {
  order: 1;
}
.collection-content-wrapper .reviewsSection {
  order: 3;
}
.collection-content-wrapper .productItem {
  order: 2;
}

 

Work With Me 🖥️💻📱

Please remember to tag me so that I get a notification and respond to your help requests.

If my answers have helped you, please drop a like and mark my answer as best to help other users find solutions quickly.

You can also thank me or make requests by buying me a coffee . (Caffeine fuels me to take more requests)

For Squarespace Tips & Tricks, visit @squareskills (Youtube 📺 Tutorials)

For Premium and FREE plugins, visit Squareskills (Plugin Store) 🧩

Some links may be affiliate/referral links.

Link to comment
15 hours ago, KwameAndCo said:

Cool designs!

You can use the following.

/*Squareskills product page reorder*/
#pdp .collection-content-wrapper  {
  display: flex;
  flex-direction: column;
}
.collection-content-wrapper .ProductItem-additional {
  order: 1;
}
.collection-content-wrapper .reviewsSection {
  order: 3;
}
.collection-content-wrapper .productItem {
  order: 2;
}

 

Thanks so much!!!! I really didn't think I'd be able to solve this one. This looks so much better. 

Link to comment
10 hours ago, dross said:

Thanks so much!!!! I really didn't think I'd be able to solve this one. This looks so much better. 

Happy to help.

You can use that order property to put them in whatever order you want with this code. Lowest number first.

@dross can you mark the correct solution so others can easily find it?

Edited by KwameAndCo

Work With Me 🖥️💻📱

Please remember to tag me so that I get a notification and respond to your help requests.

If my answers have helped you, please drop a like and mark my answer as best to help other users find solutions quickly.

You can also thank me or make requests by buying me a coffee . (Caffeine fuels me to take more requests)

For Squarespace Tips & Tricks, visit @squareskills (Youtube 📺 Tutorials)

For Premium and FREE plugins, visit Squareskills (Plugin Store) 🧩

Some links may be affiliate/referral links.

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.