x

How to change "Add to Cart" button color on Product pages?

Hi there - I'm having trouble figuring out how to change the "Add to Cart" button color/ style on Product pages. Currently, they are set to black text on a black button, which is not helpful. 

Here is one of my product pages: https://www.saraemor.com/store/p72/Little_Periwinkle_Ceramic_Dish_with_Pink_and_Yellow_Moth.html#/

Thanks for any advice!

541 Views
Message 1 of 5
Report
1 Best Answer
Square Community Moderator

Best Answer

Howdy there @saraemor 👋,


Welcome to the Seller Community - it's great to have you here! Good question!


You can edit the "Add to Cart" button in two places:


Site Design Settings:

1. Go to Square Online Dashboard > Website > Edit Site.
2. Click on Site Design at the top, then scroll down to Buttons.
3. Here, you can customize your primary and secondary buttons, including their fill and text colors. These changes will apply to all buttons on your site.

Screenshot 2024-07-19 at 4.54.40 PM.png

Item Page Settings:

1. While in Edit Site, navigate to an item page and select the Item Details section (clicking on the page section you want to edit).
2. Once selected, you'll see the section settings from the menu on the left. You can adjust the "Add to Cart" button specifically for that item, either using your preset button settings or customizing it further for that page.
3. Don’t forget to click Done and then Publish to make sure your changes appear on your live site.

Screenshot 2024-07-19 at 4.55.54 PM.png

 



Let me know if you need any more help or if you have further questions!

P.S. The fine line illustrations on your ceramics are stunning. Best of luck with everything!

Laurie
Community Moderator, Australia, Square
Sign in and click Mark as Best Answer if my reply answers your question.

View Best Answer >

510 Views
Message 2 of 5
Report
4 REPLIES 4
Square Community Moderator

Best Answer

Howdy there @saraemor 👋,


Welcome to the Seller Community - it's great to have you here! Good question!


You can edit the "Add to Cart" button in two places:


Site Design Settings:

1. Go to Square Online Dashboard > Website > Edit Site.
2. Click on Site Design at the top, then scroll down to Buttons.
3. Here, you can customize your primary and secondary buttons, including their fill and text colors. These changes will apply to all buttons on your site.

Screenshot 2024-07-19 at 4.54.40 PM.png

Item Page Settings:

1. While in Edit Site, navigate to an item page and select the Item Details section (clicking on the page section you want to edit).
2. Once selected, you'll see the section settings from the menu on the left. You can adjust the "Add to Cart" button specifically for that item, either using your preset button settings or customizing it further for that page.
3. Don’t forget to click Done and then Publish to make sure your changes appear on your live site.

Screenshot 2024-07-19 at 4.55.54 PM.png

 



Let me know if you need any more help or if you have further questions!

P.S. The fine line illustrations on your ceramics are stunning. Best of luck with everything!

Laurie
Community Moderator, Australia, Square
Sign in and click Mark as Best Answer if my reply answers your question.
511 Views
Message 2 of 5
Report

Hi Laurie,

Thanks for your answer, and for the compliment. 😊 I absolutely should have mentioned that I'm using Weebly - my apologies. So, my toolbar does not have that option (although it sounds nice and straightforward!). I'm not sure if Weebly has their own seller community, but this is were a string of help buttons sent me. 

saraemor toolbar.png

483 Views
Message 3 of 5
Report

So, after some searching, I found this article about migrating my Weebly site to my existing Square account. This sounds great and I'd love to do it! However, I have never been prompted with a banner. Is this available for all Weebly users? If so, how can I do this?

Thanks for your time!

481 Views
Message 4 of 5
Report
Square Community Moderator

@saraemor, Yes, it is available to all Weebly users. You can learn more about switching to Square Online here.

 

If you have any other questions, we are here to assist.

449 Views
Message 5 of 5
Report