Naar de inhoud
Volzet.

De reserveringswidget op je website zetten

Eén regel code, en gasten reserveren op je eigen site in plaats van via een portal. Er zijn drie manieren; kun je tekst kopiëren en plakken, dan lukt de eerste. Heb je geen website, ga dan meteen naar je boekingspagina.

Voor je begint

Twee dingen wil je bij de hand hebben. Je sleutel — die vind je in het dashboard onder Beheer → Widget; hij begint met pk_ en mag gewoon zichtbaar op je website staan. En je domein, het adres van je site, want de widget laadt alleen op adressen die jij hebt geregistreerd.

Manier 1: de scriptregel

Werkt op elke website. Plak deze regel vlak voor </body> — in de meeste systemen heet dat veld “footer”, “body scripts” of “code voor de sluitende body-tag”. Vervang pk_JOUW_SLEUTEL door je eigen sleutel.

<script async src="https://cdn.volzet.nl/widget/v1/loader.js" data-key="pk_JOUW_SLEUTEL"></script>

Sla op, ververs je site en er staat rechtsonder een reserveerknop. Klikt een gast erop, dan opent het formulier op je eigen pagina — hij gaat nergens heen.

Het reserveringsformulier van Volzet op een telefoon: bovenaan de naam van het restaurant, daaronder een keuze voor het aantal personen met 2 geselecteerd, daarna Kies een datum en Kies een tijd, en onderaan een brede knop Reserveren.
Het formulier zoals je gast het ziet, in je eigen kleur.

Liever het formulier midden op de pagina?

Zet dan naast dezelfde regel een leeg element met data-volzet-inline op de plek waar het formulier moet komen:

<script async src="https://cdn.volzet.nl/widget/v1/loader.js" data-key="pk_JOUW_SLEUTEL"></script>
<div data-volzet-inline></div>

Inline wint. Staat dat element op de pagina, dan rendert de widget daarin en verschijnt de zwevende knop niet. Je bepaalt de modus dus met de opmaak van je pagina, zonder de scriptregel te veranderen.

Manier 2: WordPress

WordPress heeft twee plekken waar dit kan, en de tweede is bijna altijd de goede.

De hele site (aanbevolen). Ga in je beheerscherm naar Weergave → Thema-bestandsbewerker, of installeer een plugin als WPCode of Insert Headers and Footers — dat is veiliger, want je raakt je thema niet aan. Plak de regel in het veld voor de footer (soms “Body” of “Voor </body>” genoemd) en sla op. De reserveerknop staat nu op elke pagina.

Op één pagina. Wil je het formulier midden in je reserveringspagina? Zet in de blokkeneditor een Aangepaste HTML-blok op de plek waar het moet komen en plak daar de regel met het data-volzet-inline-element.

Let op bij pagebuilders. Elementor, Divi en WPBakery hebben elk hun eigen HTML-blok; gebruik dat, niet het tekstblok — een tekstblok haalt de scriptregel weg bij het opslaan.

Manier 3: laat een AI-agent het doen

Werk je met ChatGPT, Claude of een andere assistent die je website kan aanpassen, dan kun je de installatie ook overdragen. Volzet heeft daarvoor een eigen koppeling — een MCP-server op mcp.volzet.nl/mcp — waarmee een agent een account kan aanmelden, de snippet kan ophalen en je domein kan koppelen.

Geef je agent deze opdracht:

“Meld mijn restaurant aan bij Volzet via de MCP-server op https://mcp.volzet.nl/mcp, haal de embed-snippet op en zet die op mijn website. Laat me eerst de voorwaarden zien.”

Twee dingen om te weten. Je akkoord is niet aan de agent. De aanmelding weigert zonder expliciet akkoord op de voorwaarden en het privacybeleid — je agent moet ze je tonen en het je vragen. En je hoeft geen sleutel te regelen: de agent koppelt je domein met een token dat hij op je site plaatst, waarna wij de pagina ophalen en controleren.

