Consentl sur BigCommerce

Installez Consentl sur BigCommerce via le Script Manager ou le thème Stencil (blocage préalable strict), gardez le checkout conforme PCI et utilisez-le avec Catalyst.

Chargeur en premier dans <head>: Selon la méthode

Il existe deux façons d’installer Consentl, selon le degré de rigueur requis pour le blocage préalable.

Méthode	En premier dans `<head>` ?	Effort
A. Script Manager	Non : il est rendu dans `{{{head.scripts}}}`, après le CSS, les polices et les scripts head du thème	Sans code
B. Fichier du thème (`base.html`)	Oui	Modification du thème ; à refaire après les mises à jour du thème

Avant l’une ou l’autre méthode, décidez du sort du consentement aux cookies propre à BigCommerce : Settings → Security & Privacy → Your customers' privacy → Cookie consent tracking.

Recommandé : le désactiver. Consentl affiche la bannière et bloque lui-même les scripts non essentiels ; conserver les deux afficherait deux bannières.
Si vous le laissez activé, BigCommerce ne rend les scripts du Script Manager des catégories Analytics, Functional ou Targeting; Advertising qu’après son propre consentement, et les deux bannières devraient être synchronisées, ce que ce guide ne couvre pas. Consentl lui-même doit alors être dans la catégorie Essential, faute de quoi il ne se chargerait jamais.

Votre clé du site Consentl se trouve sur la page Configuration de votre site dans le tableau de bord. Ajoutez le nom d’hôte de la boutique dans le champ Domaines ; www. et le domaine nu comptent comme le même site : il est donc inutile d’ajouter www. séparément.

Ce que couvre votre forfait Consentl

Free : bannière, journal des consentements et blocage manuel uniquement.
Pro : ajoute Google Consent Mode v2.
Business : ajoute le blocage automatique des traceurs connus et les règles de blocage que vous ajoutez dans le tableau de bord.

Avec Free et Pro, seules les balises que vous marquez manuellement sont bloquées.

A. Script Manager (vitrines Stencil)

Panneau de configuration → Storefront → Script Manager → Create a Script.
Renseignez :
- Name of script : Consentl
- Location on page : Header
- Select pages where script will be added : Store pages (pages de la vitrine). Pas All pages ; voir Checkout et My Account.
- Script category : Essential
- Script type : URL
- Load method : Default. Jamais Async ni Defer : le chargeur doit s’exécuter de manière synchrone.
- Script URL : https://api.consentl.com/v1/loader.js?k=SITE_KEY&l=en (ajoutez &gcm=ext si la boutique utilise aussi le modèle GTM de Consentl, afin que seul le modèle envoie les commandes Consent Mode)
- Integrity Hash : laissez vide. Le chargeur change lorsque vous modifiez les paramètres dans le tableau de bord Consentl : un hash fixe amènerait donc le navigateur à le rejeter.
Save. Les modifications peuvent mettre environ 20 secondes à apparaître en raison de la mise en cache.
Testez dans une fenêtre de navigation privée (voir Vérifier le fonctionnement).

Le Script Manager limite le contenu des scripts à 64 Ko. Le chargeur est un script URL d’une ligne.

Checkout et My Account

BigCommerce exige un hash SRI pour chaque script de la page de checkout : « All scripts on the checkout page need at least one SRI hash to meet PCI 4.0 - 6.4.3 requirements ». L’aide de BigCommerce étend cette exigence à la page My Account lorsque les cartes enregistrées sont activées.
Le chargeur Consentl ne peut pas avoir de hash stable : il ne doit donc pas être placé à cet endroit. C’est pourquoi Store pages est la valeur par défaut ci-dessus, et pourquoi la méthode B doit tenir le chargeur à l’écart du checkout.
En conséquence, le checkout (et My Account lorsque les cartes enregistrées sont activées) n’affiche aucune bannière et aucun environnement d’exécution Consentl n’y fonctionne.
Le choix que le visiteur a fait sur la vitrine est conservé dans le cookie propriétaire consentl et est appliqué à nouveau sur la page suivante de la vitrine. Consentl ne bloque rien sur le checkout lui-même : tenez les scripts non essentiels à l’écart du checkout (sélectionnez aussi Store pages pour eux), et vérifiez ce que les intégrations Settings → Data Solutions y chargent.
Les scripts ne sont rendus sur le checkout et la confirmation de commande qu’avec l’Optimized One-Page Checkout.

B. Fichier du thème (réellement en premier)

Storefront → Themes : sur votre thème actuel, choisissez Advanced → Make a copy. BigCommerce ne permet de modifier les fichiers du thème que sur une copie. Ouvrez ensuite Advanced → Edit Theme Files de la copie, ou utilisez la Stencil CLI.
Ouvrez templates/layout/base.html et collez le chargeur directement après <head>, avant {{{head.scripts}}} et le CSS du thème :
```
<head>
    <script src="https://api.consentl.com/v1/loader.js?k=SITE_KEY&l={{language_selector.active_language_code}}"></script>
    <title>{{ head.title }}</title>
```
- {{language_selector.active_language_code}} est le helper de langue documenté. Cornerstone dispose aussi de {{locale_name}}, qui y fonctionne mais ne figure pas dans la référence des objets. Utilisez une langue fixe telle que en si aucun des deux ne renvoie le format dont vous avez besoin.
- Si Enable Nonce-Based Script Security est activé (Settings → Security & Privacy), ajoutez nonce="{{nonce}}" à la balise. Les scripts que Consentl libère après le consentement ont alors aussi besoin du nonce (attribuez-le à chaque balise que vous marquez manuellement) ou d’une politique avec 'strict-dynamic' ; sinon, le navigateur les bloque.
Enregistrez et appliquez la copie. N’ajoutez pas en plus Consentl via le Script Manager.
Les mises à jour du thème remplacent base.html : ajoutez à nouveau la ligne après chaque mise à jour.

