Naar de hoofdinhoud

Hoe voeg ik de boeking widget toe aan mijn website?

Vind hier een stapsgewijze handleiding voor het toevoegen van de boeking widget knop aan je website, afhankelijk van welk platform je gebruikt.

Vandaag bijgewerkt

Je website is de digitale etalage van je bedrijf. Het is de plek waar de eerste indruk wordt gemaakt en waar je agenda zich begint te vullen. Om je te helpen je klanten een naadloze ervaring te bieden, biedt Salonized flexibele manieren om je boeking widget te integreren, of je nu de voorkeur geeft aan een pop-up knop of een open versie (inline).

Volg de onderstaande gidsen en ontdek hoe je deze toevoegt aan de meest voorkomende websiteplatforms.


Hoe kan ik de boeking widget pop-up knop toevoegen aan mijn website?

Het toevoegen van de boeking widget knop aan je website is snel en eenvoudig. Volg hiervoor deze stappen:

Stap 1: Pas de instellingen voor je boeking widget aan

  • Log in bij Salonized

  • Klik op het tandwiel-icoon (Instellingen) linksonder

  • Selecteer Online boekingen

  • Klik op 'Styling en delen' en pas de volgende instellingen aan indien nodig:

    • Kleur: Gebruik de standaardkleur of kies je eigen widget-kleur.

    • Agenda-weergave: Toon je beschikbaarheid per week of maand.

  • Je kunt ook een optie tonen waarmee klanten hun afspraken kunnen controleren of een aangepaste melding in je widget toevoegen.

Stap 2: Kopieer de code

  • Scroll naar de onderkant van de pagina.

  • Onder 'Delen', selecteer 'Code om de knop aan mijn website toe te voegen'.

  • Kies de positie van de knop (links of rechts uitgelijnd).

  • Klik op 'Kopieer' om het volledige script te kopiëren.

Stap 3: Voeg de code toe aan de footer van je website

  • Log in op het beheersysteem van je website.

  • Voeg de gekopieerde code toe aan de footer (voettekst) van je website.

  • Publiceer de wijzigingen. De widget is nu toegevoegd aan je website.

Let op: Als je de kleur of positie van de widget in Salonized aanpast, wordt er een nieuwe code gegenereerd. Om die wijzigingen op je site te zien, vervang je simpelweg het oude script door de bijgewerkte versie.


Hoe kan ik de boeking widget pop-up knop toevoegen aan mijn WordPress website?

  1. Kopieer de boeking widget code van Salonized zoals hierboven beschreven.

  2. Log in op je WordPress website.

  3. Klik op 'Plugins' in het linkermenu. (Als je deze optie niet ziet, heeft je account mogelijk geen beheerdersrechten—je websitebeheerder kan je hierbij helpen!)

  4. Klik op 'Nieuwe plugin toevoegen'.

  5. Typ 'WPCode' in de zoekbalk.

  6. Klik op 'Nu installeren' > 'Activeren'.

  7. Je ziet nu een nieuw menu-item aan de linkerkant genaamd 'Code Snippets'.

  8. Beweeg je muis hierover en selecteer 'Header & Footer'.

  9. Scroll omlaag naar de sectie Footer en plak je Salonized-code in het tekstveld.

  10. Klik bovenaan op 'Wijzigingen opslaan' en je bent klaar.


