Jump to content

Move all variants, quantity and checkout to top of page

Recommended Posts

  • Replies 6
  • Views 230
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

@Chvntelle  Hi! You can add the following to Website > Pages > Website Tools > Custom CSS.

.ProductItem-details .ProductItem-details-checkout {
	display: flex !important;
}
.tweak-product-basic-item-add-to-cart-standalone .ProductItem .ProductItem-quantity-add-to-cart {
	order: 3 !important;
}
.collection-type-products .ProductItem-details .pdp-product-add-ons {
	order: 4 !important;
}

 

If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. 

Sam
Web Developer & Digital Designer

 Did you find my contribution helpful? Buy me a coffee?

Link to comment
On 6/7/2024 at 9:59 PM, Chvntelle said:

Sorry id like to change it to, Title, Variant(s), Price, Quantity , Add to cart , Description

You can use this code to Website > Website Tools > Custom CSS.

.ProductItem-details .product-variants {
    order: 1 !important;
}

.ProductItem-details .ProductItem-details-checkout {
    display: flex !important;
    flex-direction: column;
}

.ProductItem-details .ProductItem-product-price {
    order: 3 !important;
}

.tweak-product-basic-item-add-to-cart-standalone .ProductItem .ProductItem-quantity-add-to-cart {
    order: 4 !important;
}

image.png.a63650a052cc640d84904267a3d0e4ab.png

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

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.