N’ajoutez pas le chargeur aux templates du checkout (voir Checkout et My Account). Après avoir appliqué le thème, ouvrez la page de checkout et vérifiez avec Afficher le code source que le chargeur n’y figure pas.

Balises codées en dur

Un <script src>, un pixel <img> ou une <iframe> écrit dans les fichiers du thème ou dans un script du Script Manager est récupéré par le navigateur avant qu’un script ne puisse l’arrêter, même lorsque Consentl l’empêche de s’exécuter. Marquez manuellement ces balises et supprimez les pixels <noscript> :

<script type="text/plain" data-consentl="marketing" src="https://ads.example.com/tag.js"></script>
<iframe data-consentl="marketing" data-src="https://www.youtube-nocookie.com/embed/ID" title="Video"></iframe>
<img data-consentl="marketing" data-src="https://tracker.example.com/pixel.gif" alt="" width="1" height="1">

Les balises chargées par du code (GTM, le chargeur JavaScript d’un pixel) sont bloquées sans requête lorsque le blocage automatique est activé (à partir du forfait Business).

Lien de réouverture et intégrations

Les liens dont l’URL se termine par #consentl ou #consentl-preferences, ainsi que tout élément portant l’attribut data-consentl-open, ouvrent les préférences. Ajoutez-en un au pied de page (« Paramètres des cookies »).
Les intégrations de la déclaration relative aux cookies, de la demande relative aux données personnelles et de la rétractation UE fonctionnent comme décrit dans le guide pour tout site web. Le formulaire de rétractation nécessite le forfait Pro ou supérieur et doit être activé dans le tableau de bord ; sinon, il reste vide.

Content Security Policy

Si vous avez ajouté des restrictions script-src (Settings → Security & Privacy → Content Security Policy), autorisez https://api.consentl.com pour script-src et connect-src.

Catalyst (vitrine headless Next.js)

Catalyst injecte les scripts du Script Manager côté client et de manière différée : ils ne sont donc jamais en premier. Suivez le guide Next.js pour l’App Router, y compris ses recommandations « en premier dans <head> » :

core/app/[locale]/layout.tsx n’a pas de <head> explicite. Ajoutez-en un et placez-y Consentl comme l’indique le guide Next.js : un <script> simple comme premier enfant.
app/not-found.tsx rend son propre <html> ; ajoutez-y aussi Consentl.
React 19 remonte les scripts async au-dessus d’un script synchrone simple, et next/script avec afterInteractive fait télécharger la balise par le navigateur avant le consentement. Ajoutez toutes les autres balises qui doivent attendre le consentement avec le composant ConsentlScript du guide (type="text/plain" avec leur catégorie Consentl), ou gérez-les dans Google Tag Manager.

Désactivez le Cookie consent tracking de BigCommerce. Catalyst 1.3 et ultérieur intègre sa propre bannière de consentement (c15t) : supprimez-la ou désactivez-la pour éviter d’avoir deux bannières.

Vérifier le fonctionnement

Ouvrez la vitrine dans une fenêtre de navigation privée et affichez le code source : avec la méthode B, le chargeur est le premier élément dans <head>. La bannière apparaît. Le serveur de développement de la Stencil CLI ne rend pas les scripts du Script Manager, mais il rend le code du thème.

La région du visiteur est déterminée à partir de son adresse IP : Consentl recherche le pays en mémoire à chaque affichage de page (rien n’est enregistré) et applique la règle correspondante de votre tableau de bord. Les États américains ne sont pas distingués : les visiteurs américains reçoivent votre règle pour l’ensemble des États-Unis ou, à défaut, votre première règle d’État américain. Un pays inconnu reçoit votre règle pour les régions inconnues (opt-in par défaut).

Limites

Le Script Manager n’est pas en premier. Les scripts head propres au thème et tous les scripts du Script Manager que BigCommerce imprime avant Consentl s’exécutent en premier ; leur ordre dans {{{head.scripts}}} n’est pas documenté. Utilisez la méthode B pour un blocage préalable strict. Consentl bloque les traceurs reconnus qui se chargent après lui (à partir du forfait Business) ; avec Free et Pro, seules les balises que vous marquez manuellement sont bloquées.
Pas de bannière sur le checkout (ni sur My Account avec les cartes enregistrées) ; voir Checkout et My Account.
Les outils de statistiques natifs de BigCommerce ne sont pas contrôlés par Consentl (par exemple les intégrations natives GA4 ou Meta sous Settings → Data Solutions). Configurez-les pour qu’elles suivent Consent Mode, ou remplacez-les par des balises chargées via GTM.

Vous êtes bloqué ? Écrivez à support@consentl.com — nous répondons en anglais les jours ouvrables.