Installation

Le tag unique

Collez ce tag en premier dans votre <head>, avant tout gestionnaire de balises ou script analytique :

<script
  src="https://cdn.agreely.ca/e/v1/loader.js"
  data-agreely="agr_pub_VOTRE_CLE"></script>

C'est tout. Placez ce tag en premier, avant tout autre script, et sans attribut async : le chargeur doit s'exécuter avant vos autres balises. Il est léger (environ 3 Ko compressé) et s'exécute immédiatement. Dès son exécution, il installe de façon synchrone le signal Consent Mode v2 en mode refus par défaut ainsi que la protection qui diffère les traceurs connus jusqu'au consentement ; il télécharge ensuite le module de la bannière de façon asynchrone, sans bloquer le rendu. C'est cet ordre (le chargeur d'abord, en synchrone) qui permet de retenir les traceurs des hôtes connus et d'installer le refus par défaut de Google avant toute autre balise. Un traceur servi par un hôte hors de cette liste, et non converti en type="text/plain", n'est pas retenu ; ce que la garde ne peut pas atteindre (document.write, notamment) est décrit avec le blocage des scripts.

Intégrité des sous-ressources (SRI)

Le chargeur intègre par défaut le hachage sha384 du module de la bannière ; le script injecté porte les attributs integrity et crossorigin="anonymous" automatiquement. Vous n'avez donc pas besoin d'attribut supplémentaire sur le tag de base.

Pour les versions épinglées (URL de la forme /e/vX.Y.Z/loader.js, par exemple /e/v1.5.3/loader.js), l'URL est immuable et le SRI est fixe : c'est utile si vous souhaitez contrôler la version exacte déployée. Une version épinglée ne reçoit en revanche aucune correction ultérieure ; le tag /e/v1/ suit toujours la version courante, que window.agreelyCookies.version affiche dans la console.

<script
  src="https://cdn.agreely.ca/e/v1.5.3/loader.js"
  data-agreely="agr_pub_VOTRE_CLE"></script>

Nonce CSP

Si votre script-src est à base de nonce, passez-le via l'attribut data-nonce et le chargeur le transmettra au script du module injecté :

<script
  src="https://cdn.agreely.ca/e/v1/loader.js"
  data-agreely="agr_pub_VOTRE_CLE"
  data-nonce="abc123"></script>

Obtenir votre clé de site

Connectez-vous à l'application de la bannière, cookies.agreely.ca.
Cliquez sur Ajouter un site web et entrez votre domaine. Il faut une place libre : si vous n'en avez pas, achetez-en une d'abord dans la Facturation (voir la tarification).
Sous votre site > Installation, copiez le tag, qui porte déjà votre clé de site (agr_pub_...), et collez-le dans votre <head>.
Sur la même page, cliquez sur Vérifier et analyser. Le balayeur d'Agreely charge votre page, confirme que la balise du chargeur avec votre clé est présente, marque le site comme vérifié et inventorie les témoins qu'il trouve. L'analyse s'exécute en arrière-plan.

Si votre entreprise a déjà vérifié, pour son identité Loi 25, un domaine qui couvre ce site, la vérification est héritée automatiquement : le bouton Vérifier par héritage le confirme sans attendre de balayage.

La bannière ne s'affiche qu'une fois le site vérifié et une première version publiée depuis la page Publication du site.

Vérification par balise, pas par DNS. La vérification confirme simplement que la balise data-agreely est présente sur la page : vous installez le tag, vous cliquez sur Vérifier et analyser, et le balayeur d'Agreely constate la balise. Il n'y a aucun enregistrement DNS ni fichier TXT à publier pour la bannière. Voir aussi Vérification et sécurité.

La clé de site est un identifiant public, sans capacité. Elle ne permet que de lire la configuration publique et de soumettre un enregistrement de consentement limité par les règles de domaine et les limites de taux. Elle est sans danger dans le code HTML de la page.

Rotation de la clé

Pour faire tourner une clé, cliquez sur Renouveler la clé de site sur la page Installation du site. La nouvelle clé est émise aussitôt ; l'ancienne reste valide 24 heures pendant que vous déployez le nouveau tag, puis cesse de fonctionner d'elle-même. Il n'y a pas de révocation séparée à faire.

Réouverture de la bannière

Après sa décision, la personne retrouve par défaut un bouton flottant « Gérer mes témoins » qui rouvre ses préférences. Vous pouvez aussi ajouter votre propre lien ou bouton, avec l'attribut data-agreely-preferences (l'ancien attribut data-agreely-open fonctionne toujours) :

<a href="#" data-agreely-preferences>Gérer mes témoins (cookies)</a>

Ce déclencheur permet à la personne de revoir ou de retirer son choix en tout temps ; gardez-le visible et accessible au clavier sur chaque page. Le bouton flottant se désactive dans le concepteur de bannière (voir Le concepteur de bannière) : ne le faites que si votre page offre déjà un tel déclencheur. Si aucun n'est détecté, la bannière affiche un bouton de secours. La loi exige d'informer la personne de son droit de retirer son consentement (P-39.1, art. 8 al. 1 (4°)) ou, pour un organisme public, des conséquences d'un retrait (A-2.1, art. 65 al. 1 (5°)) ; ce lien permanent est la façon dont Agreely recommande d'y donner effet. Vous pouvez aussi l'appeler par programmation :

window.agreelyCookies.open();      // ouvre les préférences
window.agreelyCookies.acceptAll(); // accepte tout par programme
window.agreelyCookies.refuseAll(); // refuse tout par programme
window.agreelyCookies.withdraw();  // retire le consentement actif
window.Agreely.openPreferences();  // ouvre les préférences (autre espace de noms)

Note d'accessibilité. La couche de préférences (role="dialog", aria-modal="true") gère les pièges de foyer, la touche Échap et la restauration du foyer. La couche 1 (bannière principale) ne bloque ni le défilement ni la navigation afin que le consentement reste libre.

Installation

#Le tag unique

#Intégrité des sous-ressources (SRI)

#Nonce CSP

#Obtenir votre clé de site

#Rotation de la clé