Hoe voeg ik de Termly-consentbanner toe aan mijn Website Builder-site?

Met de Termly add-on kun je je consentbanner upgraden om instellingen en uiterlijk aan te passen en toegang te krijgen tot veel andere handige functies die je website kunnen helpen te voldoen aan de privacywetgeving.

Hieronder laten we je zien hoe je de verbeterde consentbanner toevoegt aan je Website Builder-site met behulp van de code-component.

Wil je liever een video bekijken?
We hebben een stapsgewijze videotutorial over hoe je het Termly-dashboard gebruikt en de consentbanner toevoegt aan je Website Builder-site: Bekijk op YouTube.

• Voordat je begint
• Stap 1 - Schakel de consentbanner uit in het Website Builder-dashboard
• Stap 2 - Log in op het Termly-dashboard
• Stap 3 - Scan je website op cookies
• Stap 4 - Pas je consentbanner aan
• Stap 5 - Kopieer de HTML-code van de consentbanner
• Stap 6 - Kies de code-component in Website Builder
• Stap 7 - Voeg de consentbanner-code toe aan je website
• Stap 8 - Wijzig de instellingen van het code-component
• Stap 9 - Voeg de code van de voorkeursinstellingen toe aan je website
• Stap 10 - Pas de plaatsing en stijl van de voorkeursinstellingen-link aan
• Stap 11 - Sla je website op en publiceer

Voordat je begint

Om de verbeterde consentbanner aan je Website Builder-site toe te voegen, heb je een Termly abonnement nodig en toegang tot de code-component van Website Builder. De code-component is inbegrepen in de Website Builder Premium- en Business + E-commerce-pakketten. 

Stap 1 - Schakel de consentbanner uit in het Website Builder-dashboard

Gebruik je al de standaard consentbanner van Website Builder (die ook door Termly wordt geleverd)? Schakel deze dan eerst uit voordat je de verbeterde consentbanner op je website toevoegt.

1. Open je Website Builder-dashboard vanuit het one.com Configuratiescherm.
2. Klik op Website-instellingen en selecteer Consentbanner in het menu aan de linkerkant.
3. Zorg dat de consentbanner is uitgeschakeld - de schuifknop moet grijs zijn. Als de consentbanner actief is, schakel deze dan uit door op de schuifknop te klikken.
4. Publiceer je website.

Stap 2 - Log in op het Termly-dashboard

1. Log in op het one.com Configuratiescherm en klik op Termly onder Geavanceerde instellingen.

   

2. Klik op de blauwe knop Ga naar Termly. Als je nog geen Termly-abonnement hebt, kun je dit op deze pagina aanschaffen.

   

3. Vul je e-mailadres en Termly-wachtwoord in en klik op Inloggen om in te loggen op het Termly-dashboard.

Stap 3 - Scan je website op cookies

1. Klik in het Termly-dashboard op Consent Management > Cookies in het menu aan de linkerkant.
2. Klik op Scan now.

Stap 4 - Pas je consentbanner aan

1. Klik in het linkermenu op Consent management > consentbanner. Op deze pagina kun je de instellingen en het uiterlijk van je banner aanpassen.
2. Als je klaar bent, klik je onderaan de pagina op Opslaan.

Voor meer informatie over de aanpassingsopties, bekijk onze handleiding.

Stap 5 - Kopieer de HTML-code van de consentbanner

1. Klik op de knop Install bovenaan op de Consentbanner-pagina.
2. In het pop-up venster dat opent, zie je de status van de cookiescan en de vervolgstappen. Klik onder stap 2 op Embed.
3. Klik in het volgende venster op Plain HTML.
4. Je ziet nu het script dat in de code-component in Website Builder moet worden toegevoegd. Je kunt hier ook kiezen om de functie Auto Blocker te activeren. Kopieer de code door op Copy to clipboard te klikken.

Stap 6 - Kies de code-component in Website Builder

1. Ga naar je Website Builder-editor.
2. Klik in het menu aan de linkerkant op Meer en kies Code.

Stap 7 - Voeg de consentbanner-code toe aan je website

1. Kies in het pop-up venster Voor het sluiten van </head> als Plaatsing van de code.
2. Plak de scriptcode in het veld en klik op Opslaan.

Stap 8 - Wijzig de instellingen van het code-component

1. Je ziet nu de code-component bovenaan je pagina in de editor. Klik erop om de instellingen te openen.
2. Klik in de instellingen van de code-component op Positie en vink het vakje voor Toepassen op alle pagina's aan, zodat de consentbanner op alle pagina's van je website wordt getoond.

Stap 9 - Voeg de code van de voorkeursinstellingen toe aan je website

Naast de consentbanner raden we aan ook een link naar de voorkeursinstellingen op je website toe te voegen. Bezoekers kunnen hier hun cookievoorkeuren wijzigen.

1. Maak in de Website Builder-editor nog een code-component aan via het menu aan de linkerkant, klik Meer > Code.

2. Kies Normaal als plaatsing van de code.

3. Kopieer en plak de volgende code in het veld en klik op Opslaan:

<a href="#" class="termly-display-preferences" style="color:#000000;">Consent Preferences</a>

Stap 10 - Pas de plaatsing en stijl van de voorkeursinstellingen-link aan

1. Sleep de code-component van de voorkeursinstellingen naar de gewenste plaats op je website. We raden aan om het in de footer te plaatsen, zodat het op alle pagina's zichtbaar is.

2. Je kunt de stijl van de link aanpassen met CSS in de code. Klik op de code-component, selecteer Code bewerken en voeg de gewenste CSS-stijlen toe.
   In het voorbeeld hieronder hebben we de kleur van de link ingesteld op zwart en de onderstreping verwijderd:

<a href="#" class="termly-display-preferences" style="color:#000000; text-decoration: none;">Consent Preferences</a>

Stap 11 - Sla je website op en publiceer

Klik op Opslaan en Publiceren om de wijzigingen online zichtbaar te maken.

Controleer of je consentbanner correct werkt, door je website in incognito-modus te openen. Als je de consentbanner niet ziet, probeer dan je cookies te wissen en controleer of je alle bovenstaande stappen goed hebt voltooid.

Gerelateerde artikelen:

• Aan de slag met Termly
• Heb ik een consentbanner nodig op mijn website?