Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
I need to edit the background color and text color of the Add To Cart button
Where do I need to edit its code? I use the Dawn Theme
Thank you very much
Hello @TRUONGPHAM_102
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 </body> on theme.liquid
<style>
.product-form__buttons button.product-form__submit.button {
background: #000 !important; /*change color according to you*/
color: #fff !important; /*change color according to you*/
}
</style>
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.
Navigate to Online Store -> Themes -> Edit Code. Search for the file base.css and go to the bottom of the file to paste the above code.
.product-form__submit {
background-color: red;
color: #fff;
}
Hello @TRUONGPHAM_102
Go to online store ---------> themes --------------> actions ------> edit code------->base.css
at the bottom of the file.
#ProductSubmitButton-template--23051625955631__main {
background: #5a31f4 !important;
border-color: #5a31f4 !important;
color: #fff;
}
and the result will be
If this was helpful, hit the like button and mark the job as completed.
Thanks
To change the background and text color of the "Add to Cart" button, here's a straightforward approach:
Find the Button's Settings: Locate the button in your website's editing tool or code.
Edit the Colors:
Save Your Changes: Save or publish the changes to update the button's appearance.
Preview: Check your website to ensure the button looks the way you want.
Find Global Growth Opportunities For Your Business with Shopify AcademyLearn how to exp...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025