Voeg Meebewegende knoppen en een knop 'Terug naar boven' toe aan je Website Builder-site

Wil je de navigatie van je website verbeteren? Voeg dan meebewegende knoppen toe.

Meebewegende knoppen zijn knoppen die zichtbaar blijven op het scherm terwijl bezoekers door je website scrollen. In tegenstelling tot standaardknoppen, die uit beeld verdwijnen zodra je naar beneden scrolt, blijven Meebewegende knoppen op een vaste plek. Zo blijven belangrijke acties, zoals 'Stuur een e-mail', 'Boek nu' of 'Contact', altijd toegankelijk.

In Website Builder kun je meebewegende knoppen eenvoudig toevoegen. Ga hiervoor naar de template-instellingen, activeer de knoppen en publiceer je website. De knoppen en bijbehorende acties verschijnen daarna aan de rechterkant van het scherm op je gepubliceerde website.

Je kunt ook een handige 'Terug naar boven'-knop toevoegen, waarmee bezoekers in één klik weer bovenaan de pagina komen, ongeacht hoe ver ze naar beneden zijn gescrold.

In deze handleiding lees je stap voor stap hoe je deze knoppen toevoegt.


Stap 1 - Voeg je contactgegevens toe in de website-instellingen

Voordat je de knoppen aan je site toevoegt, is het belangrijk dat je je belangrijkste contactgegevens hebt toegevoegd aan de website-instellingen. De knoppen halen daar de nodige informatie vandaan. Ontbreekt er informatie, dan werkt de bijbehorende knop niet goed.

  1. Ga in de editor naar het menu met de twee horizontale streepjes rechtsbovenin.
  2. Klik op Instellingen in het dropdownmenu.
  3. Vul je telefoonnummer, e-mailadres en locatie (adres) in als je alle knoppen wilt gebruiken. Als je naar een boekingspagina wilt linken, maar heb je die nog niet toegevoegd, activeer deze dan via de optie Boekingen in het menu aan de linkerkant.
  4. Klik op Klaar.
Screenshot met de Website Builder-editor. Een rode pijl wijst naar het uitgevouwen menu rechtsboven en een andere rode pijl wijst naar de optie "Instellingen".

Stap 2 - Ga naar de template-instellingen in Website Builder

  1. Ga naar Template-instellingen rechtsonder in de editor.
  2. Klik op Meebewegende knoppen in het verplaatsbare menu dat verschijnt.
Screenshot met de Website Builder-editor. Een rode cirkel met het cijfer '1' verwijst naar de knop 'Template-instellingen' en een rode cirkel met het cijfer '2' markeert het tabblad 'Meebewegende knoppen' in het geopende menu met template-instellingen.

Stap 3 - Activeer Meebewegende knoppen

  1. Klik op de schuifknop voor Meebewegende knoppen tonen om de knoppen in te schakelen.
  2. Alle knoppen waarvoor informatie beschikbaar is, worden standaard getoond. Wil je een knop niet gebruiken, klik dan op het driepuntjes-icoon en kies Verbergen. Een knop wordt ook niet getoond als de bijbehorende informatie ontbreekt in de website-instellingen.
  3. Om de knoptekst aan te passen, klik je op het driepuntjes-icoon en kies je Bewerken. Je ziet dan een tekstveld waarin je de knoptekst kunt wijzigen.
  4. Als je andere informatie voor een knop wilt gebruiken, zoals een ander telefoonnummer dan in de website-instellingen, kun je dit ook toevoegen. Klik op het driepuntjes-icoon en kies Bewerken. Selecteer hier Aangepast telefoonnummer en vul de gewenste informatie in.
  5. De knoppen worden verticaal aan de rechterkant van je website weergegeven. Je kunt de volgorde aanpassen door de knoppen in het verplaatsbare menu te verslepen.

Eenmaal toegevoegd, verschijnen de knoppen niet in de editor, maar wel in Voorbeeld.

Screenshot met het menu 'Meebewegende knoppen'. Een vergrootglas zoomt in op het geopende menu met drie stippen en toont de opties 'Bewerken' en 'Verbergen'.

Stap 4 - Pas het uiterlijk van de Meebewegende knoppen aan (optioneel)

Je kunt ook de positie en stijl van de Meebewegende knoppen aanpassen.

  1. Klik op het tabblad Weergave in het verplaatsbare menu.
  2. Kies de positie van de knoppen (rechtsboven, midden rechts, rechtsonder).
  3. Selecteer de stijl voor de knoppen. De opties verschillen afhankelijk van of je een kleurenthema gebruikt.
  4. Klik op de schuifknop Knoptekst toevoegen als je wilt dat de knoptekst verschijnt wanneer bezoekers met de muisaanwijzer over een knop bewegen.
Screenshot met het geopende 'Weergave' menu. Een rode pijl wijst 'Positie' en een andere naar 'Stijl'

Stap 5 - Schakel de knop 'Terug naar boven' in

Je kunt de knop 'Terug naar boven' op dezelfde plek activeren als de meebewegende knoppen.

  1. Ga naar Template instellingen rechtsonder in de editor.
  2. Kies Terug naar boven in het verplaatsbare menu.
  3. Klik op de schuifknop Terug naar boven-knop toevoegen.
  4. Kies de stijl die je voor de knop wilt gebruiken.
  5. Ga naar Voorbeeld om de knop te kunnen zien. Als je een beetje naar beneden scrolt, verschijnt deze rechtsonder als een ronde knop met een pijl omhoog.

Het is niet mogelijk om knoptekst toe te voegen of de positie van deze knop te wijzigen.

Screenshot met het geopende menu 'Template-instellingen'. 'Terug naar boven' is rood onderstreept en een rode pijl verwijst er ook naar.

Stap 6 - Opslaan en publiceren

Klik op Opslaan en Publiceren om de knoppen zichtbaar te maken op je live website.

Screenshot waarin de website in voorbeeldmodus wordt weergegeven. Een rode pijl wijst naar de Meebewegende knoppen aan de rechterkant.

Gerelateerde artikelen:

Was dit artikel nuttig?

Kun je het antwoord niet vinden?

Start een chat

De snelste manier om contact op te nemen — op werkdagen van 09:00 tot 18:00.

Bellen kan ook!

Beschikbaar op werkdagen van 09:00 tot 16:00.