Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

add to cart button reducing once added


Question

Site URL: https://www.sundayseltzer.co.uk/barge-drinks

Hi there,

 

I have managed to re label all my 'add to cart buttons' and the are looking great however once the button has been pressed and the product 'added!' to cart the button reduces in size by approx 25% . if you press the button again, it reduces by a further 25% etc etc.
 

how can I stop the button reducing every time the product has been added to cart. in the images you can see the 'beer can' product has reduced.

regards,

Elvin 

Screenshot 2021-07-06 at 16.33.32.png

Screenshot 2021-07-06 at 16.33.22.png

Link to comment

6 answers to this question

Recommended Posts

  • 0
2 hours ago, sundayseltzer said:

Site URL: https://www.sundayseltzer.co.uk/barge-drinks

Hi there,

 

I have managed to re label all my 'add to cart buttons' and the are looking great however once the button has been pressed and the product 'added!' to cart the button reduces in size by approx 25% . if you press the button again, it reduces by a further 25% etc etc.
 

how can I stop the button reducing every time the product has been added to cart. in the images you can see the 'beer can' product has reduced.

regards,

Elvin 

Screenshot 2021-07-06 at 16.33.32.png

Screenshot 2021-07-06 at 16.33.22.png

Looks like for some reason the button get's applied an inline style that continues to reduce the width. That might be a Squarespace bug. However, try adding this to Custom CSS:

.product-block .productDetails.center .sqs-add-to-cart-button-wrapper {
  width: 100% !important;
} 

 

 

https://www.nickscola.com - Squarespace developer since 2007 now a full service creative agency in Chicago that focuses on creating websites with a high standard for aesthetic excellence.

Link to comment
  • 0
44 minutes ago, sundayseltzer said:

Hi @NickScola

that worked perfect for the size reduction, however the button, once pressed, shoots off to a left alignment.
is there anyway to keep it centre aligned after being pressed?

 

thanks

Elvin

That's so strange. Add this:

.sqs-add-to-cart-button { margin: 0 auto; }

 

 

https://www.nickscola.com - Squarespace developer since 2007 now a full service creative agency in Chicago that focuses on creating websites with a high standard for aesthetic excellence.

Link to comment
  • 0
4 minutes ago, sundayseltzer said:

@NickScola Fantastic, that has worked perfectly!!

Do you know a code to reduce the block padding around the 'add to cart button'?
I am trying to stack the buttons closer together.

thanks,

Elvin

Yes, there's a few ways to go about this. Have a go at this:

.product-block .buy-button, .product-block .sqs-add-to-cart-button-wrapper {
  margin-top: 5px;
  margin-bottom: 5px;
}

Also, if your'e wondering why the checkout button is not moving closer its because there's a blank Squarespace block before the checkout button

 

https://www.nickscola.com - Squarespace developer since 2007 now a full service creative agency in Chicago that focuses on creating websites with a high standard for aesthetic excellence.

Link to comment
  • 0
On 7/6/2021 at 10:39 PM, sundayseltzer said:

Site URL: https://www.sundayseltzer.co.uk/barge-drinks

Hi there,

 

I have managed to re label all my 'add to cart buttons' and the are looking great however once the button has been pressed and the product 'added!' to cart the button reduces in size by approx 25% . if you press the button again, it reduces by a further 25% etc etc.
 

how can I stop the button reducing every time the product has been added to cart. in the images you can see the 'beer can' product has reduced.

regards,

Elvin 

Screenshot 2021-07-06 at 16.33.32.png

Screenshot 2021-07-06 at 16.33.22.png

Hi. I see some small problems. Do you want to fix these?

Site URL: https://www.sundayseltzer.co.uk/

1. (Tablet/Mobile – Overlay menu) Increase font size?

sundayseltzer.co_.uk-01-min.png

2. (Tablet – Footer) “Competition” (in T&C’s column) don’t lie on the same row. (Email too)

sundayseltzer.co_.uk-02-min.png

3. (Desktop/Tablet – homepage) Make 3 buttons on the same line

www.sundayseltzer.co_.uk-03-min.png

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

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...