In dit artikel leggen we uit hoe je de Formitable widget op je WIX website kunt plaatsen. Het kost slechts een paar minuten en je kunt de widget ook nog eens naar eigen wens aanpassen.
Stel de widget in op de configuration page
In Formitable, ga naar de widget page in settings en op de widget configuration page.
Op deze pagina kun je de widget aanpassen en de widget code genereren die je later op je Wix website plaatst.
Wat kun je op de configuration page instellen?
Een kleur kiezen die matcht met de stijl van je website
Kiezen wanneer de widget zichtbaar wordt voor bezoekers
Kiezen of de toolbar met reserveringsknop zichtbaar moet zijn
De analytics module kun inschakelen om je widget te volgen. (Check onze analytics guide om hier meer over te lezen.)
Plaats het Formitable widget script op je website
Log in op Wix.
In het linkermenu selecteer Settings, scrol naar beneden tot Advanced en klik op Custom code.
Klik op Add Custom code rechtsbovenin je scherm. Door een script toe te voegen, kun je de widget installeren op alle pagina's.
Plak de code die je hebt gekopieerd van de configuration page in de code snippet blok bovenin.
Selecteer vervolgens bij Add Code to Pages > All pages > Load code on each new page.
En kies bij Place code in voor Body - end.
Klik nu op apply om je widget te implementeren!
Optioneel: Open de widget met een knop
Wil je nog een knop toevoegen op je website die de widget meteen opent?
Om de widget te laten openen na het klikken op een knop of link moet in Wix nog wat extra code toevoegen. Je kunt het volgende script toevoegen aan de bovenstaande custom code. Je kunt het gewoon boven of onder de code toevoegen die je net al toevoegde.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).on("click", 'a[href="http://www.voorbeeld.nl/?ft-shop=reservations"]', function(event) {
event.preventDefault();
FT.widgets.get().open();
});
$(document).on("click", 'a[href="http://www.voorbeeld.nl/?ft-shop=giftshop"]', function(event) {
event.preventDefault();
FT.widgets.get().openShop('vouchers');
});
</script>
<script>
$(document).on("click", 'a[href="http://www.voorbeeld.nl/?ft-shop=takeaway"]', function(event) {
event.preventDefault();
FT.widgets.get().openShop('takeaway');
});
</script>
Knop om de widget te openen - zet dit in de link:
http://www.voorbeeld.nl/?ft-shop=reservations
Knop om de takeaway shop te openen - zet dit in de link:
http://www.voorbeeld.nl/?ft-shop=takeaway
Knop om de voucher shop te openen - Zet dit in de link:
http://www.voorbeeld.nl/?ft-shop=giftshop
Zorg dat de link open in de current window, zodat gasten op dezelfde pagina blijven. Als je klaar bent, klik je op Done en vergeet niet om je instellingen te publishen.
What's next?
Wordt je widget niet meteen zichtbaar op de website? Check of je widget online staat.