> Tarteaucitron : La gestion des cookies simplifiée 🍋

Introduction

Dans l’écosystème web actuel, la gestion des cookies est devenue primordiale (et obligatoire). Ces petits fichiers sur le navigateur de l’utilisateur sont importants pour l’expérience utilisateur, la personnalisation du contenu et la mesure de l’audience.

Avec le RGPD en Europe, les sites web doivent gérer les cookies pour respecter la vie privée des utilisateurs et la loi. Négliger cette gestion peut entraîner des sanctions sévères et affecter la réputation de votre entreprise en ligne.

Face à ce défi, Tarteaucitron se présente comme une solution de choix pour la gestion des cookies. Cet outil innovant, entièrement développé en France (cocorico 🇫🇷), vous permet de respecter facilement les exigences du RGPD en matière de cookies.

Il permet aux utilisateurs de choisir les cookies. Il garantit que les scripts ne se chargent que si l‘utilisateur donne son accord préalable. Facile à installer et flexible, ce dispositif est essentiel pour les sites web qui se soucient de la vie privée de leurs utilisateurs.

Qu’est-ce que Tarteaucitron ?

Le principe est assez simple, aucun cookie n’est déposé par défaut sans consentement de l’internaute.

L’utilisateur a toujours le choix d’accepter ou de refuser tous les cookies de la même manière. Il n’y a pas de stratagèmes pour refuser les cookies dans des menus cachés.

Cet outil est un succès mondial utilisé sur plus de 35 000 sites, y compris des sites gouvernementaux français. Son interface est facile à utiliser et son installation est simple.

Chez Numos, nous sommes persuadés que c’est LA solution idéale pour tous ceux souhaitant se conformer au RGPD. Ce qui nous a conduit à être la première agence à les sponsoriser sur GitHub.

L’outil est en effet Open Source et peut-être déployé sans coûts pourvu que vous ayez les compétences techniques. Attention, la version auto hébergée n’a pas d’interface web pour modifier les traductions ou l’apparence du bandeau. Vous pourrez quand même le faire, mais en modifiant directement le code. Il faudra mettre les mains dans le cambouis.

Aujourd’hui, Tarteaucitron est un indispensable dans les outils proposés par Numos à ses clients.

Pourquoi choisir Tarteaucitron pour la gestion des cookies ?

L’un de ses principaux avantages est, pour la version PRO, sa facilité d’installation.

Après avoir installé le script, il reconnaîtra automatiquement les balises sur votre site et ajustera le bandeau en conséquence. Nul besoin de déclarer manuellement chaque service.

Le deuxième avantage est que vous êtes automatiquement conforme au RGPD. Les balises détectées sont bloquées jusqu’à ce que l’utilisateur donne son consentement. Au chargement de la page, aucun tracker n’est donc déclenché sans l’accord préalable accordé par l’utilisateur.

Un dernier argument pour sauter le pas ? Le prix de la version pro est grosso modo aligné à ceux de la concurrence avec un prix de 15 euros. Tarteaucitron se distingue de ses concurrents en proposant un tarif illimité pour les sites, sous-domaines et pages visitées. Contrairement à Axeptio qui facture un supplément au-delà de 5000 pages vues par mois.

Astuce des pros : La version annuelle économise 2 mois d’abonnement, soit 150 euros par an. La version à vie coûte 490 euros, ce qui équivaut à plus de 3 ans d’abonnement.

Deuxième astuces des pros : La version gratuite de tarte au citron comprend l’installation de 3 services par site. Ce qui signifie que vous n’êtes pas obligé d’utiliser la version pro si vous installez par exemple uniquement Google Analytics et Google ads sur votre site par exemple.

Installation via le plugin WordPress (Niveau Débutant)

Tarte au citron propose pour les débutants sur WordPress l’installation de son outil via un plugin très simple qui ne nécessitera aucune compétence en développement. Ce dernier s’installe très simplement via la marketplace officielle de WordPress, que vous pouvez retrouver sur l’accès administrateur de votre site.

La seule configuration que vous devrez faire sera de récupérer votre identifiant unique ainsi que votre token directement sur le site de Tarte au citron, via vos paramètres. Pour, dans un second temps, sélectionner les services via un menu déroulant que vous souhaitez installer sur votre site et fournir votre identifiant unique pour ce service.

Par exemple, votre identifiant Google Analytics pour la balise Google Analytics et votre identifiant Google Ads pour la balise Google Ads.

Installation manuelle (Niveau expert)

