Comment faire un tableau de codes promo par quantité sur Shopify ?

Nous allons voir dans ce tutoriel comment ajouter un tableau de codes promo par quantité sur Shopify

Comme vous le savez il est très bon pour vos taux de conversion de proposer des réductions selon la quantité achetée.

Certaines applications proposent de faire cela mais ont tendance à être payante et alourdir votre site.
C’est pour cette raison que j’ai décidé de vous proposer un petit de bout de code sympa et pratique.

Je vais dans un premier temps vous expliquer comment créer vos codes promo et ensuite comment intégrer ce bout de code sur votre thème.

Vous pouvez voir le résultat sur le site de démo ici: https://dgeodev.myshopify.com/products/produit-1

Création des codes promos

Rendez-vous dans votre administration et suivez les étapes suivantes:

Cliquez sur « Réductions » et créez le nombre de codes promos par quantité que vous souhaitez.
Cliquez sur « Créer un code de réduction » et mettez le pourcentage voulu.

Nous allons dans ce tuto en créer 4:

  • un de -10%
  • un de -15%
  • un de -20%
  • un de -25%

Mettez donc le type en pourcentage, la valeur et la quantité à 2 pour le 10%
Créez donc les 3 autres de la même façon, quantité 3 = 15% etc…

Passons désormais à la partie technique.

Intégration des codes

Rendez-vous dans les fichiers de votre thème, Boutique en ligne – Actions – Modifier le code.
Trouvez le formulaire dans Sections – « product-template.liquid » ou dans Extraits (snippets) un fichier « product-form.liquid » ou autres dérivés selon le thème utilisé.
En fait il faut trouver une balise select (ctrl + F rechercher un select) et à la fait du select> vous allez mettre le code suivant:

<div style="width:100%; margin:15px 5px !important;">
  <table class="discount-table" width="100%" style="margin-top:0 !important;margin-bottom:10px !important;">
    <tbody>
      <tr>
        <th><p><strong>Quantité</strong></p></th>
        <th><p><strong>% de remise</strong></p></th>
        <th><p><strong>Code Promo</strong></p></th>
      </tr>
      <tr>
        <td><p>2 achats</p></td>
        <td><p>10% de remise</p></td>
        <td><p>CODE10</p></td>
      </tr>
      <tr bgcolor="#f5f5f5">
        <td><p>3 achats</p></td>
        <td><p>15% de remise</p></td>
        <td><p>CODE15</p></td>
      </tr>
      <tr>
        <td><p>4 achats</p></td>
        <td><p>20% de remise</p></td>
        <td><p>CODE20</p></td>
      </tr>
      <tr bgcolor="#f5f5f5">
        <td><p>5 achats</p></td>
        <td><p>25% de remise</p></td>
        <td><p>CODE25</p></td>
      </tr>
    </tbody>
  </table>
  <p><span style="font-size:14px;font-weight:bold;font-style:italic;color:red;">N'oubliez pas de renseigner le code promo au moment du paiement !</span></p>
</div>

Un peu de personnalisation selon le produit

Si vous souhaitez mettre ce tableau de codes promo uniquement sur certaine fiche, je vous conseille de suivre le tutoriel qui explique Comment personnaliser votre fiche produit sur shopify.

Ce tutoriel existe aussi en vidéo

Bon tutos à tous !

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

Besoin d'aide ?

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.

En savoir plus

🤗 Vous souhaitez me remercier pour mes Tutos ?

Cliquez sur le bouton ci-dessous pour m'encourager à continuer 😉

Payer un Café à Dgeo Dev

Besoin de déléguer votre SAV ?

Si vous avez besoin d'une personne pour gérer votre SAV j'ai la perle rare 😉 contactez moi en MP ou cliquez sur le bouton ci-dessous:

Je veux déléguer mon SAV

🤗 Vous souhaitez me remercier pour mes Tutos ?

Cliquez sur le bouton ci-dessous pour m'encourager à continuer 😉

Payer un Café à Dgeo Dev

Cet article a 20 commentaires

  1. cyril

    11 Nov 2017 Répondre

    Super sympa ce tableau par contre comment peu tu contrôler ça dans » Create discount code » sur shopify ? Je sais que l’on peut faire un code promo suivant le montant mais suivant le nombre d’articles achetés es ce possible ?

    Super taf ton site donne beaucoup d’idées , dès mes premières ventes je te ferais un don car c’est vraiment du bon boulot !

    1. dgeo22

      14 Nov 2017 Répondre

      Merci pour le com 😉 oui tu dois au préalable créer des code promo dans discount, le discount natif de shopify ne peut savoir combien le client achete mais tu peux estimer en ajoutant 2 valeurs d’un produit pour avoir le prix des 2 et créer ton discount en conséquence 😉 bye

  2. Polo

    16 Juil 2018 Répondre

    Salut à toi Dgeo, je ne comprend pas trop comment faut faire, est ce qu’il faut allez tout de même dans theme.scss ? Et ensuite de le coller dans . Désolé je ne comprend pas trop comment faut faire

    1. Dgeo Dev

      22 Juil 2018 Répondre

      Hello, non il faut tout mettre dans ton éditeur d’une fiche produit 😉 pas besoin d’aller dans les fichiers pour ce tuto 😉

  3. Claude

    11 Déc 2019 Répondre

    Bonjour,

    Merci pour le tuto, intéressant !

    Je voudrai faire un peu pareil mais sans codes !

    Je cherche à mettre en place un système de remise par volume.

    Ex.:
    Jusqu’à 9 => Prix normal
    De 10 à 19 => -15%
    20 et plus => 25%

    Peut on faire ça?

    Merci

    Claude

    1. Dgeo Dev

      11 Déc 2019 Répondre

      Hello, oui c’est possible en créant ces codes de réductions au préalable. Le tableaux est juste la à titre indicatif 😉

  4. Claude

    12 Déc 2019 Répondre

    Merci de ta réponse mais cela veux dire quoi?

    On créé ces codes dans « réductions » et ensuite? Parce que j’avais vu dans « réduction automatique » que l’on pouvait faire ça mais ce n’est pas cumulable. On va pouvoir créer le premier (De 10 à 19 => -15%) mais on ne peut pas créer le deuxième…. et encore moins un troisième…

    1. Dgeo Dev

      12 Déc 2019 Répondre

      Il suffit de créer autant de codes réduction par quantité que souhaité et dans le tableau donner les codes promos qui correspondent. Les codes auto de shopify sont limités à 1 donc quasiment inutile

  5. yohan

    7 Jan 2020 Répondre

    Bonjour,

    Merci pour le tuto, j’ai une question svp, si je veux que le tableau s’affiche que sur une fiche produit spécifique et non pas sur toutes les pages que dois-je faire ?

    1. Dgeo Dev

      9 Jan 2020 Répondre

      Hello, recherche dans le moteur de recherche « personnaliser fiche produit » et tu pourra réussir à faire ce que tu veux 😉

      1. thiery

        14 Fév 2020 Répondre

        moi jai ajouté sa pour que sa fonctionne 🙂 {% if product.tags contains ‘ecrire le tag ici’ %} {% endif %}

        1. Dgeo Dev

          14 Fév 2020 Répondre

          Yes ! bonne idée bravo 🙂

  6. yolaine

    23 Jan 2020 Répondre

    Bonjour,
    Le tableau est super, et te remercie pour tes tuto qui sont excellents.
    Je rencontre un souci au niveau des codes; Une fois le tableau installé et paramétré les réductions, j’ai fait un test avec plusieurs produits avec des quantités différentes. Ax2 achats, Bx3 achats et Cx4.achats
    Au passage à la caisse, tous les produits passent à -25% (code25=4 achats)
    Y aurait il une condition à mettre pour que dans le panier, chaque produit ait son code promo?
    S’il te plaît. Merci

    1. Dgeo Dev

      23 Jan 2020 Répondre

      Hello, alors je ne sais pas trop, il faut jouer avec les conditions des codes promos, sur les quantités et si ca ne suffit pas pourquoi pas sur le, prix, le poid des produits etc 🙂 bon courage.

  7. yolaine

    23 Jan 2020 Répondre

    C’est bon merci, j’ai pu faire mes conditions dans les réductions..Merci beaucoup…je penserai à te faire un don parce que tu es généreux je trouve…le bonsoir de Nouméa

    1. Dgeo Dev

      23 Jan 2020 Répondre

      Hello, ok bravo ! merci et bonne continuation 😉

  8. Tony

    15 Avr 2020 Répondre

    Hello merci pour les tutos assez sympa mais dites moi,quels sont les majorités des thèmes avec lequel les codes marche merci

    1. Dgeo Dev

      15 Avr 2020 Répondre

      Hello, sur la plupart des thèmes du store shopify et les plus populaires. Les thèmes qui posent problème sont généralement Turbo et Fastlane

  9. Tony

    15 Avr 2020 Répondre

    Merci pour la réponse,c’est à mettre sur la page produit si je ne me trompe

    1. Dgeo Dev

      17 Avr 2020 Répondre

      De rien et oui généralement mais le code peut être mis ou vous voulez 😉

Laisser un commentaire

Fermer le menu
×
×

Panier