Our booking widget is really easy to add to your site to start taking bookings within minutes. This article will walk you through the steps for a number of different web service providers. Use the menu below to jump to your provider, if your provider is not listed please follow the generic steps or reach out to your web service provider directly.
n.b To locate your personalised script for your outlet please see this article here.
Generic Steps
- Access your website CMS
- Edit a page you would like the widget to appear on
- Change from design to html view
- Paste the 'script' code from your eola dashboard
- Ensure you include the '<' & '>'
- Save and publish
- View your booking widget directly on your website
If you would like to copy this onto every page of your site please look for Custom HTML / Header or Footer options. These settings replicate across every page of your site and will allow you to only add the code once.
Square Space
- Edit a page or post, click an insert point, and click Code from the menu. For help, visit Adding content with blocks.
- Add your code in the text field.
- If you're using the code block to display code snippets, switch the Display Source toggle on.
- If you're using the code block to render code, ensure you select HTML or Markdown in the Type menu.
- Enter or paste the code into the text field. To paste code, copy the code, then click into the field and press Ctrl + V (Windows) or Command + V (Mac).
- Code blocks set to CSS or JavaScript display code as text by default. To render CSS or JavaScript in code blocks, select HTML from the drop-down menu. For CSS, surround the code with <style> </style> tags. For JavaScript, surround the code with <script> </script> tags.
Weebly
- You can add a variety of external content to your website using the Embed Code element. First, drag the element to your page wherever you want the embedded content to appear.
- Next you'll need to get the code for the item you want to add.
- Once you have copied the embed code, click inside the Embed Code element and select Edit Custom HTML. Then simply paste the code in place.
- When you click outside of the element, your content should show up on the page, though there are some types of code that will not display anything in the editor. In either case, you'll want to publish your site to make it available to visitors.
Important: Pasting invalid or incomplete code can cause problems with your website. If you can’t see the rendered code or something else seems wrong, double check that the embed code element includes the full, complete code. You may see unexpected results if, for example, you didn’t paste the entire code or accidentally inserted extra characters.
WordPress
- Install Insert Headers and Footers by uploading the insert-headers-and-footers directory to the /wp-content/plugins/ directory. (See instructions on how to install a WordPress plugin) *goes to external site.
- Activate Insert Headers and Footers through the Plugins menu in WordPress.
- Insert code in your header or footer by going to the Settings > Insert Headers and Footers menu.
Wix
- In your Wix account, go to Settings in your site's dashboard.
- Scroll down and click Custom Code next to Advanced.
- Click + Add Custom Code at the top right.
- Paste the code snippet in the text field.
- Enter a name for your custom code in the Name field.
- Click Apply.
- Note: Leave All pages - Load code once and Place Code in: Head selected.
- Refresh your live website to view the widget.