Bonjour à tous,
J’aimerais griser l’image d’un produit lorsque celui ci est sold out.
Pour le moment , il m’affiche un TAG. Voici le code. Que dois-je modifier dans le code ?
Product grid item liquid :
{%- unless product.available -%}
{{ 'products.product.sold_out' | t }}
theme.css.liquid
.grid-product__tag.grid-product__tag–sold-out{
background-color:{{ settings.color_body_bg | default: “#fff” }};
background-color:var(–colorBody);
color:{{ settings.color_body_text | default: “#1c1d1d” }};
color:var(–colorTextBody);
}
Merci beaucoup
Magali
www.circularclothingparis.com
1 Like
Bonjour Magali,
Voici la marche à suivre afin de griser l’image produit lorsque celui est sold out sur votre site:
Il vous suffira d’ajouter le petit bout de code ci-dessous dans votre fichier theme.css.liquid
.grid-product__tag–sold-out~.grid-product__link .grid-product__image-mask {
opacity: 0.25 !important;
}
A noter que si vous souhaitez supprimer le tag “vendu” en question, il vous faudra remplacer le code de votre theme.css.liquid que vous avez indiqué dans votre question par celui-ci (une seule ligne de code à été ajouté à la fin):
.grid-product__tag.grid-product__tag–sold-out{
background-color:{{ settings.color_body_bg | default: “#fff” }};
background-color:var(–colorBody);
color:{{ settings.color_body_text | default: “#1c1d1d” }};
color:var(–colorTextBody);
display: none !important;
}
J’inclus un screenshot de chaque possibilité vous permettant de constater que cette solution fonctionne ainsi que son rendu.
Très bonne journée à vous,
Grégoire
1 Like
Top, ravi d’avoir pu vous aider!
Grégoire
