Jump to content

Customising product page

Recommended Posts

Add to Design > Custom CSS

/* align image-title */
section.product-details.ProductItem-details {
    padding-top: 0px;
}
/* add to cart button */
div.sqs-add-to-cart-button {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}
/* quantity */
div.product-quantity-input input {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

Can you share link to a variant product? We can check variant dropdown easier.

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
  • 5 months later...

Hi,

 

I used your code to change my variant box size - worked perfectly, thank you.

How would I now change the colour of the drop down variant boxes to match my add to cart button? So it appears similar to the add to cart button?

And is it possible to remove or reducte the drop down arrows?

Is it also possible to remove where it says : select style indside the box? to either just say select or no text at all?

Screenshot 2023-01-19 at 13.53.12.png

Link to comment
On 1/19/2023 at 8:57 PM, bettysglamourbox said:

Hi,

 

I used your code to change my variant box size - worked perfectly, thank you.

How would I now change the colour of the drop down variant boxes to match my add to cart button? So it appears similar to the add to cart button?

And is it possible to remove or reducte the drop down arrows?

Is it also possible to remove where it says : select style indside the box? to either just say select or no text at all?

Screenshot 2023-01-19 at 13.53.12.png

Hi,

Can you share link to a product? We can give code easier

 

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
On 6/10/2023 at 5:18 AM, sybfire said:

Hello,

I need to make the "size" and "quantity" buttons smaller in width, and in length as well for the size button.

I cannot seem to find any options to change these two in the design settings at all.

I could only manage to figure out how to stylize the "add to cart" button.

https://www.sybfire.com/art/p/bathroomdance

Thank you!

buttonsize.jpg

Use this CSS code

.variant-select-wrapper, .product-quantity-input input {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

 

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.