Hoe kan ik de boeking widget pop-up knop toevoegen aan mijn WIX website?

  1. Kopieer de boeking widget code van Salonized zoals hierboven beschreven.

  2. Log in op je WIX website.

  3. Ga naar Instellingen in het linkermenu.

  4. Scroll naar de sectie Geavanceerd.

  5. Selecteer Aangepaste code.

  6. Zoek de sectie Body - End en klik op 'Code toevoegen'.

  7. Plak de code van Salonized in het bovenste vak ('Plak het codefragment hier').

  8. Geef de tool een naam (bijv. 'Salonized boeking widget').

  9. Controleer of de standaardopties correct zijn ('Voeg code toe aan: Alle pagina's', 'Laad code één keer' en 'Plaats code in: Body - end').

  10. Klik op 'Toepassen' om je wijzigingen te publiceren.


Hoe kan ik de boeking widget pop-up knop toevoegen aan mijn Jimdo Creator website?

  1. Kopieer de boeking widget code van Salonized zoals hierboven beschreven.

  2. Log in op je Jimdo website.

  3. Kies de juiste site.

  4. Klik op 'Bewerken'.

  5. Scroll helemaal naar beneden naar het grijze gebied en beweeg je muis eroverheen.

  6. Klik op 'Inhoud toevoegen' > 'Meer elementen en add-ons'.

  7. Selecteer het HTML element.

  8. Plak de Salonized-code in het HTML-element.

  9. Klik op 'Opslaan'.


Hoe kan ik de boeking widget pop-up knop toevoegen aan mijn Weebly website?

  1. Kopieer de boeking widget code van Salonized zoals hierboven beschreven.

  2. Log in op je Weebly website.

  3. Klik op 'Website bewerken'.

  4. Ga in de bovenste balk naar 'Instellingen'.

  5. Klik op 'SEO' in het linkermenu.

  6. Ga naar 'Footer code' en plak daar je Salonized-code.

  7. Klik op 'Opslaan' > 'Publiceren'.


Hoe koppel ik een eigen knop aan de boeking widget via WordPress?

Je kunt de boeking widget activeren via elk menu-item of elke knop op je site door een unieke "anchor link" te gebruiken. Je hebt verschillende opties om dit in te stellen:

  • Optie A: Toevoegen aan je hoofdmenu

    1. Log in op je WordPress-account.

    2. Ga naar Weergave > Menu's.

    3. Selecteer Aangepaste links in de linkerkolom.

    4. In het URL-veld, typ: #sz-booking-toggle.

    5. In de Linktekst, typ de gewenste knopnaam (bijv. "Boek nu").

    6. Klik op 'Aan menu toevoegen' en vervolgens op 'Menu opslaan'.

  • Optie B: Toevoegen aan een knop op een pagina

    1. Open de paginabewerker met de bestaande knop.

    2. Selecteer je knop of markeer de tekst die je wilt linken.

    3. Klik op het hyperlink-icoon.

    4. In het URL-veld, voer in: #sz-booking-toggle.

    5. Klik op 'Bijwerken' of 'Opslaan' om je wijzigingen te bevestigen.


Hoe koppel ik een eigen knop aan de boeking widget via WIX?


Hoe voeg ik de Open (Inline) Boeking Widget toe aan mijn website?

De 'Open' of 'Inline' versie stelt je in staat om de volledige boekingservaring direct in de tekst van een webpagina te plaatsen. In tegenstelling tot een pop-up knop, blijft deze versie zichtbaar op de pagina (bijv. op je homepage of een speciale boekingspagina), waardoor klanten direct kunnen beginnen met plannen zonder extra klikken. Volg deze stappen om deze toe te voegen:

Stap 1: Pas de instellingen aan

  • Log in bij Salonized

  • Ga naar 'Instellingen' > 'Online boekingen' > 'Styling en delen':

  • Kies je kleur.

  • Kies de deeloptie 'Code om een open boeking widget op mijn website toe te voegen'.

  • Kies de grootte: je kunt 'Automatisch aanpassen' ingeschakeld laten of 'Aangepaste breedte' kiezen.

  • Pas de hoogte aan indien nodig.

Stap 2: Kopieer de code

  • Klik op 'Kopieer' onderaan de pagina.

Let op: Deze instellingen zijn van invloed op het script. Stel je voorkeuren in voordat je de code kopieert. Als je de instellingen wijzigt, moet je de code op je site vervangen.

Stap 3: Voeg de code toe aan je website

  • Open boeking widget toevoegen aan Weebly:

    1. Log in bij Weebly en klik op 'Website bewerken'.

    2. Ga naar 'Pagina's' en selecteer de gewenste pagina.

    3. Klik op </> (Embed Code) en sleep dit naar de gewenste positie.

    4. Klik op 'Aangepaste HTML bewerken' en plak je code.

    5. Klik op 'Publiceren' om je wijzigingen op te slaan.

  • Open boeking widget toevoegen aan Mijndomein:

    1. Log in bij Mijndomein.

    2. Ga naar 'Producten'.

    3. Selecteer 'Beheren' naast Websitemaker.

    4. Klik op 'Login Websitemaker'.

    5. Ga naar de pagina waar je de widget wilt toevoegen.

    6. Klik in het menu 'Widgets' op 'HTML' en sleep dit naar de pagina.

    7. Klik op 'Voeg hier je eigen HTML toe', verwijder de tijdelijke tekst, plak je code en klik op 'Bijwerken'.

    8. Klik rechtsboven op 'Opnieuw publiceren'.

En je bent klaar! Je hebt succesvol je open boeking widget aan je website toegevoegd.

Mocht je nog vragen hebben of hulp nodig hebben, neem dan contact met ons op via de chat of op (+31) 020 893 2386.

Voor meer informatie over de online boeking widget, bekijk je dit artikel.

Was dit een antwoord op uw vraag?