Comment puis-je ajouter la bannière de consentement Termly à mon site Website Builder ?

Avec le module complémentaire Termly, vous pouvez mettre à niveau votre bannière de consentement pour personnaliser ses paramètres et son apparence, et accéder à de nombreuses autres fonctionnalités utiles qui peuvent aider votre site Website Builder à se conformer aux lois sur la confidentialité.

Ci-dessous, nous allons passer en revue les étapes pour ajouter la bannière de consentement mise à niveau à votre site Website Builder avec le composant code.

Souhaitez-vous regarder une vidéo à la place ?
Nous avons un tutoriel vidéo étape par étape sur la façon d’utiliser le tableau de bord Termly et d’ajouter la bannière de consentement à votre site Website Builder : regarder sur YouTube.

Avant de commencer

Afin d’ajouter la bannière de consentement mise à niveau à votre site Website Builder, vous avez besoin d’un abonnement Termly et accès au composant Code de Website Builder. Le composant Code est inclus dans les plans Website Builder Premium et Business + E-commerce. 

Étape 1 - Désactivez la bannière de consentement dans le tableau de bord Website Builder.

Si vous utilisez déjà la bannière de consentement Basique de Website Builder (qui est également fournie par Termly), désactivez-la avant d’intégrer la bannière de consentement mise à niveau à votre site web.

  1. Ouvrez le tableau de bord de votre Website Builder depuis le panneau de configuration one.com.
  2. Cliquez sur Paramètres du site web et sélectionnez Bannière de consentement dans le menu de gauche.
  3. Assurez-vous que la bannière de consentement n’est pas activée - la bascule doit s’afficher en gris. Si la bannière de consentement est active, désactivez-la en cliquant sur la bascule.
  4. Publiez votre site web.
Capture d’écran de la page de bannière de consentement dans le tableau de bord du Website Builder. .

Étape 2 - Connectez-vous au tableau de bord Termly

  1. Connectez-vous au panneau de configuration one.com et cliquez sur Termly sous Paramètres avancés.

    Capture d’écran de one.com panneau de configuration. Le lien Termly sous Paramètres avancés est mis en surbrillance.

  2. Cliquez sur le bouton bleu Aller à Termly. Si vous n’avez pas encore d’abonnement Termly, vous pouvez l’acheter sur cette page.

    Capture d’écran de la page Termly dans one.com Panneau de configuration. Le lien « Aller à Termly » est mis en surbrillance.
  3. Entrez votre adresse e-mail et votre mot de passe Termly, puis cliquez sur le bouton Connexion pour vous connecter au tableau de bord Termly.

Étape 3 - Analysez votre site Web à la recherche de cookies

  1. Dans le tableau de bord Termly, cliquez sur Consent Management > Cookies dans le menu de gauche.
  2. Cliquez sur Scan now.
Capture d’écran de la page « Scan your website » du tableau de bord Termly.'

Étape 4 - Personnalisez votre bannière de consentement

  1. Dans le menu de gauche, cliquez sur Consent management > Consent Banner. Sur cette page, vous pouvez ajuster les paramètres et l’apparence de votre bannière.
  2. Lorsque vous êtes prêt, cliquez sur Save en bas de la page.

Pour plus d’informations sur les options de personnalisation, consultez notre guide.

Étape 5 - Copiez le code HTML de la bannière de consentement

  1. Sur la page Bannière de consentement, cliquez sur le bouton Install en haut de la page.
  2. Dans la fenêtre contextuelle qui s’ouvre, vous pouvez voir l’état de l’analyse des cookies et les prochaines étapes d’installation de la bannière. Cliquez sur Embed sous Step 2.
  3. Dans la fenêtre suivante, cliquez sur Plain HTML.
  4. Vous pouvez maintenant voir le script qui doit être ajouté au composant Code de Website Builder. Vous pouvez également choisir d’activer la fonction Auto Blocker. Copiez le code en cliquant sur Copy to clipboard.
Animation Gif montrant comment copier le code html de la bannière de consentement dans le tableau de bord Termly.

Étape 6 - Choisissez le composant Code dans Website Builder

  1. Accédez à l’éditeur de Website Builder.
  2. Dans le menu de gauche, cliquez sur Plus et choisissez Code.
Capture d’écran de l’éditeur Website Builder.

Étape 7 - Intégrez le code de la bannière de consentement à votre site Web

  1. Dans la fenêtre contextuelle, choisissez Avant de fermer </head> comme Placement du code.
  2. Collez le script de bannière de consentement dans le champ et cliquez sur Sauvegarder.
Capture d’écran du composant de code dans l’éditeur Website Builder.

Étape 8 - Modifiez les paramètres du composant Code.

  1. Vous pouvez maintenant voir le composant Code en haut de votre page dans l’éditeur. Cliquez dessus pour ouvrir ses paramètres.
  2. Dans les paramètres du composant Code, cliquez sur Placement et cochez la case Appliquer à toutes les pages, afin que la bannière de consentement puisse être affichée sur toutes les pages de votre site web.
Capture d’écran des paramètres du composant de code dans l’éditeur Website Builder.

Étape 9 - Intégrez le code du centre de préférences à votre site Web

En plus de la bannière de consentement, nous vous recommandons d’ajouter un lien vers le centre de préférences à votre site Web. En cliquant dessus, vos visiteurs peuvent modifier leurs préférences en matière de cookies.

  1. Dans l’éditeur Website Builder, créez un autre composant Code en cliquant sur Plus puis Code dans le menu de gauche.

  2. Dans la fenêtre contextuelle, choisissez Normal comme l’emplacement du code.

  3. Copiez et collez le code suivant dans le champ, puis cliquez sur Sauvegarder:

<a href="#" class="termly-display-preferences" style="color:#000000;">Préférences de consentement</a>

Capture d’écran du composant de code de l’éditeur Website Builder.

Étape 10 - Ajustez l’emplacement et le style de votre lien du centre de préférences

  1. Faites glisser le composant Code du centre de préférences à l’endroit où vous souhaitez placer son lien sur votre site Web. Nous vous recommandons de le placer dans le pied de page, car il sera alors visible sur toutes les pages.

  2. Vous pouvez modifier l’apparence du lien en ajustant son Code avec des styles CSS. Cliquez sur le composant Code, sélectionnez Modifier le code et ajoutez les styles CSS que vous souhaitez.
    Dans l’exemple ci-dessous, nous avons défini la couleur du lien sur le noir et supprimé le soulignement :

<a href="#" class="termly-display-preferences" style="color:#000000; text-decoration: none;">Préférences de consentement</a>

Capture d’écran d’un site Website Builder en mode aperçu. Le lien « Préférences de consentement » a été placé dans le pied de page.

Étape 11 - Enregistrez et publiez votre site web

Enregistrez et publiez votre site web pour rendre les modifications visibles en ligne.

Pour vérifier que votre bannière de consentement fonctionne, ouvrez votre site web en mode incognito. Si vous ne voyez pas la bannière de consentement, essayez d’effacer vos cookies et de vérifier que vous avez suivi toutes les étapes ci-dessus.

Articles liés :

Cet article vous a-t-il été utile ?

Vous ne trouvez pas ce que vous cherchez ?

Commencez une conversation

Le moyen le plus rapide de nous contacter – en semaine de 09h00 à 16h00.

Commencer la conversation