Nous allons voir dans ce tutoriel comment afficher le stock sur shopify

Il est important pour votre client de savoir si vous avez du stock pour vos produits et cela permet également de rendre votre fiche produit plus attrayante.

Je rappelle que dans ce tuto nous allons afficher le stock réel toutes variantes confondues.  Ce qui veut dire qu’il n’est pas destiné au dropshipping car la notion réelle de rupture de stock n’est pas justifiée et justifiable.

Ce que cela donne en vrai: https://dgeodev.myshopify.com/products/produit-1

Passons à la partie technique !

Comment installer le code

Rendez-vous dans les  fichiers de votre thème shopify et dans le dossier « sections ».

Trouvez le product-template.liquid et rechercher en faisant Ctrl + F (ou cmd + R) l’occurence « price » comme sur l’exemple ci-dessous sur le thème debut.

comment afficher le stock sur shopify

Si vous ne parvenez pas à trouver cette zone essayez de mettre des mots un peu partout pour vous repérer du style:
toto1 toto2 toto3 ! astuce de bibi 😀

Vous allez maintenant copier/coller le code suivant à l’endroit souhaité.

<style>
.sd-items-count p { color:#ff2200; font-size:15px; padding:7px 0; margin:0; }
.sd-items-count img { float:left; width:20px !important;height:auto !important;margin:0 7px 0 0; padding:0; }
</style>
{% assign product_qty = 0 %}
{% for variant in product.variants %}
{% if variant.inventory_quantity > 0 %}
{% assign product_qty = product_qty | plus: variant.inventory_quantity %}
{% endif %}
{% endfor %}
{% if product_qty > 0 %}
<div class="sd-items-count">          
<p><img src="data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDM5LjQxMSAzOS40MTEiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDM5LjQxMSAzOS40MTE7IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiPgo8Zz4KCTxnPgoJCTxnPgoJCQk8cGF0aCBkPSJNMTkuNzA2LDIzLjQxMWMtMC4wNzYsMC0wLjE1My0wLjAxOC0wLjIyNC0wLjA1M0wzLjYzNywxNS40MzdjLTAuMTY5LTAuMDg1LTAuMjc2LTAuMjU4LTAuMjc2LTAuNDQ3ICAgICBzMC4xMDctMC4zNjIsMC4yNzYtMC40NDdsMTIuNjMyLTYuMzE1YzAuMjQ3LTAuMTIzLDAuNTQ3LTAuMDI0LDAuNjcxLDAuMjI0YzAuMTIzLDAuMjQ3LDAuMDIzLDAuNTQ3LTAuMjI0LDAuNjcxTDQuOTc5LDE0Ljk4OSAgICAgbDE0LjcyNyw3LjM2M2wxNC43MjctNy4zNjNsLTExLjU4LTUuNzljLTAuMjQ3LTAuMTI0LTAuMzQ3LTAuNDI0LTAuMjI0LTAuNjcxYzAuMTI1LTAuMjQ3LDAuNDI1LTAuMzQ1LDAuNjcxLTAuMjI0bDEyLjQ3NSw2LjIzNyAgICAgYzAuMTY5LDAuMDg1LDAuMjc2LDAuMjU4LDAuMjc2LDAuNDQ3cy0wLjEwNywwLjM2Mi0wLjI3NiwwLjQ0N2wtMTUuODQ1LDcuOTIyQzE5Ljg1OSwyMy4zOTQsMTkuNzgyLDIzLjQxMSwxOS43MDYsMjMuNDExeiIgZmlsbD0iIzAwMDAwMCIvPgoJCQk8cGF0aCBkPSJNMTkuNzA2LDM5LjQxMWMtMC4wNzYsMC0wLjE1My0wLjAxOC0wLjIyNC0wLjA1M0wzLjYzNywzMS40MzdjLTAuMjQ3LTAuMTI0LTAuMzQ3LTAuNDI0LTAuMjI0LTAuNjcxICAgICBjMC4xMjUtMC4yNDcsMC40MjQtMC4zNDUsMC42NzEtMC4yMjRsMTUuNjIxLDcuODFsMTUuNjIxLTcuODFjMC4yNDgtMC4xMjIsMC41NDctMC4wMjMsMC42NzEsMC4yMjQgICAgIGMwLjEyMywwLjI0NywwLjAyMywwLjU0Ny0wLjIyNCwwLjY3MWwtMTUuODQ1LDcuOTIyQzE5Ljg1OSwzOS4zOTQsMTkuNzgyLDM5LjQxMSwxOS43MDYsMzkuNDExeiIgZmlsbD0iIzAwMDAwMCIvPgoJCQk8cGF0aCBkPSJNMzUuNTUsMzEuNDg5Yy0wLjI3NiwwLTAuNS0wLjIyNC0wLjUtMC41di0xNmMwLTAuMjc2LDAuMjI0LTAuNSwwLjUtMC41czAuNSwwLjIyNCwwLjUsMC41djE2ICAgICBDMzYuMDUsMzEuMjY2LDM1LjgyNywzMS40ODksMzUuNTUsMzEuNDg5eiIgZmlsbD0iIzAwMDAwMCIvPgoJCQk8cGF0aCBkPSJNMTkuNzA2LDM5LjQxMWMtMC4yNzYsMC0wLjUtMC4yMjQtMC41LTAuNXYtMTZjMC0wLjI3NiwwLjIyNC0wLjUsMC41LTAuNXMwLjUsMC4yMjQsMC41LDAuNXYxNiAgICAgQzIwLjIwNiwzOS4xODgsMTkuOTgyLDM5LjQxMSwxOS43MDYsMzkuNDExeiIgZmlsbD0iIzAwMDAwMCIvPgoJCQk8cGF0aCBkPSJNMy44NjEsMzEuNDg5Yy0wLjI3NiwwLTAuNS0wLjIyNC0wLjUtMC41di0xNmMwLTAuMjc2LDAuMjI0LTAuNSwwLjUtMC41czAuNSwwLjIyNCwwLjUsMC41djE2ICAgICBDNC4zNjEsMzEuMjY2LDQuMTM3LDMxLjQ4OSwzLjg2MSwzMS40ODl6IiBmaWxsPSIjMDAwMDAwIi8+CgkJPC9nPgoJPC9nPgoJPGc+CgkJPHBhdGggZD0iTTE5LjcwNiwxMy4yMzhjLTAuMjc2LDAtMC41LTAuMjI0LTAuNS0wLjVWMC41YzAtMC4yNzYsMC4yMjQtMC41LDAuNS0wLjVzMC41LDAuMjI0LDAuNSwwLjV2MTIuMjM4ICAgIEMyMC4yMDYsMTMuMDE1LDE5Ljk4MiwxMy4yMzgsMTkuNzA2LDEzLjIzOHoiIGZpbGw9IiMwMDAwMDAiLz4KCQk8cGF0aCBkPSJNMjQuNTU1LDUuODVjLTAuMTI4LDAtMC4yNTYtMC4wNDktMC4zNTQtMC4xNDZsLTQuNDk1LTQuNDk2bC00LjQ5Nyw0LjQ5NmMtMC4xOTUsMC4xOTUtMC41MTIsMC4xOTUtMC43MDcsMCAgICBzLTAuMTk1LTAuNTEyLDAtMC43MDdsNC44NTEtNC44NUMxOS40NDcsMC4wNTMsMTkuNTc0LDAsMTkuNzA3LDBsMCwwYzAuMTMzLDAsMC4yNiwwLjA1MywwLjM1NCwwLjE0Nmw0Ljg0OSw0Ljg1ICAgIGMwLjE5NSwwLjE5NSwwLjE5NSwwLjUxMiwwLDAuNzA3QzI0LjgxMSw1LjgwMSwyNC42ODMsNS44NSwyNC41NTUsNS44NXoiIGZpbGw9IiMwMDAwMDAiLz4KCTwvZz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8L3N2Zz4K" />
Il reste <span class="sd-count"><strong>{{ product_qty }}</strong></span> produits en stock.</p>
</div>
{% endif %}

Si vous voulez le mettre sur le produit mis en avant de votre page d’accueil, il vous suffira de trouver dans « sections » le fichier featured-product.liquid

Il se peut que selon le thème le nom ne soit pas forcément le même mais si il est bien codé alors ça sera le cas 😉.

Il sera intéressant de rajouter l’économie gagnée et le pourcentage juste en dessous.

Ce tutoriel existe aussi en vidéo

Vous savez maintenant comment afficher le stock sur shopify !

Bon tuto à tous et bonnes ventes !

Inclus dans Speedfly
Merci de me laisser une petite note 😉
[Note moyenne de: 5 sur 9 votes]

Cet article a 21 commentaires

  1. Super merci ! Il serait intéressant de faire un tuto sur comment ajouter le nombre de personnes en train de regarder ce produit actuellement ce serais super 🙂

  2. Merci pour ce tuto ! Tu feras gaffe tu as mis la fermeture du mais pas l’ouverture au début ^^

    1. Hello, Merci 😉

  3. Merci pour le tuto,
    simple et facile à mettre en place

  4. merci pour tout ce que tu nous apprend gratuitement.

    1. Merci pour le commentaire 🙂

  5. Bonjour,
    Est-ce valable pour tous les thèmes?
    Je n’arrive pas à trouver cette section

    1. Hello, sur certains thèmes il faut peaufiner oui. Le tuto vidéo arrive bientôt 😉 pour ne pas le louper vous pouvez vous abonner à la chaine Speedecom
      https://www.youtube.com/c/speedecom Bonne journée

  6. Bonjour. Est-ce que c’est possible en personnalisant le stock ?

    1. Hello, non navré et c’est illégal de mettre un stock fictif 🙂

      1. Dommage !

  7. bonjour, est-ce que c’est possible d’afficher le stock en fonction des tailles ? (ex : j’ai 3 S / 3 M / 3 L) avce ce code si je selectionne S ça laisse « il reste 9 dispo » alors que je voudrais que ça affiche « il reste 3 dispo »
    Merci !

    1. Hello, je pense que oui mais cela demande un codage spécifique 🙂

  8. Bonsoir, tes tutos fonctionnent ils avec le thème début et l’essai gratuit de shopify? J’ai beau suivre tes indications et intégrer les lignes de codes mais rien n’apparaît sur le site malgré que j’enrengistre. Si tu as une idée de quel est le problème

    1. Hello, oui cela fonctionne parfaitement sur le thème début. pour le coup non navré j’ai pas d’idée

  9. Bonjours ca fonctionne parfaite le problème c’est que ca me mais mon vrais stock c’est a dire 11000 et j’aurai aimer créer de l’urgence donc avoir un stock bcp plus petit comment faire ?

    1. Bonjour, oui c’est le stock que vous avez réellement en stock. L’affichage d’un stock fictif est interdit en Europe, je déconseille fortement de le faire afin de vous éviter des problèmes auprès de la DGCCRF 😉

    1. Cool merci pour le partage 😉

  10. Merci pour le tutoriel très efficace! Cependant, en plus des objets que je vend, je vend aussi des cartes cadeaux sur mon site shopify et avec ce code ça met dans la page d’article de la carte cadeau qu’il reste 0 produits alors qu’en réalité des cartes cadeaux il y en a à l’infini étant donné que c’est des codes numériques générés automatiquement.
    J’ai peur que mes clients n’en prennent pas parce qu’ils croient qu’il n’y en a plus de disponible.

    Aurais-tu une solution stp?

    1. Hello et merci pour le message. Effectivement shopify ne doit pas prévoir ce cas de figure dans son code stock… l’idéal serait de détecter en code que c’est une carte cadeau et masquer cette zone. Il faudrait donc faire un petit développement sur mesure 🙂

Laisser un commentaire

Fermer le menu

meilleure chaine youtube dropshipping shopify

Envie de tout savoir sur le Dropshipping & Shopify  ?

Alors abonne-toi à la chaine et active la cloche pour ne pas louper l'arrivée des prochaines vidéos !

S'abonner à la chaine