I am trying to change the add to cart button on all my products. I saw everyone saying to go to theme>edit code>assets>theme.css… I do not have anything like this in my asset section. I am using the dawn free theme and even if I download a new one or another theme I don’t see where it says theme.css.
Is there an alternative way to change the button color without going through the assets>theme.css? or do I need to add a new asset? If so, how?
This is what my assets section looks like:
Hello @KTAvenue ,
Here is our suggestion, you can follow these steps:
.product__add-to-cart {
background-color: #FF0000;
color: #FFFFFF;
}
.product__add-to-cart:hover {
background-color: #000000;
color: #FFFFFF;
}
You can change the color code as you want.
Hope this can help you out.
Ali Reviews team.
Thanks for letting me know to use the base.css section. That was a huge help!
I didn’t notice a difference when using the code you provided. I was searching around and found another code that I tried. When I used:
button.product-form__submit.button.button–full-width.button–secondary:hover {
background: teal;
color: white;
box-shadow: inherit;
}
It changes color when the mouse is over it, but the default color is still white. I even tried adding the code you provided to the end but nothing changed.
.product__add-to-cart {
background-color: blue;
color: blue;
}
Any suggestions?
Current Code:
before hover (want to be filled in as well):
after hover (working right):
Hello @KTAvenue ,
You can try to change the color on the code include ‘hover’ to blue as well.
Hope it will work
Hi @KTAvenue
You can try this code by following these steps:
Go to Online store => themes => actions => edit code and add this code on file theme.liquid before tag
Hope this answer helps.
Best regards,
Victor | PageFly
Hello @KTAvenue
Could you please provide your store URL and, if it is password protected, please share the password so I can review it and provide a solution.