Have your say in Community Polls: What was/is your greatest motivation to start your own business?

How can I Change the hover variant picker colour ?

Solved

How can I Change the hover variant picker colour ?

mayatranquila
Excursionist
26 0 9

How can I make the variant picker colour the same as my "Add to Cart" button colour? The colour is 1A374E

Screen Shot 2024-11-21 at 1.24.28 AM.pngScreen Shot 2024-11-21 at 1.24.23 AM.png

Accepted Solution (1)

Moeed
Shopify Partner
6330 1716 2069

This is an accepted solution.

Hey @mayatranquila 

 

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>
.is-active .dropdown__item-button {
    background: #1A374E !important;
}
.dropdown__item-button:hover:not([disabled]) {
    background: #1A374E !important;
}
</style>

RESULT:

Moeed_0-1732171393196.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 3 (3)

Moeed
Shopify Partner
6330 1716 2069

This is an accepted solution.

Hey @mayatranquila 

 

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>
.is-active .dropdown__item-button {
    background: #1A374E !important;
}
.dropdown__item-button:hover:not([disabled]) {
    background: #1A374E !important;
}
</style>

RESULT:

Moeed_0-1732171393196.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


AnneLuo
Shopify Partner
1138 211 235

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code before the </head> tag

<style>
.product-selector__buttons .dropdown__item-button:not([disabled]):hover {
    background: #1A374E !important;
}
</style>

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to Email Me   

Buy Me A Coffee

topnewyork
Globetrotter
748 124 139

Hello,


Please share "Store URL"


Thanks!

Need a Shopify developer?
Hire us at Top New York Web Design
For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
Try Big Bulk Discount To Boost Your Store Sales with Volume/Tier Discount