Widgets for your own website: Difference between revisions

No edit summary
No edit summary
Line 38: Line 38:


[[File:Predefined settings new.png | center]]
[[File:Predefined settings new.png | center]]
<br><br>
==Widgets with predefined client details==
<br>
Now you can also create a widget for some particular client with his/her details already filled in.
Just select the widget type you need in Settings//Bookings on Webpage or Facebook, set the design and click on "Get Widget Code".
[[File:Getwidgetcode.png | center]]
<br><br>
You will see a pop-up window with the code, click on the bottom part to get client code details.
Please copy the main code, add bottom part to it(to predefined section) and replace "Predefined client name", "Predefined client email", "Predefined client phone" with real client details.
[[File:Create predefined client widget code.png | center]]
<br><br>
So as the result you will get the code like this:<br>
<code><script src="//simplybook.me/v2/widget/widget.js"></script>
<script>var widget = new SimplybookWidget({"widget_type":"iframe","url":"https:\/\/companyname.simplybook.me","theme":"belle","theme_settings":{"sb_base_color":"#FF6969","body_bg_color":"#ffffff","dark_font_color":"#494949","light_font_color":"#ffffff","sb_busy":"#dad2ce","sb_available":"#d3e0f1"},"timeline":"flexible","datepicker":"top_calendar","is_rtl":false,"app_config":{"predefined": {"client": {<br>
"name": "Mary",<br>
"email": "mary@gmail.com",<br>
"phone": "+1234567890"<br>
}}
}});</script></code>
<br><br>
As a result the details of this client will be filled in in the widget and there will be no need to provide them.
[[File:Predefined client widget view.png | center]]
<br><br>
<br><br>
=Booking Button Widget=
=Booking Button Widget=