Masquer les boutons d’ajout au panier
Vous pouvez masquer les boutons Ajouter au panier sur votre boutique en ligne et les afficher à nouveau plus tard.
Thèmes avec et sans sections
- Dans l'interface administrateur Shopify, accédez à Boutique en ligne > Thèmes.
- Recherchez le thème que vous souhaitez modifier, cliquez sur le bouton … pour ouvrir le menu Actions, puis cliquez sur Modifier le code.
- Dans le répertoire Sections, cliquez pour ouvrir votre fichier
product-template.liquid. Recherchez le code HTML du bouton Ajouter au panier. Vous pouvez rechercher le mot panier pour commencer.
Le code du bouton d’ajout au panier varie selon le thème. Recherchez une balise <input> ou <button> contenant un texte tel que Add to cart, AddToCart ou add-to-cart.
Dans le thème Debut, le code du bouton d’ajout au panier ressemble à ceci :
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>- Une fois que vous avez trouvé le code, insérez-le entre les balises Liquid
{% comment %}et{% endcomment %}. Cela empêchera le code de s’afficher sur votre boutique, mais vous aurez la possibilité de l’y remettre plus facilement si vous décidez de changer votre nouveau modèle ultérieurement.
D’après l’exemple ci-dessus, le nouveau code ressemblerait à ceci :
{% comment %}
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
{% endcomment %}- Cliquez sur Enregistrer pour confirmer vos modifications.
Lorsque vous êtes prêt(e) à afficher à nouveau vos boutons d’ajout au panier, revenez à votre fichier product-template.liquid à la page Modifier le code HTML/CSS, supprimez les balises {% comment %} et {% endcomment %}, puis cliquez sur Enregistrer.
- Dans l'interface administrateur Shopify, accédez à Boutique en ligne > Thèmes.
- Recherchez le thème que vous souhaitez modifier, cliquez sur le bouton … pour ouvrir le menu Actions, puis cliquez sur Modifier le code.
- Dans le répertoire Modèles, cliquez pour ouvrir votre fichier
product.liquid. Recherchez le code HTML du bouton Ajouter au panier. Vous pouvez rechercher le mot panier pour commencer.
Le code du bouton d’ajout au panier varie selon le thème. Recherchez une balise <input> ou <button> contenant un texte tel que Add to cart, AddToCart ou add-to-cart.
Dans le thème Minimal, le code du bouton d'ajout au panier ressemble à ceci :
<button type="submit" name="add" id="AddToCart" class="btn">
<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>- Une fois que vous avez trouvé le code, insérez-le entre les balises Liquid
{% comment %}et{% endcomment %}. Cela empêchera le code de s’afficher sur votre boutique, mais vous aurez la possibilité de l’y remettre plus facilement si vous décidez de changer votre nouveau modèle ultérieurement.
D’après l’exemple ci-dessus, le nouveau code ressemblerait à ceci :
{% comment %}
<button type="submit" name="add" id="AddToCart" class="btn">
<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>
{% endcomment %}- Cliquez sur Enregistrer pour confirmer vos modifications.
Lorsque vous êtes prêt(e) à afficher à nouveau vos boutons Ajouter au panier, revenez à votre modèle product.liquid sur la page Modifier le code HTML/CSS, supprimez les balises {% comment %} et {% endcomment %}, puis cliquez sur Enregistrer.