Widgets for your own website/nl: Difference between revisions

No edit summary
Tags: Mobile edit Mobile web edit
No edit summary
 
(4 intermediate revisions by the same user not shown)
Line 61: Line 61:
[[File:Predefined client result view.png|center]]
[[File:Predefined client result view.png|center]]
<br><br>
<br><br>
<div class="mw-translate-fuzzy">
== Widgets voor [[Special:MyLanguage/Client_Login_custom_feature|klantlogin]], [[Special:MyLanguage/Packages_custom_feature|pakketten]], [[Special:MyLanguage/Membership_custom_feature|lidmaatschappen]], [[Special:MyLanguage/Coupons_and_Gift_Cards_custom_feature|cadeaubonnen]] ==
== Widgets voor [[Client_Login_custom_feature|klantlogin]], [[Packages_custom_feature|pakketten]], [[Membership_custom_feature|lidmaatschappen]], [[Coupons_and_Gift_Cards_custom_feature|cadeaubonnen]] ==
<br><br>
<br><br>
<span style="background-color:#ffe9e9; padding:5px; border-radius:5px;">'''Let op!''' Dit werkt momenteel alleen met iFrame-widgets en niet met widgets voor boekingsknoppen en contactknoppen.</span><br>
<span style="background-color:#ffe9e9; padding:5px; border-radius:5px;">'''Let op!''' Dit werkt momenteel alleen met iFrame-widgets en niet met widgets voor boekingsknoppen en contactknoppen.</span><br>
Line 68: Line 67:
Als u een of meer van deze functies gebruikt, kan het nodig zijn om een widget toe te voegen waarmee uw klanten de optie op uw website kunnen gebruiken.<br>
Als u een of meer van deze functies gebruikt, kan het nodig zijn om een widget toe te voegen waarmee uw klanten de optie op uw website kunnen gebruiken.<br>
Dit kan eenvoudig worden gedaan door het overeenkomstige <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">"navigate"</span> -element toe te voegen aan de widgetcode:
Dit kan eenvoudig worden gedaan door het overeenkomstige <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">"navigate"</span> -element toe te voegen aan de widgetcode:
*<span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Client_Login_custom_feature|Klantlogin]]</span> - <span style="background-color:#fef3de; padding:5px; border-radius:5px;">"navigate":"client/sign-in"</span>
*<span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Special:MyLanguage/Client_Login_custom_feature|Klantlogin]]</span> - <span style="background-color:#fef3de; padding:5px; border-radius:5px;">"navigate":"client/sign-in"</span>
*<span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Packages_custom_feature|Pakketten]]</span> - <span style="background-color:#fef3de; padding:5px; border-radius:5px;">"navigate":"packages"</span>
*<span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Special:MyLanguage/Packages_custom_feature|Pakketten]]</span> - <span style="background-color:#fef3de; padding:5px; border-radius:5px;">"navigate":"packages"</span>
*<span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Membership_custom_feature|Lidmaatschappen]]</span> - <span style="background-color:#fef3de; padding:5px; border-radius:5px;">"navigate":"membership"</span>
*<span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Special:MyLanguage/Membership_custom_feature|Lidmaatschappen]]</span> - <span style="background-color:#fef3de; padding:5px; border-radius:5px;">"navigate":"membership"</span>
*<span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Coupons_and_Gift_Cards_custom_feature|Cadeaubonnen]]</span> - <span style="background-color:#fef3de; padding:5px; border-radius:5px;">"navigate":"gift-card"</span>
*<span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Special:MyLanguage/Coupons_and_Gift_Cards_custom_feature|Cadeaubonnen]]</span> - <span style="background-color:#fef3de; padding:5px; border-radius:5px;">"navigate":"gift-card"</span>
<br><br>
<br><br>
</div>
Voorbeeldcode voor de widget <span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Special:MyLanguage/Coupons_and_Gift_Cards_custom_feature|Gift Cards]]</span>:<br><br>
<div class="mw-translate-fuzzy">
Voorbeeldcode voor de widget <span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Coupons_and_Gift_Cards_custom_feature|Gift Cards]]</span>:<br><br>
</div>
<code><script src="//simplybook.it/v2/widget/widget.js"></script>
<code><script src="//simplybook.it/v2/widget/widget.js"></script>
<script>var widget = new SimplybookWidget({"widget_type":"iframe","url":"https:\/\/demo.simplybook.it",'''"navigate":"gift-card",'''"theme":"default","theme_settings":{"timeline_show_end_time":"0","timeline_modern_display":"as_slots","sb_base_color":"#0cadef","display_item_mode":"block","booking_nav_bg_color":"#80d0f2","body_bg_color":"#f7f7f7","dark_font_color":"#494949","light_font_color":"#ffffff","btn_color_1":"#5e7da7","sb_company_label_color":"#ffffff","hide_img_mode":"0","show_sidebar":"1","sb_busy":"#dad2ce","sb_available":"#0cadef"},"timeline":"modern","datepicker":"inline_datepicker","is_rtl":false,"app_config":{"predefined":[]}});</script></code>
<script>var widget = new SimplybookWidget({"widget_type":"iframe","url":"https:\/\/demo.simplybook.it",'''"navigate":"gift-card",'''"theme":"default","theme_settings":{"timeline_show_end_time":"0","timeline_modern_display":"as_slots","sb_base_color":"#0cadef","display_item_mode":"block","booking_nav_bg_color":"#80d0f2","body_bg_color":"#f7f7f7","dark_font_color":"#494949","light_font_color":"#ffffff","btn_color_1":"#5e7da7","sb_company_label_color":"#ffffff","hide_img_mode":"0","show_sidebar":"1","sb_busy":"#dad2ce","sb_available":"#0cadef"},"timeline":"modern","datepicker":"inline_datepicker","is_rtl":false,"app_config":{"predefined":[]}});</script></code>
Line 91: Line 87:
[[File:Get booking button widget code redesigned.png|1200px | center|link=https://help.simplybook.me/images/5/54/Get_booking_button_widget_code_redesigned.png]]
[[File:Get booking button widget code redesigned.png|1200px | center|link=https://help.simplybook.me/images/5/54/Get_booking_button_widget_code_redesigned.png]]
<br><br>
<br><br>
<div class="mw-translate-fuzzy">
:2. Voeg deze toe aan de HTML-code <body> van uw website (of een andere plaats op uw websiteplatform die is ontworpen voor het invoegen van HTML JavaScript iFrame-code).<br>  
:2. Voeg deze toe aan de HTML-code <body> van uw website (of een andere plaats op uw websiteplatform die is ontworpen voor het invoegen van HTML JavaScript iFrame-code).<br>  
<span style="background-color:#ffe9e9; padding:5px; border-radius:5px;">'''Let op!''' Verschillende websitebouwers/platforms kunnen verschillende manieren hebben om HTML-code toe te voegen. Controleer eerst of uw website het invoegen van HTML JavaScript-code ondersteunt.</span>
<span style="background-color:#ffe9e9; padding:5px; border-radius:5px;">'''Let op!''' Verschillende websitebouwers/platforms kunnen verschillende manieren hebben om HTML-code toe te voegen. Controleer eerst of uw website het invoegen van HTML JavaScript-code ondersteunt.</span>
:'''Hier vindt u tutorials voor verschillende populaire websitebouwers:'''
:'''Hier vindt u tutorials voor verschillende populaire websitebouwers:'''
:::[https://help.simplybook.me/index.php/WordPress_integration *Wordpress]
:::*[[Special:MyLanguage/WordPress_integration |Wordpress]]
:::[https://help.simplybook.me/index.php/Shopify *Shopify]
:::*[[Special:MyLanguage/Shopify |Shopify]]
:::[https://help.simplybook.me/index.php/Joomla_integration *Joomla]
:::*[[Special:MyLanguage/Joomla_integration |Joomla]]
:::[https://help.simplybook.me/index.php/Wix_integration *Wix]
:::*[[Special:MyLanguage/Squarespace |Squarespace]]
:::[https://help.simplybook.me/index.php/Squarespace *Squarespace]
:::*[[Special:MyLanguage/Weebly |Weebly]]
:::[https://help.simplybook.me/index.php/Weebly *Weebly]
:::*[[Special:MyLanguage/Go_Daddy |Go Daddy]]
:::[https://help.simplybook.me/index.php/Go_Daddy *Go Daddy]
:::*[[Special:MyLanguage/SITE123_integration |SITE123]]
:::[https://help.simplybook.me/index.php/SITE123_integration *SITE123]
</div>


;[https://simplydemowidgets.mozello.com/ Bekijk hoe widgets er op uw website kunnen uitzien]
;[https://simplydemowidgets.mozello.com/ Bekijk hoe widgets er op uw website kunnen uitzien]




<div class="mw-translate-fuzzy">
;Widgets met vooraf gedefinieerde dienst, aanbieder, categorie of locatie.
;Widgets met vooraf gedefinieerde dienst, aanbieder, categorie of locatie.
Met deze functie kunt u iframe-code genereren die specifiek is voor de dienst, aanbieder, [[Custom_Features#Service_Categories |categorie]] of [[Custom_Features#Multiple_Locations |locatie]] die u hebt. Als u bijvoorbeeld 2 diensten A en B hebt en u kiest dienst A als vooraf gedefinieerd, wordt de widget geopend op die dienst, waarbij de stap voor het kiezen van de dienst wordt overgeslagen. Deze functie kan handig zijn als u alleen bepaalde diensten op een specifieke pagina van uw website wilt weergeven. De stappen voor het genereren van de code zijn dezelfde als hierboven, alleen kiest u in de instellingen van de widget het item dat u vooraf wilt definiëren.
Met deze functie kunt u iframe-code genereren die specifiek is voor de dienst, aanbieder, [[Special:MyLanguage/Service_Categories_custom_feature |categorie]] of [[Special:MyLanguage/Multiple_Locations_custom_feature |locatie]] die u hebt. Als u bijvoorbeeld 2 diensten A en B hebt en u kiest dienst A als vooraf gedefinieerd, wordt de widget geopend op die dienst, waarbij de stap voor het kiezen van de dienst wordt overgeslagen. Deze functie kan handig zijn als u alleen bepaalde diensten op een specifieke pagina van uw website wilt weergeven. De stappen voor het genereren van de code zijn dezelfde als hierboven, alleen kiest u in de instellingen van de widget het item dat u vooraf wilt definiëren.
<br><br>
<br><br>
</div>


<div class="mw-translate-fuzzy">
= Widget voor boekingen en contact =
= Widget voor boekingen en contact =
<br><br>
<br><br>
:1. Schakel <span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Custom_Features#Contact_Widget |de contactwidget]]</span> in via <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Aangepaste functies</span> -&gt; <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Voor ontwikkeling</span>.
:1. Schakel <span style="background-color:#cdeffc; padding:5px; border-radius:5px;">[[Special:MyLanguage/Contact_Widget_custom_feature |de contactwidget]]</span> in via <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Aangepaste functies</span> -&gt; <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Voor ontwikkeling</span>.
[[File:Contact widget enable path redesigned.png|1200px| center|link=https://help.simplybook.me/images/8/8c/Contact_widget_enable_path_redesigned.png]]
[[File:Contact widget enable path redesigned.png|1200px| center|link=https://help.simplybook.me/images/8/8c/Contact_widget_enable_path_redesigned.png]]
<br><br>
<br><br>
Line 123: Line 113:
[[File:Contact widget settings path redesigned.png|1200px|border| center|link=https://help.simplybook.me/images/0/09/Contact_widget_settings_path_redesigned.png]]
[[File:Contact widget settings path redesigned.png|1200px|border| center|link=https://help.simplybook.me/images/0/09/Contact_widget_settings_path_redesigned.png]]
<br><br>
<br><br>
</div>
<div class="mw-translate-fuzzy">
[[File:Contact widget design path redesigned.png|1200px|border|center|link=https://help.simplybook.me/images/7/74/Contact_widget_design_path_redesigned.png]]
[[File:Contact widget design path redesigned.png|1200px|border|center|link=https://help.simplybook.me/images/7/74/Contact_widget_design_path_redesigned.png]]
<br><br>
<br><br>
Line 132: Line 120:
<span style="background-color:#ffe9e9; padding:5px; border-radius:5px;">'''Let op!''' Verschillende websitebouwers/platforms kunnen verschillende manieren hebben om HTML-code toe te voegen. Controleer eerst of uw website het invoegen van HTML JavaScript-code ondersteunt.</span>
<span style="background-color:#ffe9e9; padding:5px; border-radius:5px;">'''Let op!''' Verschillende websitebouwers/platforms kunnen verschillende manieren hebben om HTML-code toe te voegen. Controleer eerst of uw website het invoegen van HTML JavaScript-code ondersteunt.</span>
:'''Hier zijn tutorials voor verschillende populaire websitebouwers:'''
:'''Hier zijn tutorials voor verschillende populaire websitebouwers:'''
:::[https://help.simplybook.me/index.php/WordPress_integration *Wordpress]
:::*[[Special:MyLanguage/WordPress_integration |Wordpress]]
:::[https://help.simplybook.me/index.php/Shopify *Shopify]
:::*[[Special:MyLanguage/Shopify |Shopify]]
:::[https://help.simplybook.me/index.php/Joomla_integration *Joomla]
:::*[[Special:MyLanguage/Joomla_integration |Joomla]]
:::[https://help.simplybook.me/index.php/Wix_integration *Wix]
:::*[[Special:MyLanguage/Squarespace |Squarespace]]
:::[https://help.simplybook.me/index.php/Squarespace *Squarespace]
:::*[[Special:MyLanguage/Weebly |Weebly]]
:::[https://help.simplybook.me/index.php/Weebly *Weebly]
:::*[[Special:MyLanguage/Go_Daddy |Go Daddy]]
:::[https://help.simplybook.me/index.php/Go_Daddy *Go Daddy]
:::*[[Special:MyLanguage/SITE123_integration |SITE123]]
:::[https://help.simplybook.me/index.php/SITE123_integration *SITE123]
</div>


;[https://simplydemowidgets.mozello.com/ Bekijk hoe widgets er op uw website kunnen uitzien]
;[https://simplydemowidgets.mozello.com/ Bekijk hoe widgets er op uw website kunnen uitzien]