Shopify/nl: Difference between revisions

From SimplyBook.me
FuzzyBot (talk | contribs)
Updating to match new version of source page
Tags: Mobile edit Mobile web edit
No edit summary
Tags: Mobile edit Mobile web edit
Line 7: Line 7:
;Hoe instellen
;Hoe instellen


<div class="mw-translate-fuzzy">
:1. Ga naar <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Online Store</span> -&gt; <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Themes</span> -&gt; <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Customize</span> in uw <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Shopify-account.</span>
:1. Ga naar <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Online Store</span> -&gt; <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Themes</span> -&gt; <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Customize</span> in uw <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Shopify-account.</span>
[[File:Shopify customize theme.png|border|center]]
[[File:Shopify customize theme.png|border|center]]
Line 17: Line 16:
[[File:Shopify select custom content.png|border|center]]
[[File:Shopify select custom content.png|border|center]]
<br><br>
<br><br>
:4. Klik op <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">'Add content'</span> (In <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">houd</span> toevoegen) en selecteer <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">'Custom HTML'</span> (Aangepaste <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">HTML</span>[[File:Select html.png|border|center]]
[[File:Select html.png|border|center]]
<br><br>
:5. Ga naar uw <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">SimplyBook.me-account</span> -&gt; <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Settings (Instellingen</span> ) -&gt; <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Booking widgets settings</span> (Instellingen voor boekingswidgets) -&gt; <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">iFrame widget</span>[[File:Booking widget path redesigned.png|1200px|border|center|link=https://help.simplybook.me/images/6/68/Booking_widget_path_redesigned.png]]iFrame-widget[[File:Booking widget path redesigned.png|1200px|border|center|link=https://help.simplybook.me/images/6/68/Booking_widget_path_redesigned.png]]
[[File:Booking widget path redesigned.png|1200px|border|center|link=https://help.simplybook.me/images/6/68/Booking_widget_path_redesigned.png]]
<br><br>
:6. Pas het ontwerp aan uw smaak en behoeften aan en <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">kopieer de widgetcode.</span>
[[File:Copy widget code redesigned.png|1200px|border|center|link=https://help.simplybook.me/images/b/b4/Copy_widget_code_redesigned.png]]
<br><br>
:7. Kopieer de volledige code uit het pop-upvenster en plak deze in <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">het HTML-veld</span> aan de Shopify-kant. Pas indien nodig de breedte van de container aan. <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Sla</span> de wijzigingen <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">op</span>
[[File:Insert html to shopify side.png|border|center]]
<br><br>
:8. Het resultaat is dat u meteen kunt zien hoe de boekingswidget eruitziet.
[[File:Shopify widget result.png|border|center]]
<br><br><br><br>
</div>
<div lang="en" dir="ltr" class="mw-content-ltr">
<div lang="en" dir="ltr" class="mw-content-ltr">
:4. Click on <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Add content</span> and select <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Custom HTML</span>
:4. Click on <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Add content</span> and select <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Custom HTML</span>

Revision as of 08:08, 1 July 2025

Als u Shopify gebruikt en de mogelijkheid om te boeken aan uw website wilt toevoegen, hebben wij de juiste oplossing voor u!


Met onze iFrame-widget kunt u de Shopify-website koppelen aan SimplyBook.com, zodat uw klanten rechtstreeks vanaf de website kunnen boeken, zowel vanaf hun pc als vanaf hun mobiele apparaten. Deze oplossing maakt uw boekingsproces gemakkelijker en overzichtelijker.

Hoe instellen
1. Ga naar Online Store -> Themes -> Customize in uw Shopify-account.



2. Selecteer de sectie die u wilt bewerken aan de linkerkant of voeg een nieuwe toe.



3. Kies voor Custom content toevoegen .



4. Click on Add content and select Custom HTML



5. Navigate to your SimplyBook.me account -> Settings -> Booking widgets settings -> iFrame widget



6. Adjust the design to your taste and needs, get widget code.



7. Copy the whole code from the popup and insert it to HTML field on Shopify side. Adjust container width if necessary. Save the changes



8. As the result you will see how the booking widget looks like right away.