Solved

Why isn't the same color swatch code working on my Shopify product page?

Zina13
Visitor
2 0 0

Hello,

 

I need some help to figure out a few things on my product description page that was customized.

I would like to have the color swatches set like on this page, however using the same code I cannot get the same results:

(this is what I want) https://www.meriguet-carrere.com/collections/florence-bamberger/products/florens-verts-anglais

I ried on for this page and only one swatch is showing and I used the same exact code:

 

https://www.meriguet-carrere.com/products/brassee-de-pivoines-tendrement

 

<p>Dimensions : rouleau de 10,05 m x 0,52 m, raccord : 52 cm.<br></p>
<p><strong>COULEURS COORDONNÉES:<br><br></strong><strong><a href="https://www.meriguet-carrere.com/products/n26-tendrement?_pos=1&amp;_sid=235457956&amp;_ss=r" class="p_d_color n°26tendrement" target="_blank" rel="noopener noreferrer">N°26 Tendrement</a><br></strong><strong><a href="https://www.meriguet-carrere.com/products/f13-perrine?_pos=1&amp;_sid=c402e485a&amp;_ss=r" class="p_d_color n°13perrine" target="_blank" rel="noopener noreferrer">N°13 Perrine</a><br></strong><a href="https://www.meriguet-carrere.com/products/teinte-habit-vert?_pos=1&amp;_sid=988d334cf&amp;_ss=r" class="p_d_color mc46" target="_blank" rel="noopener noreferrer"><strong>MC46 Habit vert</strong></a></p>
<p> </p>

 

Another point I am trying to remove the calculator and measurement that I underslined in yellow (see file attached).

 

Thanks in advance for your help.

 

Zina

Accepted Solution (1)
LitCommerce
Astronaut
2860 684 732

This is an accepted solution.

Hi @Zina13,

I checked the product and used the tool to get the color code. You can use 'colorzilla for chrome'

Screenshot_18.png

If it helped you solve your issue, please mark it as a solution. Thank you and good luck.

LitCommerce - The Most Simple & Affordable Multi-channel Selling Tool.
Effortlessly sell on biggest marketplaces like Amazon, Etsy, eBay, Facebook etc with bulk listing tool, real-time sync & smart order management. Use LitCommerce free for 1-year now!

View solution in original post

Replies 3 (3)

LitCommerce
Astronaut
2860 684 732

Hi @Zina13,

Because the color code is added in the CSS according to the name of the product, so some products have not been declared, it won't show the color.

If you want to show 2 colors here, please go to Assets > styles.scss.liquid and paste this at the bottom of the file:

.p_d_color.n°26tendrement:before {
    background: #a04b3f;
}
.p_d_color.n°13perrine:before {
    background: #DFCEAB;
}

Hope it helps!

LitCommerce - The Most Simple & Affordable Multi-channel Selling Tool.
Effortlessly sell on biggest marketplaces like Amazon, Etsy, eBay, Facebook etc with bulk listing tool, real-time sync & smart order management. Use LitCommerce free for 1-year now!
Zina13
Visitor
2 0 0

Thank you so much for your help. Just one more question how do you code the color, ie #a04b3f?

 

Thanks again for your help.

 

Zina

LitCommerce
Astronaut
2860 684 732

This is an accepted solution.

Hi @Zina13,

I checked the product and used the tool to get the color code. You can use 'colorzilla for chrome'

Screenshot_18.png

If it helped you solve your issue, please mark it as a solution. Thank you and good luck.

LitCommerce - The Most Simple & Affordable Multi-channel Selling Tool.
Effortlessly sell on biggest marketplaces like Amazon, Etsy, eBay, Facebook etc with bulk listing tool, real-time sync & smart order management. Use LitCommerce free for 1-year now!