All things Shopify and commerce
hiiii
I would like to change the colour of sale badge that is on product card in homepage. please check screenshot
store url: https://5a3cf5-fc.myshopify.com/
Solved! Go to the solution
This is an accepted solution.
See it perfectly works in the theme settings of the theme customisation,
This is an accepted solution.
Go to online store ----> themes ----> actions ----> edit code---->base.css
add this code at the end of the file.
span#NoMediaStandardBadge-template--17181254746297__featured_collection_bYbp6n-7945386721465 {
background: red !important;
line-height: 0.5;
width: 80px !important;
}
result
Thanks
Hello @ctal37, Please follow these steps to add this CSS code:
1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your CSS file. If you have a custom CSS file, open that instead.
5. If you can't find your custom CSS file, open base.css" OR "theme.css".
6. Add the following code at the end of the file.
.card__content .card__badge .badge {
background: red;
}
Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.
See its working,
Hello @ctal37, It can change with theme settings.
Go to Online store -> Open Theme Customisation -> Open theme settings in left side with settings logo.
add your color scheme of the badges that you want.
Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.
Hello @ctal37, Remove all custom CSS which you added for this and Try in this way with theme settings.
Hello @ctal37
Go to online store ----> themes ----> actions ----> edit code---->base.css
add this code at the end of the file.
.badge {
background-color: crimson !important;
color: white !important;
}
Result
If this was helpful, hit the like button and accept the solution.
Thanks
@Rahul_dhiman this code is changing colour of both the badges and I just want to change the colour of ( sold out ) one also want to decrease the size of this badge. please help
Check my last answer of theme settings, there you can customise different for both badges with different color.
This is an accepted solution.
See it perfectly works in the theme settings of the theme customisation,
This is an accepted solution.
Go to online store ----> themes ----> actions ----> edit code---->base.css
add this code at the end of the file.
span#NoMediaStandardBadge-template--17181254746297__featured_collection_bYbp6n-7945386721465 {
background: red !important;
line-height: 0.5;
width: 80px !important;
}
result
Thanks
Starting a B2B store is a big undertaking that requires careful planning and execution. W...
By JasonH Sep 23, 2024By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024