|
|
| Line 1: |
Line 1: |
| | {{#seo: | | {{#seo: |
| − | |title=Frequently Asked Questions about Integration Of Popular Appointment Booking System SimplyBook.me to Customer's Website | + | |title=Integration - SimplyBook.me |
| | |titlemode=append | | |titlemode=append |
| − | |keywords=faq, frequently asked questions, online scheduling, free scheduling software, online booking system, online calendar, employee scheduling software, schedule, scheduling software, scheduling app, booking calendar, calendar software | + | |keywords=faq, frequently asked questions, online scheduling, free scheduling software, online booking system, online calendar, employee scheduling software, schedule, scheduling software, scheduling app, booking calendar, calendar software |
| | }} | | }} |
| | | | |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| |
| − | <span class="qa">[[Widgets for your own website]]</span>
| |
| − | <div class="mw-collapsible-content">
| |
| − | [[Widgets_for_your_own_website#iFrame_Widget | iFrame widget]]
| |
| | | | |
| − | [[Widgets_for_your_own_website#Booking_Button_Widget | Booking Button Widget]]
| + | *<div class=" article">[ [Widgets for your own website]]</ div> |
| − | | + | *<div class=" article">[http://simplydemowidgets.mozello.com/ Widget examples]</div> |
| − | [[Widgets_for_your_own_website#Booking_and_Contact_Button_Widget | Booking and Contact widget]]
| + | *<div class=" article">[[Bookings on Facebook |Bookings on Facebook and Instagram]]</div> |
| − | </div>
| + | *<div class=" article">[[WordPress plugin | WordPress integration]]</div> |
| − | <br/>
| + | *<div class="article">[[Bookings on Facebook | Facebook CTA button, widget and booking bot integrations]]</div> |
| − | </div>
| + | *<div class=" article">[[ Other Integrations]]</div> |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| + | *<div class=" article">[[ Own domain | Custom Domain]]</div> |
| − | <span class="qa">[http://simplydemowidgets.mozello.com/ Widget examples]</span>
| |
| − | <div class="mw-collapsible-content"> | |
| − | Please check widget examples [http://simplydemowidgets.mozello.com/ here]
| |
| − | </div> | |
| − | <br/>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| |
| − | <span class="qa">[[Bookings on Facebook]]</span>
| |
| − | <div class="mw-collapsible-content"> | |
| − | [[Bookings on Facebook|Bookings on Facebook tutorial]] | |
| − | <br>
| |
| − | </div> | |
| − | <br/>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;"> | |
| − | <span class="qa">[[WordPress plugin |WordPress integration]]</span>
| |
| − | <div class="mw-collapsible-content">
| |
| − | __FORCETOC__
| |
| − | =With the help of our [https://wordpress.org/plugins/simplybookme-online-appointment-scheduling-widget-and-booking-system/ '''Wordpress plugin''']=
| |
| − | | |
| − | '''''Please note!''' Wordpress SimplyBook.me plugin may not work with some custom themes of WordPress and some specific plugins. If you installed the plugin and all the data is correct but the page does not show up, please try inserting widget (option #2)''
| |
| − | <br><br>
| |
| − | ;Installation
| |
| − | :1. Search for [https://wordpress.org/plugins/simplybookme-online-appointment-scheduling-widget-and-booking-system/ Simplybook WordPress plugin] in the list of plugins of WP catalogue and add it to your website (it is called Online Appointment Scheduling Widget and Booking System).
| |
| − | | |
| − | [[File:Install plugin.png | center]]
| |
| − | <br><br>
| |
| − | | |
| − | :2. If you don't have an account with us yet, please register on SimplyBook.me (you can register [https://simplybook.me/company/ here]), or visit our website and press big button [https://simplybook.me/company/ “Get Free Account”]. If you already have account, please log into it.
| |
| − | | |
| − | | |
| − | [[File:Create account new.png | center]]
| |
| − | <br><br>
| |
| − | | |
| − | :3. Go to WordPress plugin settings and insert your company login to the corresponding box there. (the one in url of your admin page, e.g in the link https://image.secure.simplybook.me/, image is company name)
| |
| − | | |
| − | | |
| − | | |
| − | | |
| − | [[File:Wp plugin settings 4.0.png | center]]
| |
| − | <br><br>
| |
| − | :4. Select the theme, calendar layout and colors for the client view.
| |
| − | <br><br>
| |
| − | :5. In your WordPress admin site navigate to "Pages" and create a new page specifically for bookings (you can also add it to the already existing page if you wish, the process is the same). Then, paste '[simplybook]' tag in that page.
| |
| − | | |
| − | | |
| − | [[File:Shortcode in wp admin.png | center]]
| |
| − | <br><br>
| |
| − | ;Error while setting up the widget.
| |
| − | If you got the error "''Seems the method cannot be found on your server. Possible reasons may include: PHP option 'allow_url_fopen' is not enabled, PHP CURL is not enabled. Please ask your hoster for support regarding absence of required methods.''"
| |
| − | * Please check if your PHP has the necessary methods (allow_url_fopen and PHP CURL) on.
| |
| − | * To check this, you can install [https://wordpress.org/plugins/php-settings/ PHP Settings plugin]. | |
| − | * After you have checked and the necessary methods are Off, please contact your hosting provider and request activating them.
| |
| − | * If those methods are On, there may be another reason that prevents [https://simplybook.me/ SimplyBook.me] plugin from displaying on your page, please contact our support and we will try to help you.
| |
| − | | |
| − | | |
| − | if you receive the message that ''Fatal error occurred when installing the plugin'' most likely you will need to update your PHP version, the preferable version is 5.3 and higher.
| |
| − | <br><br>
| |
| − | =As a '''Widget'''=
| |
| − | | |
| − | :1. Please copy the code from <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Settings</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Booking widgets settings</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">iFrame widget</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Get widget code.</span>
| |
| − | | |
| − | [[File:Booking widgets path new navigation.png|1200px | center]]
| |
| − | <br><br>
| |
| − | | |
| − | [[File:Iframe widget creation new navigation.png|1200px| center]]
| |
| − | <br><br>
| |
| − | | |
| − | [[File:Widget code copy.png | center]]
| |
| − | <br><br>
| |
| − | :2. Go to your <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">WordPress</span> admin side and create a new page or navigate to already created one, where you plan to add the widget. Click on <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">+</span> icon.
| |
| − | [[File:Creating new page wp.png | center]]
| |
| − | <br><br>
| |
| − | :3. Search for <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">HTML</span> option.
| |
| − | [[File:Add html editor.png | center]]
| |
| − | <br><br>
| |
| − | :4. Paste the previously copied code.
| |
| − | [[File:Paste the code.png | center]]
| |
| − | <br><br>
| |
| − | :5. Publish your changes
| |
| − | <br><br>
| |
| − | | |
| − | ''Example'''' (may look different depending on your WP theme and [https://simplybook.me/ SimplyBook.me] theme and settings)''
| |
| − | | |
| − | [[File:Wordpress widget look.png|1000px|border| center]]
| |
| − | <br><br>
| |
| − | | |
| − | =How to translate old version of WordPress plugin to your language=
| |
| − | <br><br>
| |
| − | :1) download plugin zip file from https://wordpress.org/plugins/simplybookme-online-appointment-scheduling-widget-and-booking-system/
| |
| − | :2) uncompress this file
| |
| − | :3) go to "/langs" folder
| |
| − | :4) copy simplybook_me-en_US.po file with name "simplybook_me-sl_SL.po"
| |
| − | :5) download PoEdit (program) https://poedit.net/ (Free)
| |
| − | :6) open simplybook_me-sl_SL.po with PoEdit
| |
| − | :7) save and update zip file with your translation file (''Please note!'' Zip file structure should not be changed)
| |
| − | :8) go to your WordPress dashboard, Plugins page and click on "Add new" at the top, then choose "Upload Plugin" and upload your zip file there.<br><br>
| |
| − | If it does not work you need to apply translations via FTP - if you do not know how to do it please contact your web developer.
| |
| − | <br><br>
| |
| − | | |
| − | | |
| − | </div>
| |
| − | <br/>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| |
| − | <span class="qa">[[Shopify| Shopify]]</span>
| |
| − | <div class="mw-collapsible-content">
| |
| − | If you use Shopify, and if you want to add the possibility of bookings to your website we have the right solution for you!
| |
| − | | |
| − | | |
| − | Our iFrame widget allows you to connect the Shopify website with SimplyBook.com and let your clients book right from the website both from their PC or from their mobile devices. This solution will make your booking process more convenient and easy.
| |
| − | | |
| − | | |
| − | ;How to set
| |
| − | | |
| − | :1. Please navigate to <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Online Store</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Themes</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Customize</span> in your <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Shopify account.</span>
| |
| − | [[File:Shopify customize theme.png|border|center]]
| |
| − | <br><br>
| |
| − | :2. Select the section you would like to edit on the left or add a new one.
| |
| − | [[File:Shopify add section.png|border|center]]
| |
| − | <br><br>
| |
| − | :3. Choose to add <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Custom content.</span>
| |
| − | [[File:Shopify select custom content.png|border|center]]
| |
| − | <br><br>
| |
| − | :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>
| |
| − | [[File:Select html.png|border|center]]
| |
| − | <br><br>
| |
| − | :5. Navigate to your <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">SimplyBook.me account</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Settings</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Booking widgets settings</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">iFrame widget.</span>
| |
| − | [[File:Booking widgets path new navigation.png|1200px|border|center]]
| |
| − | <br><br>
| |
| − | :6. Adjust the design to your taste and needs, <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">get widget code.</span>
| |
| − | [[File:Get iframe code.png|border|center]]
| |
| − | <br><br>
| |
| − | :7. Copy the whole code from the popup and insert it to <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">HTML</span> field on Shopify side. Adjust container width if necessary. <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Save</span> the changes
| |
| − | [[File:Insert html to shopify side.png|border|center]]
| |
| − | <br><br>
| |
| − | :8. As the result you will see how the booking widget looks like right away.
| |
| − | [[File:Shopify widget result.png|border|center]]
| |
| − | <br><br><br><br>
| |
| − | </div>
| |
| − | </div>
| |
| − | <br>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| |
| − | <span class="qa">[[Custom_Features#Zapier_Connector| Zapier]]</span>
| |
| − | <div class="mw-collapsible-content">
| |
| − | [[Custom_Features#Zapier_Connector | Zapier integration]]
| |
| − | | |
| − | [[Using_Zapier.com| How to send copy of confirmation email (gmail integration).]]
| |
| − | | |
| − | [[Email_notifications_with_Zapier | How to send email confirmations to several emails]]
| |
| − | | |
| − | [[Integration_with_Mailchimp|Simplybook and MailChimp integration]]
| |
| − | | |
| − | </div>
| |
| − | </div>
| |
| − | <br/>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| |
| − | <span class="qa">[[Joomla integration]]</span>
| |
| − | <div class="mw-collapsible-content">
| |
| − | :1. Take the iFrame code of your booking page in Settings//Booking widgets settings//iFrame widget//Get widget code.
| |
| − | | |
| − | [[File:Booking widgets path new navigation.png|1200px | center]]
| |
| − | <br><br>
| |
| − | [[File:Iframe widget creation new navigation.png|1200px | center]]
| |
| − | <br><br>
| |
| − | [[File:Widget code copy.png | center]]
| |
| − | <br><br>
| |
| − | :2. Now go to Content>Articles check the box of the entry you want to insert the booking functionality into and click 'edit'. Then insert the widget code to the HTML code <body> of your website on the page where you need to display the booking functionality.
| |
| − | [[File:Joomla widget code adding.png | center]]
| |
| − | <br><br>
| |
| − | :3. Save settings and publish the page.
| |
| − | <br><br>
| |
| − | </div>
| |
| − | </div>
| |
| − | <br/>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| |
| − | <span class="qa">[[HTML button]]</span>
| |
| − | <div class="mw-collapsible-content">
| |
| − | [[File:Book-now-button-4.jpg|200px|left]]
| |
| − | | |
| − | Sometimes, websites (WordPress.com in particular) do not support inserting HTML Javascript code we use for our iFrame and button widgets. Then it can be useful to use a simple HTML button code to get your clients attention to go to your booking site at [https://simplybook.me/ SimplyBook.me] and make the appointment. Here is a simple code you can insert on your site or into your emails to link to your booking site at [https://simplybook.me/ SimplyBook.me]
| |
| − | | |
| − | <a href="//image.simplybook.me/v2" target="_blank"><img src="https://appointmentbookingsystem.files.wordpress.com/2015/11/book-now-button-4.jpg?w=660" alt="Booking button" width="200" height="200"></a>
| |
| − | <br><br>
| |
| − | Now let’s look at the code closer and see its components and how it can be adjusted to your company.
| |
| − | <br>
| |
| − | | |
| − | | |
| − | '''What you can change:'''
| |
| − | :1. ''image.simplybook.me/v2'' – it is the link to your booking page. It can be found when you press “My booking channels” -> "My booking website" in the upper right corner of your admin [https://simplybook.me/ SimplyBook.me] page. You need to insert your company name instead of “image”.
| |
| − | :2. ''https://appointmentbookingsystem.files.wordpress.com/2015/11/book-now-button-4.jpg?w=660'' – this is the link to the image of “Book now” button. You can choose the image that suits your website design.
| |
| − | :3. ''alt=”Booking button”'' – this is the alternate text for an image, if the image cannot be displayed. You can change the text “Booking button” to “Book now”, “Book here”, etc.
| |
| − | :4. ''width=”200″ height=”200″'' You can insert custom size of the image with the help of these functions.
| |
| − | :5. Please note that all the other signs, symbols and spaces are very important for the proper functioning of the code.
| |
| − | <br><br>
| |
| − | ''Please check the example [http://simplydemowidgets.mozello.com/ here].''
| |
| − | <br><br>
| |
| − | </div>
| |
| − | </div>
| |
| − | <br/>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| |
| − | <span class="qa">[[Wix integration]]</span>
| |
| − | <div class="mw-collapsible-content"> | |
| − | | |
| − | | |
| − | | |
| − | | |
| − | If you use Wix, and if you want to add the possibility of bookings to your website we have the right solution for you!
| |
| − | | |
| − | | |
| − | Our iFrame widget allows you to connect the Wix website with [https://simplybook.me SimplyBook.com] and let your clients book right from the website both from their PC or from their mobile devices. This solution will make your booking process more convenient and easy.
| |
| − | | |
| − | | |
| − | To do this, please follow these simple steps:
| |
| − | | |
| − | :1. Go to website editing mode, select the page to edit or add a new one and click on "+" on the left to add new element.
| |
| − | [[File:Wix add element.png|border | center]]
| |
| − | <br><br>
| |
| − | :2. Look for "Embed" option and select "HTML iFrame"
| |
| − | [[File:Wix embed iframe path.png| border| center]]
| |
| − | <br><br>
| |
| − | :3. Switch to “'''Enter code'''” mode.
| |
| − | [[File:Wix enter code path.png |border| center]] | |
| − | <br><br>
| |
| − | :4. Go to your [https://simplybook.me SimplyBook.me] admin page. Navigate to '''Settings → Bookings on Webpage or Facebook → Booking widget for your own website'''.
| |
| − | [[File:Widget code path.png| center]]
| |
| − | <br><br>
| |
| − | :5. Press “'''Get widget code'''”. Almost done, just few simple steps left!
| |
| − | [[File:Create iframe widget.png | center]]
| |
| − | <br><br>
| |
| − | :6. Copy the code you received.
| |
| − | [[File:Iframe widget code.png | center]]
| |
| − | <br><br>
| |
| − | :7. Insert the code into Wix iFrame code window and Press “'''Apply/Update'''”.
| |
| − | [[File:Wix paste widget code.png|border | center]]
| |
| − | <br><br>
| |
| − | Congratulations! Now you have [https://simplybook.me the best booking system] on your Wix website!
| |
| − | [[File:Wix widget result upd.png|border | center]]
| |
| − | | |
| − | </div> | |
| − | </div>
| |
| − | <br/>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| |
| − | <span class="qa">[[Squarespace]]</span>
| |
| − | <div class="mw-collapsible-content"> | |
| − | | |
| − | [[Squarespace#iFrame_widget| As an iFrame widget]] | |
| − | | |
| − | [[Squarespace#Booking_button_widget| As a booking button widget]]
| |
| − | | |
| − | </div> | |
| − | </div>
| |
| − | <br/>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;"> | |
| − | <span class="qa">[[Go Daddy]]</span>
| |
| − | <div class="mw-collapsible-content">
| |
| − | | |
| − | [[File:Godaddy-logo (2).png| left]]<br><br>
| |
| − | | |
| − | | |
| − | | |
| − | | |
| − | | |
| − | :1. In your [https://simplybook.me/ Simplybook] admin page get the code in <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Settings</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Booking widgets settings</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Booking button</span> -> <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Get widget code.</span>
| |
| − | [[File:Create iframe widget.png|border|center]]
| |
| − | <br><br>
| |
| − | :2. In <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">GoDaddy</span> system, Log in to your account and go to website editing.
| |
| − | :3. Click on <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Pages&Sections.</span>
| |
| − | [[File:Go daddy pages new.png|border|center]]
| |
| − | <br><br>
| |
| − | :4. Select <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">Manage Pages</span> option.
| |
| − | [[File:Go daddy manage pages.png|border|center]]
| |
| − | <br><br>
| |
| − | :5. From the pages menu, select the page you want to modify or add a new one.
| |
| − | [[File:Go daddy add page new.png |border|center]]
| |
| − | <br><br>
| |
| − | :6. On page details add page title, set appearance options to your taste and create the page.
| |
| − | [[File:Go daddy page details.png|border|center]]
| |
| − | <br><br>
| |
| − | :7. Proceed to <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">adding a section.</span>
| |
| − | [[File:Go daddy add section.png|border|center]]
| |
| − | <br><br>
| |
| − | :8. Select to add <span style="background-color:#d4f8e5; padding:5px; border-radius:5px;">HTML</span> block from the side menu.
| |
| − | [[File:Go daddy add html.png|border|center]]
| |
| − | <br><br>
| |
| − | :9. Paste the code that you have previously copied from SimplyBook.me interface to the corresponding box.
| |
| − | [[File:Go daddy paste code.png|border|center]]
| |
| − | <br><br>
| |
| − | :10. Check the preview and publish the changes.
| |
| − | [[File:Go daddy preview.png|border|center]]
| |
| − | <br><br><br><br>
| |
| − | | |
| − | </div>
| |
| − | <br/>
| |
| − | <div class="mw-collapsible mw-collapsed" data-expandtext="Show" data-collapsetext="Hide" style="width:800px;">
| |
| − | <span class="qa">[[SITE123 integration | SITE123]]</span>
| |
| − | <div class="mw-collapsible-content">
| |
| − | :1. If you have not created account with [https://simplybook.me/ SimplyBook.me] you can use [https://simplybook.it/default/registration this link] to create account for your company.<br><br>
| |
| − | :2. Go to [https://www.site123.com/ SITE123.com] and click on “START HERE” to sign up or login to your account if you already have one(you can also skip steps 3-5 in this case).
| |
| − | [[File:Site123.png | center]]
| |
| − | <br> <br>
| |
| − | :3. Choose the category of website you want to create.
| |
| − | [[File:Site123 categories.png | center]]
| |
| − | <br> <br>
| |
| − | :4. Enter the name of your website.
| |
| − | [[File:Website name.png | center]]
| |
| − | <br> <br>
| |
| − | :5. Complete the sign up process by entering your full name, email and password or by using Facebook or Google to log in.
| |
| − | [[File:Sign up.png | center]]
| |
| − | <br> <br>
| |
| − | :6. After your account at SITE123 is created open the website editor, go to “Pages” and click on “Add new page”
| |
| − | [[File:Site123 add new page.png | center]]
| |
| − | <br> <br>
| |
| − | :7. Choose "Text" type and select the template to your taste.
| |
| − | [[File:Site123 create new page.png | center]]
| |
| − | <br> <br>
| |
| − | :8. On the Pages menu, you will see newly created page. Click on “Edit”.
| |
| − | [[File:Site123 edit new page.png | center]]
| |
| − | <br> <br>
| |
| − | :9. Then enter the text that will be the link to your booking site, highlight it and click on "Link" icon in the menu
| |
| − | [[File:Site123 add link text.png | center]]
| |
| − | <br><br>
| |
| − | :10. Add link to your booking site to the corresponding field. You can set it to automatically open in the new tab
| |
| − | [[File:Site123 add link.png | center]]
| |
| − | <br><br>
| |
| − | :11. Click "Insert" and save your page. As the result you will have the page with the link to your booking site and your customers will be able to easily book from there.
| |
| − | [[File:Site123 integration result.png | border| center]]
| |
| − | <br><br>
| |
| − | :'''Please note!''' Site123 has also plugin integration option developed by themselves, but it works with old themes only, that are no longer supported by us and does not have any new functionality.
| |
| − | <br><br>
| |
| − | </div>
| |
| − | </div> | |
