We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

Change selected variant pill color

Solved

Change selected variant pill color

EcomEO
New Member
4 0 0

How would I change the background color of these variant pills?

url is https://8238c6-b8.myshopify.com/
Image 25-06-2024 at 14.17.jpeg

Accepted Solution (1)
Moeed
Shopify Partner
7764 2081 2567

This is an accepted solution.

Hey @EcomEO 

 

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:not(.product-form__input--quantity-breaks) input[type=radio]:checked+label {
    background: blue !important;
}
</style>

RESULT:

Moeed_0-1719323217404.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

 

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Custom Design | Advanced Coding | Store Modifications


View solution in original post

Replies 4 (4)

Darshanp712
Shopify Partner
138 21 19

Hello @EcomEOPlease share your store URL and password.

So that I will check and let you know the exact solution here.
 
Best regards,
Darshan
Helpful? then please Like and Accept the Solution.
For any inquiries, please feel free to contact via WhatsApp and Email: sales@dolphinwebsolution.com.
For more information visit our website Dolphin Web Solution.

Moeed
Shopify Partner
7764 2081 2567

Hey @EcomEO 

 

Your store is password protected, can you share your password as well?

 

Best Regards,

Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Custom Design | Advanced Coding | Store Modifications


EcomEO
New Member
4 0 0

Sorry @Moeed  @Darshanp712 
Password is removed

Moeed
Shopify Partner
7764 2081 2567

This is an accepted solution.

Hey @EcomEO 

 

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:not(.product-form__input--quantity-breaks) input[type=radio]:checked+label {
    background: blue !important;
}
</style>

RESULT:

Moeed_0-1719323217404.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

 

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Custom Design | Advanced Coding | Store Modifications