Dans notre cas, nous allons voir comment le déployer sur WordPress en utilisant les éléments de GeneratePress et le fichier functions.php de notre thème enfant. L’installation de la version PRO est différente de celle-ci. Avec la version PRO, il suffit de mettre le script sur le site et de tout gérer via l’interface.

Toutes les versions sont disponibles sur le github officiel à cette adresse.

Les fichiers contenus dans le .zip que nous venons de télécharger devront être placés dans l’un des dossiers de votre installation WordPress. Pour l’exemple, j’ai créé un dossier « tarteaucitron » avec ce chemin : « wp-content/themes/generatepress_child/tarteaucitron » dans lequel je viens déposer uniquement les fichiers nécessaires (cf image ci-dessous).

Retenez bien l’emplacement de votre installation car nous allons en avoir besoin pour la prochaine étape.
Actuellement Tarteaucitron est disponible, mais il n’est jamais appelé.

Rendez-vous dans le fichier functions.php pour y ajouter le bout de code ci-dessous permettant d’appeler le script tarteaucitron.js et quelques réglages.

<?php

function tarteaucitron_init() {
    ?>
    <script src="/wp-content/themes/generatepress_child/tarteaucitron/tarteaucitron.js"></script>
    <script type="text/javascript">
        tarteaucitron.init({
          "privacyUrl": "", /* Privacy policy url */
		  "DenyAllCta": false,
		  "closePopup": true,
          "hashtag": "#tarteaucitron", /* Open the panel with this hashtag */
          "cookieName": "tartaucitron", /* Cookie name */
          "orientation": "middle", /* Banner position (top - bottom) */
          "showAlertSmall": false, /* Show the small banner on bottom right */
          "cookieslist": false, /* Show the cookie list */
          "adblocker": false, /* Show a Warning if an adblocker is detected */
          "AcceptAllCta" : true, /* Show the accept all button when highPrivacy on */
          "highPrivacy": true, /* Disable auto consent */
          "handleBrowserDNTRequest": false, /* If Do Not Track == 1, accept all */
          "removeCredit": true, /* Remove credit link */
          "moreInfoLink": false, /* Show more info link */
		  "useExternalCss": false,
        });
		
		document.addEventListener("DOMContentLoaded", function() {
   		window.addEventListener('tac.root_available', function() {
			setTimeout(function() {
				document.getElementById('tarteaucitronCloseCross').innerHTML = tarteaucitron.lang.denyAll;
				tarteaucitron.addClickEventToElement(document.getElementById('tarteaucitronCloseCross'), function(){tarteaucitron.userInterface.respondAll('false');});
			}, 200);
		
        
   })
})
    </script>
    <?php
}
add_action('wp_head', 'tarteaucitron_init');

Il ne nous reste plus qu’à configurer un service en utilisant le guide d’installation officiel :

Ce code permet de déployer Google Analytics 4 sur notre site web et d’attendre le consentement d’un utilisateur pour le charger. Nous allons placer ce bout de code dans le footer de notre site pour ne pas ralentir inutilement le temps de chargement de nos pages.

<script type="text/javascript">
        tarteaucitron.user.gtagUa = 'G-XXXXXXXXX';
        // tarteaucitron.user.gtagCrossdomain = ['example.com', 'example2.com'];
        tarteaucitron.user.gtagMore = function () { /* add here your optionnal gtag() */ };
        (tarteaucitron.job = tarteaucitron.job || []).push('gtag');
</script>

Une fois que vous avez tout sauvegardé et éventuellement vidé votre cache, vous pouvez naviguer sur la page d’accueil de votre site où vous devriez être accueilli par le bandeau cookie :

Utilisation optimale de Tarteaucitron

Sachez que ce dispositif est déjà très flexible dans sa configuration par défaut. Le bandeau change de couleur selon la préférence système et la langue définie dans le navigateur.

Les plugins de mise en cache ou d’optimisation des fichiers javascripts peuvent créer des conflits avec le script et empêcher son chargement. Faites attention à cela.

Dans la configuration de WP Rocket j’ai par exemple dû exclure les fichiers de tarteaucitron de l’optimisation :

/wp-content/themes/generatepress_child/tarteaucitron/(.*).js

Conclusion

En conclusion, Tarteaucitron, est une solution incontournable pour la gestion des cookies sur votre site web. Son approche open-source, la facilité d’utilisation et l’engagement envers la conformité et le respect de la vie privée font de cet outil un choix fiable et pertinent pour votre site web.

Que vous soyez débutant ou pro, l’ajout de ce service sur votre site améliorera la confiance des utilisateurs. De plus, cela respectera la loi en vigueur. Si vous souhaitez le déployer sur votre site web, nous pouvons vous accompagner. Contactez-nous !