Jump to content

Move Product Title, price and description below image

Recommended Posts

Hello

Hope anyone here can help me! 
In the product page, I would like to move the Product title, description and price/add to cart button to sit below the image gallery. 

See this page as example: https://www.bafurniture.com.au/ourproducts/p/nunez-tvunit-tassie-blackwood

I know I can move the text/heading to the 'Additional info' section, which will make it sit below. But then we I try to add the price there it looks weird. 

Any code I can use?

Thank you in advance!!

Marina :)

 

Link to comment

Hi Marina, try adding this to Custom CSS:

@media only screen and (min-width:768px) {
  .ProductItem .ProductItem-summary {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .ProductItem-gallery, .ProductItem-details {
    width: 100%;
  }
  .ProductItem-details {
    padding-left: 0vw;
  }
  .tweak-product-basic-item-gallery-design-slideshow .ProductItem-gallery-thumbnails {
    margin-bottom: 0vh;
  }
}

 

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment
  • 2 weeks later...

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.