Tuto Créer une case à cocher RGPD pour Shopify

Comment rendre valide vos formulaires RGPD sur Shopify ?

C’est simple, nous allons voir dans ce tutoriel comment créer une case à cocher sur vos formulaires de newsletter et contact.

Ce tutoriel est prévu pour votre thème et ne prend pas en compte les éventuelles applications que vous avez sur votre Shop…

En effet les codes des applications n’étant pas disponible, c’est a leur service d’effectuer les démarches afin d’être conforme RGPD sur Shopify

La partie la plus compliquée sera de trouver les fichiers comportant le formulaire de newsletter et la page contact.

Selon les thèmes l’emplacement sera différent et je compte sur vous pour m’aider à répertorier l’emplacement sur votre thème afin d’étoffer au mieux ce tutoriel 😉 Et oui c’est à vous de bosser un peu cette fois ci 😀

Trouver les fichiers

Formulaire de Contact

Généralement il se trouve dans Assets – templates – page.contact.liquid

Trouvez la fermeture du formulaire: </form> ou {% endform %} et vous copierez le code juste avant (la ligne d’avant)

Vous trouverez le code en bas de page.

Formulaire de Newsletter

Généralement il se trouve dans:

  • Assets – snippets – newsletter-form.liquid
  • Assets – sections – footer.liquid

Trouvez la fermeture du formulaire: </form> ou {% endform %} et vous copierez le code juste avant (la ligne d’avant)

Vous trouverez le code en bas de page.

Code à insérer

<div class="gd-rgpd-agree" style="font-size:11px;display:block;clear:both;">
<p class="cgv-text" style="padding:15px 0 0 0;margin:0 0 7px 0;">
<input type="checkbox" id="agree" required style="display:inline-block;float:left;margin-right:5px;" />
<label for="agree" style="display:inline;">
En cochant cette case et en soumettant ce formulaire, j'accepte que mes données personnelles soient utilisées pour me recontacter dans le cadre de ma demande indiquée dans ce formulaire. Aucun autre traitement ne sera effectué avec mes informations.
</label>
</p>
<p class="cgv-text">Pour connaitre et exercer vos droits , notamment de retrait de votre consentement à l'utilisation de données collectés par ce formulaire, veuillez consulter notre 
<a style="text-decoration:underline;" href="/pages/politique-de-confidentialite" target="_blank">Politique de confidentialité</a>
</p>
</div>
<script>                  
jQuery(document).ready(function() {
  jQuery('body').on('click', '[name="checkout"], [name="goto_pp"], [name="goto_gc"]', function() {
    if (jQuery('#agree').is(':checked')) {
      jQuery(this).submit();
    } else {
      //alert("You must agree with the terms and conditions of sales to check out.");
      alert("Vous devez accepter les conditions générales de vente pour pouvoir passer commande .");
      return false;
    }
    });
});
</script>

N’oubliez pas de créer votre page de politique de confidentialité car un lien va pointer directement sur celle ci

Pour ce faire… Créez une page et nommé la exactement comme ceci: « Politique de confidentialité » et tout se synchronisé.

Vous êtes maintenant conforme RGPD sur votre thème Shopify mais attention uniquement sur la partie des formulaires !

 

Merci de me laisser une petite note 😉
[Note moyenne: 1 sur 5]

🤗 Vous souhaitez m'encourager à continuer mes Tutos ?

Cliquez sur le bouton ci-dessous pour me laisser un petit pourboire 😉

Payer un coup à Dgeo Dev

