Dawn Theme - Change Colour of Add to Cart and Checkout Button

My store URL is https://scent26candleco.co.uk/

You will see that my Add to Cart on product pages and Checkout button in slide drawer are both green (329999), but I want to change both to Blue (OB82C9) - how do I make this change in code, as anything I have tried does not work!

Thanks

Kirsty

Hello @scent26candleco

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.product-form__buttons button, #CartDrawer-Checkout { background-color: #0B82C9 !important; } button#CartDrawer-Checkout::before, button#CartDrawer-Checkout::after{ box-shadow: unset !important; }

RESULT:

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

1 Like

Perfect, thanks!

How to I change the ‘CONTINUE SHOPPING’ button when in the ‘Your cart is empty’ section, as this is also showing as green?

Hello @scent26candleco

Don’t forget to Like and mark my both solutions as accept solution

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.drawer__inner-empty .button { background-color: #0B82C9 !important; } .drawer__inner-empty .button .button::after, .button::before{ box-shadow: unset !important; }

RESULT:

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

1 Like

This worked, thanks, you have been excellent!

Just one more thing - do you know how I can include dynamic checkout buttons in my slide cart drawer underneath the checkout button? I have tried some feedback from other developers on this chat, but nothing suggested has worked. I thought I would ask you on the basis you have been excellent sorting my 2 previous issues! Thanks.

Hi - I have just updated my theme and the Continue Shopping button is no longer showing as CAPITAL LETTERS. Can you tell me what code needs to be inserted (and where) to have this text as capital letters? Thanks.