Shopify themes, liquid, logos, and UX
how can i change the color of variant background
thanks in advance
Solved! Go to the solution
This is an accepted solution.
Hello @Martin299
Go to online store ----> themes ----> actions ----> edit code ---->assets ----> component-product-varient-picker.css
add this code at the end of the file.
.product-form__input--pill input[type=radio]:checked+label {
background-color: #ffcc33;
color: #000;
}
result
Thanks
This is an accepted solution.
@Martin299 , replace the old code with this:
<style>
.product-form__input--pill input[type=radio]:checked+label {
border: unset;
background-color: #f6b600;
color: black ! important;
}
</style>
Hi @Martin299 ,
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head>
<style>
.product-form__input--pill input[type=radio]:checked+label {
background: #ffc520 !important;
border: unset !important;
}
</style>
If my reply is helpful, kindly click like and mark it as an accepted solution.
Thanks!
it works,
how can i change the text color to black in variant
I am giving you the fix just give me a few minutes.
This is an accepted solution.
@Martin299 , replace the old code with this:
<style>
.product-form__input--pill input[type=radio]:checked+label {
border: unset;
background-color: #f6b600;
color: black ! important;
}
</style>
Hey @Martin299
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag
<style>
.product-form__input--pill input[type=radio]:checked+label {
background: #FFCC33 !important;
border: unset !important;
}
</style>
RESULT:
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Best Regards,
Moeed
Hello @Martin299
I am Shopify Developer. I can fix this issue .Can you please share your Website URL and Password.
Thanks
This is an accepted solution.
Hello @Martin299
Go to online store ----> themes ----> actions ----> edit code ---->assets ----> component-product-varient-picker.css
add this code at the end of the file.
.product-form__input--pill input[type=radio]:checked+label {
background-color: #ffcc33;
color: #000;
}
result
Thanks
Thanks for accepting the solution
Please hit like button also.
Hello @Martin299
Go to online store ----> themes ----> actions ----> edit code ---->assets....>component-product-variant-picker.css
add this code at the bottom of the file
.product-form__input--pill input[type=radio]:checked+label {
background:red !important; /* You can change the color here as per your requirement */
border: unset !important;
}
You can use whatever color you want in place of red.
Buy me a Pizza
If this was helpful, hit the like button and accept the solution.
Thanks
Thanks for accepting the solution
Please hit like button also.
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024