Cet article a 33 commentaires

  1. Salut Dgeo !

    Mille mercis ! Tu me sauves la vie car ça fait deux jours que je m’arrache les cheveux pour trouver la solution et tu est arrivé !

    PS : J’ai le thème Supply et le bon chemin est : Assets – snippets – newsletter-form.liquid.
    Ensuite, je l’ai personnalisé.

    T’es un boss !

    Manu

  2. Merci Dgeo pour ce tuto,
    J’ai le thème Brooklyn.
    La 1ère partie est ok Pour moi (dans Templates)
    Mais je ne trouve pas le 2e point pour la case à cocher dans la newsletter !
    Tu sais où chercher exactement sur ce thème ?
    Merci !

    1. Hello, regarde dans sections – si tu n’as pas une newsletter.liquid ou assimilé

      1. Bonjour,

        Pour faire suite au commentaire j’ai également le thèmeBrooklyn je ne sais pas comment faire pour le second

  3. Hey merci pour le tuto il est génial 🙂 du coup en faisant cela notre shop est en rêgle ? il n’y a rien d’autre a mettre en place ?

    merci encore

  4. Problème pour moi. Ma boutique est en anglais et le message qui apparaît quand la case n’est pas cochée est en français. Je ne trouve pas ce texte dans le code donc je n’arrive pas à le changer

    1. Hello, il faut simplement traduire le texte, il est pourtant dans le code donné 😉

  5. Bonjour, j’aurais aimé savoir si ce tuto et les autres fonctionnent sur prestashop ? Merci beaucoup !

    1. Hello, ils sont génériques donc oui mais à adapter selon le contexte 😉

  6. Pour le thème « debut » il et dans le fichier « page.contact.liquid » en cherchant {% endform %} 😉

    Bon courage 🙂

    1. Hello, merci 😉

    2. Bonsoir Constant,

      j’ai également le thème « Debut » !
      Le code est a placé après {% endform %} !?!

      Car je l’ai placé juste avant, mais du coup il m’a enlevé le message que j’avais précédemment installé.

      Merci

      1. Ok merci, c’est pas très logique mais tant que ca marche 😉

  7. Salut tout as bien fonctionné, je suis sur le thème supply, le seul problème c’est que ce codage empêche le client de passer à la caisse si il ne coche pas la case de la newsletter

    1. Hello, euh oui y a sans doute un conflit avec une app ou autre code. hors contexte dur de vous répondre

  8. Salut, merci beaucoup pour cette case… je respire mieux 😀

    Ou es-qu’il est passer le tuto pour bloquer le clique droit (copier) pour la boutique ???

    merci , bonne continuation à tous

    1. Hello, super merci 🙂 Le tuto a disparu car il était trop parano pour google et nuisait au SEO

  9. Le tuto ne marche pas sur mon thème Turbo …?

    1. Bonsoir, oui étrangement mes tutos fonctionne rarement sur turbo 🙁 car turbo est codé bizarrement par rapport à la norme shopify.

  10. Bonjour, pourrais tu me dire comment agrandir la taille de la police via ce code stp ? car j’ai réussi à insérer les cases a cocher mais le texte est tout petit merci 🙂

    1. Hello, trouve le 11px du code du tuto et monte le à 14 ou 15px

  11. Moi j’ai un soucis avec la Newsletter concernant la RGPD, quand j’utilise le script je vois bien la petite case avec le texte apparaître en bas mais je peux toujours entrer le mail et le valider sans cocher la case il me demande juste une vérification si je ne suis pas un robot en sélectionner différente images , pourtant avec le même script dans le formulaire de contact aucun problème il m’oblige à cocher la case 🙂

    J’ai le thème début

    Du coup j’ai essayer de modifier dans footer.liquid & newsletter.liquid et même le mettre dans les deux à la fois mais rien n’y fait en tous cas merci car il est vraiment top ! il me manque juste ce petit truc pour les mails

    1. Bonjour, il faut que le code soit bien à l’intérieur du conteneur de type

      afin que cela fonctionne car nous avons le fameux required dans le code qui dit à shopify que c’est obligatoire afin de valider le formulaire. si ca ne fonctionne pas c’est qu’il y a peut être un conflit ou une erreur de type JS.

      1. Bonsoir,

        J’ai réesayé en reprenant le thème début depuis 0 en modifiant le footer.liquid le code est bien à l’intérieur du conteneur type, on voit bien le message apparaître en dessous de l’endroit ou l’on insert le mail ainsi que la petite case. Mais quand je clique sur s’inscrire sans cocher cela fonctionne tous de même.

        Mais il n’accepte pas directement l’inscription il vérifie d’abord si je ne suis pas un « robot » en sélectionnant plusieurs images du type « Sélectionnez toutes les images montrant un feux de circulation » puis une fois fait il accepte l’inscription mail.

        Aucun problème pour la page « contact » il me demande bien de cocher la case pour envoyer le formulaire.

        Merci à vous en tous cas ! 🙂

    2. Salut Anthony,

      Je suis exactement dans le même cas de figure que toi pour la newsletter.
      As-tu trouver la solution ? 🙂

      Merci par avance Charles.

  12. Bonjour je voudrais savoir d’un point de vue optimisation du panier faudrait-il​ toujours que le client coche cette casse pour pouvoir passer au tcheckout?
    Car ayant appliquer cette modification il m’est

    1. Hello, il manque la suite de ton message. Cette case n’est pas spécialement utile au niveau du panier mais plutôt une case comme dans speedfly qui accepte les CGV et Politique de conf.

  13. Yo, la seule chose qui ne fonctionne pas chez moi c’est la case a cocher, je t’ai envoyé une video de 5sec sur messanger, et aussi, comment je peux réduire la taille de la case?
    MERCI CHEF

    1. Hello, meme problème, la case est impossible à cocher.

      Une idée du souci ? merci

      1. Bonsoir, tout dépend du thème 🙂

  14. Merci à toi pour ce tuto aussi simple que pratique ! Merci à toi d’offrir du contenu que certain monétiserai !
    Excellente continuation !

    1. Hello, merci pour ce message fort sympathique 😉

Laisser un commentaire

Fermer le menu
×
×

Panier

Tu aimes mes Tutos & mes Articles ?

Alors n'hésites pas à m'encourager à continuer ce Blog !


Je donne 1e à Dgeo Dev

Envie de Booster ton taux de conversion ?

J'ai créé une nouvelle Application Shopify qui devrait te plaire !
Elle va te permettre de créer des Bundles en direct checkout !
N'hésite pas à la tester elle est Gratuite pendant 7 jours

En savoir plus