Guide

Intégrer le widget Axent

Le widget Axent s'installe en copiant-collant deux lignes dans votre HTML. Ce guide couvre l'installation, les options de configuration avancées et l'API JavaScript.

1. Installation rapide

Depuis votre tableau de bord, récupérez votre snippet dans Settings → Snippet à coller et collez-le avant la balise </body> de votre site :

<script>
window.axeptSettings = {
  clientId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
  cookiesVersion: "yyyyyyyy-yyyy-yyyy-yyyy-yyyyyyyyyyyy",
  lang: "fr"
};
</script>
<script async src="//cdn.axet.fr/js/sdk.js?v=2.0.0"></script>

2. Options de configuration

L'objet window.axeptSettings accepte les propriétés suivantes :

Propriété	Type	Défaut	Description
clientId	string	requis	UUID du site dans Axent (fourni dans le snippet)
cookiesVersion	string	requis	UUID de version de la politique cookies active
lang	string	"fr"	Langue du widget. Valeurs : fr, en
position	string	Depuis l'API	Fallback de position si l'API est indisponible : bottom-left, bottom-right, popup, bottom-bar
primaryColor	string	Depuis l'API	Couleur principale en fallback (ex: #FF6B35)
secondaryColor	string	Depuis l'API	Couleur secondaire en fallback
showManageButton	boolean	Depuis l'API	Afficher le bouton "Gérer mes cookies" après consentement
googleConsentMode	object	null	Configuration Google Consent Mode v2 (voir section 4)
onConsent	function	null	Callback appelé après un choix de l'utilisateur

3. API JavaScript

Après le chargement du SDK, l'objet window.Axent est disponible globalement :

Méthode	Retour	Description
Axent.getConsent()	object | null	Retourne l'objet consentement stocké dans le cookie, ou null si absent
Axent.hasConsent(category)	boolean	Vérifie si une catégorie est acceptée. Ex: Axent.hasConsent('analytics')
Axent.open()	void	Ouvre le widget de préférences
Axent.reset()	void	Efface le cookie de consentement et rouvre le widget

Exemple — charger conditionnellement un script analytics

// Attendre le consentement avant de charger Google Analytics
document.addEventListener('axept:consent', function(e) {
  if (e.detail.choices.analytics) {
    // Charger GA4
    var s = document.createElement('script');
    s.src = 'https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX';
    document.head.appendChild(s);
  }
});

// Vérifier un consentement existant au chargement
if (window.Axent && Axent.hasConsent('analytics')) {
  // Consentement déjà donné lors d'une visite précédente
}

4. Google Consent Mode v2

Pour intégrer avec Google Consent Mode v2, ajoutez la propriété googleConsentMode à vos settings :

window.axeptSettings = {
  clientId: "votre-client-id",
  cookiesVersion: "votre-version-id",
  lang: "fr",
  googleConsentMode: {
    default: {
      analytics_storage: "denied",
      ad_storage: "denied",
      ad_user_data: "denied",
      ad_personalization: "denied",
      wait_for_update: 500
    }
  }
};

Axent met automatiquement à jour les signaux Consent Mode via gtag('consent', 'update', ...) dès que l'utilisateur fait un choix. La catégorie analytics pilote analytics_storage, la catégorie marketing pilote ad_storage, ad_user_data et ad_personalization.

5. Événement axept:consent

Le SDK dispatche un CustomEvent sur document après chaque consentement :

document.addEventListener('axept:consent', function(event) {
  var choices = event.detail.choices;
  // choices = { essential: true, analytics: true, marketing: false }
  var type = event.detail.type;
  // type = "accepted" | "refused" | "partial"
  console.log('Consentement enregistré :', choices, type);
});

6. Callback onConsent

Alternative à l'événement DOM, le callback onConsent est appelé avec les mêmes paramètres :

window.axeptSettings = {
  clientId: "...",
  onConsent: function(choices, type) {
    if (choices.marketing) {
      initFacebookPixel();
    }
  }
};

7. Bouton "Rouvrir le widget"

Pour permettre à vos visiteurs de modifier leur consentement à tout moment, liez un bouton à Axent.open() :

<button onclick="Axent.open()">Gérer mes cookies</button>

Si showManageButton est activé dans votre configuration, un bouton flottant apparaît automatiquement en bas à gauche après le premier consentement.

8. Positions disponibles

Valeur	Description
bottom-left	Coin bas gauche — discret, recommandé (défaut)
bottom-right	Coin bas droite
popup	Centré avec overlay flou — maximum de visibilité
bottom-bar	Barre pleine largeur en bas de page

Axent — axet.fr — contact : [email protected]