collection page, colors swatches not appear correctly (some colors appear to be missing)

Solved
pearlle
Tourist
6 0 4

Hello all,

Thank you in advance for your help.

I'm having this issue here, In the Collection pages, some colors swatches seem to be missing, BUT in the products page all the colors appeared correctly.

I've already added the colors swatch (.PNG) files in the assets as well, but still unable to resolve the issue.

Thank you in advance for your help and input.

 

Pearlle. 


signal-2021-10-15-180407_001.jpeg
signal-2021-10-15-174627_001.jpeg
signal-2021-10-15-174623_001.jpeg

Accepted Solution (1)

Accepted Solutions
KetanKumar
Shopify Partner
24919 2496 9027

This is an accepted solution.

@pearlle 

thanks for URL

that was white color swatch doesn't show proper so please add this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

.product-swatch-inline__dot {border: 1px solid #ccc;}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Replies 5 (5)
KetanKumar
Shopify Partner
24919 2496 9027

@pearlle 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
KetanKumar
Shopify Partner
24919 2496 9027

This is an accepted solution.

@pearlle 

thanks for URL

that was white color swatch doesn't show proper so please add this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

.product-swatch-inline__dot {border: 1px solid #ccc;}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

pearlle
Tourist
6 0 4

@KetanKumar 

Thank you,  

The code you provided is great, added the border to the colors swatches, help with display the white color properly.

 

Thank you very much!

 

Pearlle.

KetanKumar
Shopify Partner
24919 2496 9027

@pearlle 

yes, its my  pleasure to help us 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing