Nous allons voir dans ce tutoriel comment ajouter un pied de page comportant les informations et badges de confiance

Il est important pour rassurer vos clients d’avoir un pré footer avec de belles icônes et des éléments permettant de les rassurer.

Ce tuto va vous créer 4 colonnes avec les éléments suivants:

  • Livraison en Europe
  • Satisfait ou remboursé
  • Service après vente
  • Paiement sécurisé

Ca va donner ce genre de Footer:

footer badges de confiance shopify

Vous pouvez voir le résultat sur le site de démo: https://dgeodev.myshopify.com/

Installation du script

Rendez-vous dans les fichiers de votre thème – Boutique en ligneActions Edit code et ouvrez le dossier Layout.

Vous devez maintenant trouver le fichier theme.liquid.

Une fois le fichier ouvert rendez vous tout en bas et repérez la balise suivante: <footer… ou un code du type: {% section ‘footer’ %}

Vous allez copier/coller le code ci-dessous juste avant cette zone comme ici entre </main> et {% section ‘footer’ %} :

Code à insérer:

<!-- Début du code - Pre footer badges de confiance -->
<style>
#gd-pre-footer { overflow:hidden; clear:both; margin-top:35px; margin-bottom:10px; padding-bottom:0; }
#gd-pre-footer .col-item { padding:15px 25px; text-align:center; list-style:none; }
#gd-pre-footer ul { padding-left:0 !important; }
#gd-pre-footer center { background:#FFFFFF; }
@media screen and (min-width: 768px) {
#gd-pre-footer .col-item {
width:25%;
text-align:center;
float:left;
padding:5px 15px;
}
}
</style>
<div id="gd-pre-footer" class="pre_footer index-section home-section">
<div class="wrapper">
<div>
<ul class="footer-badges-list">
<li class="col-item">
<div class="text-center">
<img src="https://speed-ecom.eu/cdn/badge-confiance-shopify-1.png" style="height: 95px;">
<h3 class="h4">Livraison en Europe</h3>
</div>
<p></p><center>Vous n'habitez pas en France ? Pas de problème, nous livrons partout en Europe ! </center><p></p>
</li>
<li class="col-item">
<div class="text-center">
<img class="" src="https://speed-ecom.eu/cdn/badge-confiance-shopify-2.png" style="height: 95px;">
<h3 class="h4">Satisfait ou Remboursé</h3>
</div>
<p></p><center>Quelque chose ne va pas ? Ça tombe bien vous avez <strong>14 jours pour changer d'avis</strong></center><p></p>
</li>
<li class="col-item">
<div class="text-center">
<img class="img90" src="https://speed-ecom.eu/cdn/badge-confiance-shopify-3.png" style="height: 95px;">
<h3 class="h4">Service Après Vente</h3>
</div>
<p></p><center><strong>Besoin d'aide ?</strong> Nous sommes à votre service<strong> du lundi au vendredi</strong></center><p></p>
</li>
<li class="col-item">
<div class="text-center">
<img class="img90" src="https://speed-ecom.eu/cdn/badge-confiance-shopify-4.png" style="height: 95px;">
<h3 class="h4">Paiement sécurisé</h3>
</div>
<p></p><center>Nous utilisons le cryptage SSL pour des <strong>paiements en toute sécurité</strong></center><p></p>
</li>
</ul>
</div>
</div>
</div>
<!-- Fin du code - Pre footer badges de confiance -->

Si vous souhaitez ce footer seulement sur la page d’accueil il vous suffit de mettre le code dans la condition d’affichage suivante:

{% if template.name == "index" %} 
le code ci-dessus 
{% endif %}

Vous avez un fond foncé ?

Rendez-vous dans Boutique en ligne – Actions – Modifier le code – Dossier Assets – theme.scss.liquid ou style.scss.liquid ou encore timber.scss.liquid – OUvrez le et tout en bas du fichier collez le code suivant qui vous mettre un fond blanc arrondi sympa sur les images 😉 

#gd-pre-footer * {
    color: #FFF !important;    
}
#gd-pre-footer img {
    background: #FFF !important;
    border-radius: 95px !important;
    width: 95px !important;
}

Le code est bien entendu RWD c’est à dire qu’il s’adaptera aux différents supports comme les tablettes et mobiles 😉

N’oubliez pas de faire une sauvegarde avant toute modification !

Ce tutoriel existe aussi en vidéo

Bonne installation !

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

Cet article a 142 commentaires

  1. Merci pour tes tutos!

    1. Hello, merci 😉

  2. je veux le logo en anglais non en francais

    1. Hello, faudra donc en trouver et remplacer les src (lien) vers l’image dans le code 😉

  3. Salut, y’a t’il moyen d’enlever les point entre chaque badge ?

    1. Hello, les points ? euh y a pas de points 🙂 surement une interprétation de ton thème.

      1. hello, pareil moi j’ai les point

      2. Si y’a des points à cause de la balise liste du htlm , il faut tout simplement rajouter une ligne en plus dans le css : #gd-pre-footer .col-item { padding:15px 25px; text-align:center; }
        @media screen and (min-width: 768px) {
        #gd-pre-footer .col-item {
        width:25%;
        text-align:center;
        float:left;
        padding:5px 15px;
        list-style : none;
        }

        Mais apres tu auras toujours les points de liste en version portable

      3. Tu vas sur themecssliquid et tu rajoutes :

        .col-item {
        list-style: none;
        }

        ( désolé de tout ces commentaires )

  4. Hello,

    Merci pour ton tuto!
    Par contre moi cela ne fonctionne pas quand je place le code pour qu’il soit dans l’accueil uniquement

    C’est normal ?

    Merci !

  5. .col-item c’est le point qui s’affiche avant .col-item qui s’affiche sur le mien. Par contre quand je le supprime les logos deviennent verticale.

  6. Petite question, j’ai réussi à enlever les puces des pictogrammes.. mais en version téléphone, les puces reviennent, c’est dans quel fiche que je devrai faire list none ?

  7. Bonjour !
    Comment rajouter la fiche produit (en plus de la page d’accueil) dans le morceau de code :
    « {% if template.name != « index » %}  »

    « {% if template.name != « index && product.page » %}  » ?
    Merci !

  8. Merci pour les tutos!

  9. Salut à toi ! Je suis beaucoup tes conseils pour apprendre le code via Shopify et son .liquid. Je te remercie d’avance pour tes tutos très utiles.

    Cependant, après avoir mit mes propres badges de confiance dans mon footer, toute mes pages se sont complètement décalés. Je ne comprend pas où et comment cela a pu se produire, si tu as une réponse, ça serait parfait.

    Merci !

    PS : J’utilise le thème Début pour m’entrainer.

    1. Hello, merci pour le message 🙂
      Surement un soucis de fermeture de div. essayer de mettre à la fin du code donné un

  10. {% if template.name != « index » %}
    le code ci-dessus
    {% endif %}

    Je n’ai pas compris ou faut il le placer?

    1. Ce code n’est pas indispensable, c’est seulement si le code doit être que sur l’accueil et donc mettre le code du dessous à la place de « le code c-dessus »

  11. Bonjour,
    Comment peut on réduire la taille des badges ? Ils semblent énormes sur smartphone.

    1. Hello, il faudra utiliser un logiciel de retouche d’image comme photopea pour réduire leur taille

  12. Bonsoir,

    Jai pas trouver le bon endroit pour l’installer et il s’est tout au début , j’ai enlevé les lignes de code mais elles sont restées en dessus du slide les bagdes de confiances .
    Comment faire pour effacer les traces ?
    Merci

    1. Il reste surement une trace des codes quelques part, le mieux et de bien regarder par rapport aux codes d’origines. Sinon reprendre une sauvegarde du thème précédente

  13. alors pour moi sur supply en faisant ça :

    Si vous souhaitez ce footer seulement sur la page d’accueil il vous suffit de mettre le code dans la condition d’affichage suivante:

    {% if template.name != « index » %}
    le code ci-dessus
    {% endif %}

    Je les ai partout SAUF sur la page d’accueil ???

    1. Hello, il faut mettre == au lieu de !=

  14. Pour moi, ce n’est pas centré, tout est décalé sur la gauche, j’ai tout essayé

    1. C’est que le thème n’est pas compatible, lien du site au besoin en MP page Facebook.

  15. Hello ! On le place où le bout de code pour que ça n’apparaisse que sur la home ? Thanks !!

    1. Hello, il faut adapter le tuto et mettre le code dans layout – theme.liquid

  16. bonjour comment réduire la taille des images svp, merci

    1. Hello, avez un logiciel de retouche image comme photoshop ou photopea en ligne 🙂

  17. Salut il y’a une petite erreur d’orthographe dans le badge de paiement sécurisé à « nous utilisont » c’est « nous utilisons » peut tu modifier ? ou bien nous proposer d’autres footers de badges de confiance?
    En tout cas merci pour ton excellent travail, je viens de me lancer et tu m’as été d’une grande aide.

    1. Merci pour le message, Ok je vais modifier cela merci bcp 🙂

  18. Salut , toujours et encore merci pour les tutos incroyables que tu nous fais partager . Avant de modifier mon pied de page je voulais savoir si on peux choisir que certains badges genres payement sécurisé et livraison en Europe et si éventuellement tu aurais un logo livraison gratuite ? je demande beaucoup désolé ! mais vraiment MERCI mille fois !!!

    1. Hello, merci pour le message 🙂
      Pour avoir pas mal de ressources images de ce genre tu peux même si tu n’as pas le thème speedfly ou funnel installer cette app gratuite ou tu trouvera les images 🙂
      https://speed-ecom.eu/produit/speedecom-app

  19. comment peut on modifier la taille svp je galere
    merci d avance

    1. Hello, ca dépend de ton thème pour le coup, sinon rajoute en dessous de width:25%; mettre font-size:13px; (modifier le 13 par la valeur voulue)

  20. Bonjour,
    super tes tutos et très instructifs !!
    Par contre je rencontre un petit problème avec le thème Cascade. Les badges de confiance ne sont pas centrés horizontalement. La marge à gauche est 3 fois plus importante que la marge à droite.
    Aurais-tu une solution !?

    Merci à toi !

  21. Bonjour, j’ai fait la manipulation sa mache très bien merci , par contre sa s’affiche sur toutes mes pages et je veux qu’il ne soit que sur l’accueil . j’ai chercher le code {% if template.name == « index » %}
    dans le layout mais je ne l’ai pas trouvez ? comment faire svp ? C’est le theme debut.

    1. Hello, si le code n’y est pas il faut le créer et donc l’ajouter 🙂 Y a un tuto la dessus  » comment personnaliser sa fiche produit  » ou quelque chose comme cela 🙂

  22. Bonjour, j’ai bien mis le code mais le texte qui se trouve en dessous des logos est sur fond noir alors que ma page d’accueille à un fond blanc. comment dois-je mis prendre?

    1. Bonjour, c’est à cause du thème qui met cette couleur sur les balises center me semble t-il, il faut donc faire un petit hack css

  23. Salut, ça marche pour moi mais j’ai un petit problème : j’utilise product reviews et depuis que je l’ai mis, les avis de product reviews ne s’affiche plus, une idée ? Merci d’avance et parfait ce petit auto

    1. Hello, ca ressemble typiquement à un copier/coller au mauvais endroit. Essayez de supprimer ce que vous avez fait et remettez le à un autre endroit. Bonne chance.

  24. Bonjour, je ne parviens pas à faire en sorte que les badges prennent la largeur de la page. Sauriez-vous m’indiquer ?

    Merci d’avance.

  25. Salut Dgeo, excellent travail !
    Ca marche pour moi également, j’ai le thème TUrbo.
    Par contre version portable il y a un décalage sur la droite de l »ensemble un peu gênant; à quoi c’est du à ton avis ?
    Comment corriger ça ?
    Merci d’avance pour ta réponse.
    Nicolas

  26. Bonjour j’aimerais que ce code ne s’affiche sur ma page « guide des tailles » comment puis je le retiré. Merci

  27. Hello Geoffrey, comment pourrais-je stp réduire la largeur. j’aimerais que les boutons ne soient pas full sur l’ecran mais adaptés à la taille de mon footer qui laisse une marge gauche et à droite. merci par avance

    1. Hello, difficile à dire comme cela… au besoin contact moi en MP messenger 😉

  28. Merci ça marche pour moi, comment je peu changer la couleur du fond?

  29. Merci pour le tuto, comment je fais pour modifié la couleur du fond

    1. Hello, c’est une image donc avec photoshop ou photopea ou autres logiciels de retouche d’images

      1. Bonjour, merci pour la réponse, je ne sais comment le faire (je parle de la couleur du fond du pré_footer pas des icônes des badges )

        1. Hello, MP moi sur Facebook le lien du site je te donnerai un hack 😉

  30. Bonjour, tout marche parfaitement, merci d’ailleurs, seulement je n’arrive pas réduire la marge qu’il y a entre les badges et le pied de page . C’est dommage car cela fait un espace blanc pour rien !

    1. Bonjour, la c’est dépend du thème 🙁 MP au besoin pour voir si il existe un moyen de réduire ces espaces 😉

  31. Bonjour, de mon côté les liens (img) apparaissent comme cassé au niveau de ma page index, sauf le premier.
    Est-ce normal?

    1. Hello, étrange, non ce n’est pas normal, au besoin link moi le lien de ton site en MP Facebook

  32. Hello Dgeo,
    Très beau travail, ces trust badge apportent une valeur significative à ma boutique,
    Cepandant j’ai un petit soucis: Avec le thème simple, j’ai placé le code dans la page de mon « cart » pour avoir les trust badge sur la page panier. Le code s’affiche mais est légèrement décalé sur la droite. Comment puis-je le centre correctement?

    Je te remercie d’avance.

    1. Hello, merci pour le message. Au besoin link moi le site en MP et je te donnerai un hack 🙂

  33. Salut Djeo Dev,
    Merci pour ton astuce qui m’a servis plus d’une fois.
    Mon problème est que j’ai des encadrés blanc sous les badges et je n’en veux pas.
    Je veux que les citations soit directement sur le fond de page.
    Je précise que c’est la première fois que cela m’arrive peut être a cause de la mise a jour du thème.
    Si tu pouvais m’aider je t’en serai vraiment reconnaissant.
    Bonne continuation à toi.
    Je te remercie.

    1. Hello, merci pour le commentaire 🙂
      Il suffit dans le tuto de trouver la partie : background:#FFFFFF et de remplacer par background:none
      Bonne soirée

  34. Salut Dgeo et merci c’est top !

    Je souhaite simplement modifier la livraison europe par : nous livrons partout dans le monde !

    Y-a-t-il un moyen ?
    De plus j’ai remplacer la partie : background:#FFFFFF et de remplacer par background:none

    pour le pied de page mais ca ne marche pas. Bonne journée continue comme ca

    1. Hello, dans ce cas me MP pour regarder ensemble 😉

  35. Bonjour,

    Merci pour ce bout de code !

    J’ai bien réussi à l’installer mais je rencontre toujours un problème sur lequel j’aurai besoin d’aide.

    Une fois le bout de code inséré, il est bien apparut, mais il apparaissait en dessous de la newsletter ce qui ne faisait pas un bon rendu.
    J’ai donc repositionné le bout de code ci dessous en dessous du code que vous nous avez partagé:
    {% unless template contains ‘index’ or settings.secondary_newsletter_banner == false %}
    {% section ‘newsletter’ %}
    {% endunless %}

    Résultat: La newsletter est venu se repositionner en dessous des Badges, SAUF pour la page d’accueil ce qui ne donne pas un bon rendu visuel.
    J’ai cherché, éssayé différentes choses mais rien à faire …. Avez vous une solution pour positionner ce bout de code juste au dessus de la newsletter et non en dessous pour la page d’accueil ?

    Merci à vous

    1. Hello, le mieux pour trouver une solution est d’en discuter directement sur facebook 🙂

  36. bonjour,

    2 images ne s’affichent plus dans mes badges de confiance, satisfait remboursé et paiement sécurisé . puis je avoir de l’aide merci.

  37. Bonjour,

    Il y a un problème au niveau du logo service après-vente qui ne s’affiche plus .

    1. Hello, c’est des soucis temporaires cdn shopify il suffit de réactualiser la page ctrl + F5 🙂

      1. Même en réactualisant ça ne change rien, l’image service après vente n’apparaît plus !

        1. Bonsoir, effectivement soucis de cache, j’ai donc changé de serveur de chargement des images 😉 il faudra donc reprendre le nouveau code du tuto 😉

          1. Bonsoir pour moi ça fonctionne nickel merci
            Mais j’aimerais qu’il ne soit pas complètement en bas de page est ce possible de le remonter ?

          2. Hello, parfait, oui il suffit de le placer à un autre endroit du fichier

  38. c’est ok maintenant, merci !

    1. Parfait 😉 de rien bonne journée.

  39. Un tuto bien décrit car j’ai réussi à le faire rapidement. Encore merci

  40. Bonjour,
    Si je veux en mettre que trois et centrer,
    Tu sais comment faire ?
    Merci pour le tuto

    1. Hello, il suffit de trouver la partie de code : 25% et de modifier en 33%

  41. Super, un grand merci ça fait vraiment plus pro. J’ai enlevé le service après vente que je ne propose pas sur ce site.
    J’adore bidouiller dans le code (bin oui ! à 66 ans on ne peut pas dire que je sois née avec …mais comme j’aime pas tricoter…)
    C’est ma première boutique.

    1. Je vous en prie, c’est super ! un grand bravo à vous et bonne continuation pour votre boutique !

  42. MERCI BCP !!! 🙂

  43. Salut merci beaucoup pour tes tutos !

    Comment je pourrais faire pour centrer les 3 images, car j’ai enlever un badge ?

    #gd-pre-footer { overflow:hidden; clear:both; margin-top:35px; margin-bottom:10px; padding-bottom:0; }
    #gd-pre-footer .col-item { padding:15px 25px; text-align:center; list-style:none; }
    #gd-pre-footer center { background:#FFFFFF; }
    @media screen and (min-width: 768px) {
    #gd-pre-footer .col-item {
    width:25%;
    text-align:center;
    float:left;
    padding:15px 15px;
    }
    }

    Livraison en Europe

    Vous n’habitez pas en France ? Pas de problème, nous livrons partout en Europe !

    Service Après Vente

    Besoin d’aide ? Nous sommes à votre service du lundi au vendredi

    Paiement sécurisé

    Nous utilisons le cryptage SSL pour des paiements en toute sécurité

  44. Bonjour,
    Merci beaucoup en effet pour ce tutoriel!
    Vous avez le même pour rajouter un logo dans le footer a gauche ou bien centré?

    Merci!

    1. Bonsoir, merci pour le message ! Non navré mais je note l’idée 😉 bonne soirée.

  45. Bonjour j’ai un soucis le badge s’affiche parfaitement sur PC , mais sur mobile les images n’apparaissent pas, il n’y a que le texte .
    Que faire ?
    Merci
    J’utilise le thème Brooklyn .

    1. Bonsoir, étrange ! la je ne sais pas au besoin linker le lien du site sur mon Facebook 🙂

  46. J’ai vraiment pas l’habitude de mettre des commentaires mais cette fois-ci tu m’a réellement rendu service alors que j’ai cherché partout sur internet alors MERCI !

    1. Ah oui d’ailleurs les liens des images que tu as postées ne sont plus disponibles du coup il faut les changer soi-même mais rien de très bon compliqué.

      1. Hello, oui en migration cette semaine 🙂 elles sont de nouveau disponibles

    2. Hello, merci c’est sympa 😉

  47. Bonjour et merci pour tes tutos!
    J’ai le thème simple et les images ne s’affichent pas.
    Une idée s’il te plaît?

    1. Hello, oui en migration cette semaine elles sont de nouveau disponibles

  48. Attention, l’adresse des images a changé dans shopify apparemment.
    Il faudra sans doute modifier ces adresses dans le code

    1. Hello, oui merci 🙂 en migration cette semaine elles sont de nouveau disponibles

  49. Bonjour, j’ai bien appliqué le code mais j’ai un soucis au niveau de la taille d’écriture y’a t’il une possibilité de réduire la taille ?

    1. Hello, ca c’est lié au thème, c’est lui qui défini la taille. pour reprendre la main il faudra dans le code à côté du padding:15px 25px; mettre font-size:14px; adapter le 14 selon la taille voulue.

  50. Merci Dgeo Dev Toujours au Top

  51. Nickel même avec un thème prémium merci beaucoup!

  52. Salut Dgeo !
    Super tuto, j’utilise ton code depuis un moment déjà sur mes sites.

    2 Questions :

    – Est-ce qu’il est possible de rajouter 1 badge ou 2 en plus ?

    – Est-ce qu’on peut modifier la couleur du background de la zone genre pour la mettre en noir par exemple ? j’ai essayé de bidouiller mais j’ai pas trouvé.

    1. Hello, merci pour le com 🙂
      1. Oui c’est possible mais il faudra adapter le % des colonnes 100 / x colonnes
      2. On peut mettre en noir mais les images ne se verront pas très bien donc je déconseille à moins de s’y connaitre en Photoshop 😉

  53. Slt Dgeo!
    Merci pour tes codes et tout ce que tu apporte en contenu.
    Juste pour simplifier l’utilisation de ton code ( si ça n’a pas encore été suggéré ) :
    Au lieu de copier le code dans le thème au risque de la casser, il y a section code html personnalisé dans la partie personnalisation du thème, fournie par shopify.
    C’est beaucoup plus simple je trouve et il y a moins de risque de casser le thème.
    Aussi, cette section est disponible sur des pages uniques, en gros quand tu l’installe sur la page d’accueil ça reste sur la page d’accueil uniquement. Pour le mettre ailleurs il suffit de cliquer sur le produit, le cart ou autre.
    J’espère avoir été concis et dsl pour les fautes au passage.
    Bonnes ventes à tous!

    1. Hello et merci pour le message. Alors oui sur speedfly par exemple cette zone existe mais pas sur tous les thèmes et notamment les free de shopify que la plupart des personnes utilisent 😉 mais oui c’est clair que c’est mieux :). Bonne soirée.

  54. Moi je l’ai mis en haut de la page mais il prend un peu de place comment je peux faire pour réduire sa taille

    1. Hello, il faudrait limiter la largeur sur conteneur parent #gd-pre-footer { juste après rajouter : max-width:1170px; margin: 0 auto;

  55. Hello et merci pour toutes tes aides !
    Moi j’aimerai plutôt le mettre sur toutes les pages SAUF sur la page d’accueil ! Si tu as une solution je suis preneur !?
    MERCI !

    1. Hello, faire une condition inverse alors:
      {% if template.name != « index » %}
      le code ci-dessus
      {% endif %}

  56. Bonjour et merci pour tes tutos !
    Aurais-tu un tuto pour pour ajouter les logos de sécurité sur le checkout de shopify ?
    Sur ma page produit c’est ok mais impossible de trouver la solution pour le checkout :/
    Merci d’avance pour ton aide 🙂

    1. Hello, ce n’est malheureusement plus possible depuis le 1er février 2019 ou Shopify a interdit l’accès 🙁

  57. Salut !

    Super tuto merci !! pourrais tu m’aider ? Saurais-tu comment mettre des liens url direct à chaque badge ? (exemple : lorsque l’on clique sur le badge « satisfait ou remboursé » on tombe sur une page où tout est expliqué )

    1. Hello, oui il faut englober la balise img d’aun lien de type href. tu peux te renseigner sur google en tapant lien href html 😉

  58. Hello merci pour les explications !
    As-tu la possibilité de me montrer comment changer la couleur du texte pour la passer en noir en dessous de chaque badges ?
    Merci beaucoup ! 🙂

    1. Hello, vu ensemble en MP il me semble 😉

  59. salut ! si je veux changer les logos comment ça se passe ? merci !

    1. Hello, il faut changer l’url des images dans l’attribut src 🙂

  60. Hello, grand merci pour tous ces tuto, c’est superbe ! Une question, est-il possible de changer les icônes proposés ? Si oui, une vidéo auto disponible ?
    Merci !

    1. Hello et merci pour le message 🙂 il suffit de changer les url des images. il est possible des les importer sur shopify dans param – fichiers – et ensuite de prendre l’url de chaque image et de les modifier.

  61. Salut,
    Merci pour les différents partages.

    J’ai le titre de chaque badges (Livraison en Europe, Satisfait ou remboursé…)qui ne sont pas centrés par rapport au badge et le texte du dessous, peux tu me dire comment le centrer stp?
    Merci!

    1. Hello, alors la c’est le thème qui doit reprendre la main, il faudra essayer sur chaque balise h3 de mettre avant le texte des titres ceci < center >titre< /center > (enlever les espaces)

  62. Salut, tout d’abord merci. Je trouve que ca prend énormément de place, il n’y a pas une possibilité de réduire la largeur ? Merci

    1. Hello et merci pour le message, alors pour cette partie cela dépend essentiellement du thème. Il faut voir le type de conteneur qu’il utilise.

  63. bonjour est ce que c est possible de l avoir en anglais , merci pour le trust badge

    1. Hello, non navré je n’ai pas les images en anglais

      1. Bonjour,
        après que j’ai installer ce footer sur mon thème shopify, sur ma boutique apparait ce code:
        theme.productStrings = { addToCart: « Ajouter au panier », soldOut: « Épuisé », unavailable: « Non disponible » }
        Que dois-je faire pour remédier cela?

        1. Hum c’est une erreur js, je pense que le code n’a pas été coller au bon endroit. faudra essayer de revenir sur la version dupliquée ou supprimer le code du tuto et recommencer 🙂

  64. Salut,
    Je suis passé du thème Debut sur lequel tout allait bien au thème Turbo.. J’ai réinstallé les badges mais ils sont légèrement décallés sur la droite. J’ai essayé de bidouiller mais impossible de les centrer.. J’ai consulté tous les commentaires mais pas trouvé de solution à mon problème. Pourrais-tu m’indiquer la manip à effectuer ?
    Merci

    1. Hello, je pense que le code n’est pas coller au bout endroit dans le fichier. Essayer plus bas sinon me linker l’url en MP.

  65. Bonjour, je voulais savoir comment inclure ma page produit au footer? STP

    1. Hello, navré mais cela me semble non recommandé 🙂

  66. helllo merci beaucoup pour cette formation grace a toi jai pu metre ma boutique en valeur

  67. Bonjour Dgeo!
    Merci beaucoup! Super site et très bon tutos !

    Ce dernier fonctionne parfaitement et j’en suis ravi!

    Petite question, pensez-vous qu’il soit possible, facilement, de le faire afficher sur mobile et tablette non pas chaque éléments à la ligne mais plutôt 2 dans la largeur soit 2 hauteurs seulement?

    Merci d’avance et bonne continuation

    1. Hello et merci pour le message 🙂 oui en ajoutant dans le premier #gd-pre-footer .col-item { width:50%; …etc…

  68. C’est normal 🙂 Il faut savoir remercier !

    Alors ça n’a pas fonctionné tel que je le voulais, (mais ça m’a dirigé vers la solution) du coup j’ai réussi en rajoutant ce code :

    @media screen and (max-width: 600px) {
    #gd-pre-footer .col-item {
    width:50%;
    text-align:center;
    float:left;
    padding:5px 15px;
    }
    }

    1. Yes bravo ! c’était ça effectivement je me suis trompé c’était bien la 2ème occurrence qu’il fallait prendre en compte ! bravo 😉

  69. Merci pour les tutos.

  70. bonjour merci pour votre tutos par contre c’est quoi le bouton qu’on doit appuyer pour bien mettre le code on ordre

    1. Hello, maj + tabulation

  71. Salut merci pour le tuto
    Mais cela ne marche pas chez moi. J’ai suivi le tutoriel à la lettre mais rien ne s’affiche

    1. Hello, il est surement pas mis au bon endroit 🙂 essaie d’écrite des toto1 toto2 dans ton fichier afin de repérer le bon emplacement. ensuite coller le code html à cet endroit

  72. avec mon thème narrative j’arrive pas a le mettre sais normal ?

    1. Hello, c’est compatible tout thème donc il faut persévérer ou me MP le lien du site pour voir

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