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.
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.
Si vous ne le trouvez pas alors il faudra fouiller ! pour dawn par exemple dans ici : Extraits (Snippets) – price.liquid
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 😉.
Comment faire pour que cela change au changement de variante ?
Malheureusement c’est impossible à prévoir étant donné que les thèmes sont tous côdés différemment… ce qui rend donc impossible de réaliser une telle chose sans un développement sur mesure 🙂
Ce tutoriel existe aussi en vidéo
Vous savez maintenant comment afficher le stock sur shopify !
Vous avez un problème pour faire fonctionner ce tutoriel ou vous avez un besoin spécifique ?
Nous pouvons le faire pour vous ! pour ce faire merci de prendre contact avec notre équipe.
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 🙂
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
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 !
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
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 ?
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 😉
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.
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 🙂
Le code prend en compte les stocks sur notre back office dans Shopify ?
Parce que lorsque j’indique que le produit est épuisé, j’ai toujours » il reste 30 produits en stock »
Bonjour, le tuto a parfaitement fonctionné, cependant mon produit est vendu sur le marché allemand, j’aimerai donc savoir si il était possible de traduire le « Il reste … produits en stock. » Merci d’avance!
Bonjour j’ai speedfly mais impossible de l’installer sur le thème 🙁 je sais que nous avont deja un affichage du stock mais je n’aime pas le format est il possible de mettre celui ci svp ?
bonjour, sur ma question precedente, je voullais dire que shoppify doit gerer les stock obligatoirement pour mon site mais par contre des que le stock tombe a 0 au lieu d’afficher ajouter au panier le bouton change et par exemplee affiche pré commander cet article est ce possible merci
Bonjour, oui logiquement les thèmes prévoient ce cas de figure mais indique plutôt le terme Epuisé. Essayez d’aller voir dans les traductions du thème pour changer ce terme. Sinon cela nécessite un développement sur mesure
Bonjour,
Nous avons intégrer le code dans notre boutique et ça fonctionne assez bien pour nos produits de base. Cependant serait-il possible de le rendre plus flexible? Nous cherchons à faire suivre également la quantité en cas de variantes (c-à-dire afficher la quantité de stock de chaque variante au lieu du total, le cas échéant) et de ne pas afficher de quantité lorsque le stock de certains produits ne sont pas suivi.
Bonjour et merci pour le commentaire. J’ai déjà eu ce type de demande mais malheureusement c’est trop complexe et surtout spécifique à chaque thème qui est codé différemment. Donc impossible de créer un code générique mais possible en développement spécifique.
Martin
30 Mai 2019Super 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 🙂
Allan
2 Sep 2019Merci pour ce tuto ! Tu feras gaffe tu as mis la fermeture du mais pas l’ouverture au début ^^
Dgeo Dev
3 Sep 2019Hello, Merci 😉
Andriano
2 Oct 2019Merci pour le tuto,
simple et facile à mettre en place
yann
7 Nov 2019merci pour tout ce que tu nous apprend gratuitement.
Dgeo Dev
7 Nov 2019Merci pour le commentaire 🙂
Bérengère
5 Déc 2019Bonjour,
Est-ce valable pour tous les thèmes?
Je n’arrive pas à trouver cette section
Dgeo Dev
6 Déc 2019Hello, 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
Le Marginal Magnifique
10 Déc 2019Bonjour. Est-ce que c’est possible en personnalisant le stock ?
Dgeo Dev
11 Déc 2019Hello, non navré et c’est illégal de mettre un stock fictif 🙂
Le Marginal Magnifique
11 Déc 2019Dommage !
mathieu
17 Déc 2019bonjour, 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 !
Dgeo Dev
19 Déc 2019Hello, je pense que oui mais cela demande un codage spécifique 🙂
frimousse
15 Avr 2020Bonsoir, 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
Dgeo Dev
15 Avr 2020Hello, oui cela fonctionne parfaitement sur le thème début. pour le coup non navré j’ai pas d’idée
emilie feuillet
27 Avr 2020Bonjours 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 ?
Dgeo Dev
27 Avr 2020Bonjour, 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 😉
Drone&Fly
23 Juin 2020Merci pour le tuto, le rendu est vraiment clean : https://prnt.sc/t4nwyk !
Dgeo Dev
23 Juin 2020Cool merci pour le partage 😉
Kaykay
23 Juin 2020Merci 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?
Dgeo Dev
24 Juin 2020Hello 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 🙂
Marc
16 Juil 2020Bonjour Dgeo Dev, merci pour le tuto,
Le code prend en compte les stocks sur notre back office dans Shopify ?
Parce que lorsque j’indique que le produit est épuisé, j’ai toujours » il reste 30 produits en stock »
Merci pour ton retour
Dgeo Dev
17 Juil 2020Hello, oui mais il prend en compte l’ensemble des quantités toutes variantes confondues du produit en cours.
Joel
19 Juil 2020Hello, est-il possible de faire la même chose, affiché le code SKU à la place. Si oui, quel bout de code faut-il mettre merci à toi 🙂 Bon dimanche !
Mokando
15 Août 2020Bonjour, le tuto a parfaitement fonctionné, cependant mon produit est vendu sur le marché allemand, j’aimerai donc savoir si il était possible de traduire le « Il reste … produits en stock. » Merci d’avance!
Mokando
15 Août 2020J’ai trouvé c’est bon, merci
Dgeo Dev
16 Août 2020Hello, ok super bravo ! 🙂
yous
20 Sep 2020Bonjour j’ai speedfly mais impossible de l’installer sur le thème 🙁 je sais que nous avont deja un affichage du stock mais je n’aime pas le format est il possible de mettre celui ci svp ?
Dgeo Dev
20 Sep 2020Hello, si tu as speedfly tu peux directement contacter le support ici 😉 speedecom.freshdesk.com
Caroline PEGAZ
17 Nov 2020Bonjour, mille mercis pour ce super tuto trop simple à utiliser et surtout un grand merci pour le code, c’est juste parfait
david clement
9 Déc 2020Bonjour,
que modifier sur le code pour que cela affiche que le produits est a 0 en stock et pas uniquement lorsque il y a du stock merci
david clement
9 Déc 2020Re bonjour,
et si le produit est à 0 peut on afficher précommander à coté par exemple?
merci encore
Dgeo Dev
9 Déc 2020Hello, oui c’est possible en gérant le stock de chaque fiche produit en cochant ne pas suivre le stock 😉
DAVID CLEMENT
26 Déc 2020bonjour, sur ma question precedente, je voullais dire que shoppify doit gerer les stock obligatoirement pour mon site mais par contre des que le stock tombe a 0 au lieu d’afficher ajouter au panier le bouton change et par exemplee affiche pré commander cet article est ce possible merci
Dgeo Dev
26 Déc 2020Bonjour, oui logiquement les thèmes prévoient ce cas de figure mais indique plutôt le terme Epuisé. Essayez d’aller voir dans les traductions du thème pour changer ce terme. Sinon cela nécessite un développement sur mesure
david clement
27 Déc 2020je pense que ca demande une modif car quand le produit est affiché épuisé il n’y a plus le bouton ajouter au panier
Charlie Turcot
26 Juil 2022Bonjour,
Nous avons intégrer le code dans notre boutique et ça fonctionne assez bien pour nos produits de base. Cependant serait-il possible de le rendre plus flexible? Nous cherchons à faire suivre également la quantité en cas de variantes (c-à-dire afficher la quantité de stock de chaque variante au lieu du total, le cas échéant) et de ne pas afficher de quantité lorsque le stock de certains produits ne sont pas suivi.
Est-ce que code permet déjà de faire ça?
Merci!
Dgeo Dev
27 Juil 2022Bonjour et merci pour le commentaire. J’ai déjà eu ce type de demande mais malheureusement c’est trop complexe et surtout spécifique à chaque thème qui est codé différemment. Donc impossible de créer un code générique mais possible en développement spécifique.