Hoe voeg ik de banner voor toestemming per termijn toe aan mijn Website Builder-site?

Met de add-on kun je je toestemmingsbanner upgraden om de instellingen en het uiterlijk aan te passen, en krijg je toegang tot allerlei handige functies die je website kunnen helpen om aan de privacywetgeving te voldoen.

Hieronder laten we je zien hoe je de verbeterde toestemmingsbanner aan je Website Builder-site kunt toevoegen met de codecomponent.

Wil je liever een video bekijken?
We hebben een stap-voor-stap video-tutorial over hoe je het Termly-dashboard kunt gebruiken en de toestemmingsbanner aan je Website Builder-site kunt toevoegen: op YouTube.

• Voordat je begint
• Stap 1 - Zet de toestemmingsbanner uit in het dashboard van Website Builder
• Stap 2 - Log in op het Termly-dashboard
• Stap 3 - Check je website op cookies
• Stap 4 - Pas je toestemmingsbanner aan
• Stap 5 - Kopieer de HTML-code van de toestemmingsbanner
• Stap 6 - Kies de codecomponent in Websitebouwer
• Stap 7 - Zet de code voor de toestemmingsbanner op je website
• Stap 8 - Pas de instellingen van de codecomponent aan
• Stap 9 - Zet de code van het voorkeurencentrum op je website
• Stap 10 - Pas de plaatsing en stijl van je voorkeurscentrumlink aan
• Stap 11 - Je website opslaan en publiceren

Voordat je begint

Om de verbeterde toestemmingsbanner aan je Website Builder-site toe te voegen, heb je een nodig en toegang tot de codecomponent van Website Builder. De codecomponent zit in de Website Builder Premium- en Business + E-commerce- abonnementen. 

Stap 1 - Zet de toestemmingsbanner uit in het dashboard van Website Builder

Als je al de standaard toestemmingsbanner van Website Builder gebruikt (die ook door Termly wordt geleverd), zet die dan uit voordat je de verbeterde toestemmingsbanner op je website zet.

1. Open je Website Builder -dashboard vanuit het configuratiescherm van.com.
2. Klik op Website-Instellingen en kies Toestemmingsbanner in het menu aan de linkerkant.
3. Zorg ervoor dat de toestemmingsbanner niet is ingeschakeld - de schakelaar moet grijs zijn. Als de toestemmingsbanner aanstaat, zet je hem uit door op de schakelaar te klikken.
4. Zet je website online.

Stap 2 - Log in op het Termly-dashboard

1. Log in op het configuratiescherm van one.com 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 dat op deze pagina kopen.

   

3. Voer je e-mailadres en Termly-wachtwoord in en klik op de knop Aanmelden om in te loggen op het Termly-dashboard.

Stap 3 - Check je website op cookies

1. Klik in het Termly-dashboard op Toestemmingsbeheer > Cookies in het menu aan de linkerkant.
2. Klik op Nu scannen.

Stap 4 - Pas je toestemmingsbanner aan

1. Klik in het menu aan de linkerkant op Toestemmingsbeheer > Toestemmingsbanner. 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 .

Kijk voor meer info over de aanpassingsopties in de handleiding'.

Stap 5 - Kopieer de HTML-code van de toestemmingsbanner

1. Klik op de pagina 'Consent Banner' bovenaan op de knop 'Installeren' .
2. In het pop-upvenster dat je ziet, kun je de status van de cookiescans en de volgende stappen voor het installeren van de banner bekijken. Klik op Insluiten onder Stap 2.
3. Klik in het volgende venster op Gewone HTML.
4. Je kunt nu het script zien dat je moet toevoegen aan de codecomponent van Website Builder. Je kunt ook kiezen of je de functie Auto Blocker wilt inschakelen. Kopieer de code door op Kopiëren naar klembord te klikken.

Stap 6 - Kies de codecomponent in Websitebouwer

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

Stap 7 - Zet de code voor de toestemmingsbanner op je website

1. Kies in het pop-upvenster Voor het sluiten van </head> als de plaatsing van de code.
2. Plak het script voor de toestemmingsbanner in het veld en klik op Opslaan.

Stap 8 - Pas de instellingen van de codecomponent aan

1. Je kunt nu het codecomponent bovenaan je pagina in de editor zien. Klik erop om de instellingen te openen.
2. Klik in de instellingen van de codecomponent op Plaatsing en vink het vakje Toepassen op alle pagina's aan, zodat de toestemmingsbanner op alle pagina's van je website te zien is.

Stap 9 - Zet de code van het voorkeurencentrum op je website

Naast de toestemmingsbanner raden we je aan om een link naar het voorkeurencentrum op je website te zetten. Als je bezoekers daarop klikken, kunnen ze hun cookievoorkeuren aanpassen.

1. Maak in de Website Builder-editor nog een codecomponent door op Meer en vervolgens op Code te klikken in het menu aan de linkerkant.

2. Kies in het pop-upvenster Normaal als de 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;">Voorkeuren voor toestemming</a>

Stap 10 - Pas de plaatsing en stijl van je voorkeurscentrumlink aan

1. Sleep het onderdeel 'Voorkeurencentrumcode' naar de plek waar je de link op je website wilt hebben. We raden aan om het in de voettekst te zetten, want dan zie je het op alle pagina's.

2. Je kunt het uiterlijk van de link aanpassen door de code te veranderen met CSS-stijlen. Klik op het codegedeelte, kies 'Code bewerken' en voeg de gewenste CSS-stijlen toe.
   In het voorbeeld hieronder hebben we de kleur van de link op zwart gezet en de onderstreping weggehaald:

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

Stap 11 - Je website opslaan en publiceren

Sla je website op en publiceer hem om de wijzigingen online te laten zien.

Om te checken of je toestemmingsbanner werkt, open je je website in de incognitomodus. Als je de toestemmingsbanner niet ziet, probeer dan je cookies te wissen en check of je alle bovenstaande stappen hebt gedaan.

Gerelateerde artikelen:

• Aan de slag met Termly
• , heb ik een toestemmingsbanner nodig op mijn website?