De technische details staan in de integratiegids — daar staan ook de events en de JS-API, als je bevestigingen wilt doormeten.

Je domein koppelen

De widget laadt alleen op adressen die jij hebt geregistreerd. Dat is geen formaliteit: je sleutel staat zichtbaar in de broncode van je site, en zonder die controle zou iemand anders hem op zijn eigen pagina kunnen plakken en reserveringen in jouw agenda kunnen zetten.

Er zijn twee manieren. In het dashboard voeg je onder Beheer → Widget je domein toe. Meld je je aan via een agent, dan krijg je in plaats daarvan een verificatietoken: dat zet je één keer op je site — als attribuut op de scriptregel of als meta-tag in de <head> — en daarna halen wij je pagina op om te controleren of het er staat.

Is de koppeling gelukt, dan mag het token weer weg. Het hoeft er niet te blijven staan. Registreer trouwens beide adressen als je site zowel met als zonder www. bereikbaar is: voor een browser zijn dat er twee.

Geen website? Dan gebruik je je boekingspagina

Elk restaurant krijgt er een, vanaf de eerste dag: book.volzet.nl/jouw-restaurant. Daar staan je openingstijden, je contactgegevens en het reserveringsformulier, in je eigen kleur en met je eigen logo. Je hoeft niets te installeren en je hebt geen bouwer nodig.

Die link zet je in je Instagram-bio, in je handtekening en op je flyers. En zet hem op je Google-bedrijfsprofiel, want dat is waar de meeste mensen je naam intypen: dan reserveren gasten rechtstreeks vanuit Google Maps. Zo doe je dat

Werkt het niet?

De knop verschijnt niet

Kijk eerst of de regel echt op de pagina staat: open je site, klik met de rechtermuisknop, kies Paginabron weergeven en zoek op volzet. Staat hij er niet, dan heeft je bouwer of plugin hem bij het opslaan weggehaald; gebruik dan een HTML-blok in plaats van een tekstblok. Staat hij er wel, controleer dan of je sleutel klopt en met pk_ begint.

Het formulier laadt niet op mijn eigen domein

Dan is je domein nog niet gekoppeld. De widget laadt alleen op adressen die je zelf hebt geregistreerd, zodat niemand anders met jouw sleutel reserveringen kan aannemen. Voeg je domein toe onder Beheer → Widget in het dashboard, of koppel het met het verificatietoken zoals hierboven beschreven. Let op: www.jouwzaak.nl en jouwzaak.nl zijn voor een browser twee adressen.

De knop staat op de verkeerde plek

De zwevende knop staat standaard rechtsonder. In het dashboard zet je hem onder Beheer → Widget linksonder of midden onder. Wil je geen zwevende knop, gebruik dan het inline-formulier: zet een leeg element met data-volzet-inline op de plek waar het formulier moet staan. Staat dat element op de pagina, dan verschijnt de widget daarin en de zwevende knop niet.

Ik gebruik een pagebuilder

Elementor, Divi en WPBakery hebben elk hun eigen HTML-blok. Gebruik dat, niet het tekstblok, want een tekstblok haalt de scriptregel weg bij het opslaan. Voor de zwevende knop is een plugin die code in de footer zet meestal handiger: dan doe je het één keer in plaats van per pagina.

Ik wil de knop in mijn eigen kleur

Dat stel je in onder Beheer → Widget: je accentkleur, je logo, de plek en de vorm van de knop, en of het formulier licht of donker is. De scriptregel hoef je daarvoor niet aan te passen; de widget haalt de instellingen zelf op, dus een wijziging staat meteen op je site.

Nog geen sleutel?

Maak een account aan en je sleutel staat klaar onder Beheer → Widget. De eerste 30 dagen krijg je alles, zonder creditcard.

Kom je er niet uit? Mail info@volzet.nl met het adres van je site, dan kijken we mee.
Start met Volzet

Meer lezen