Embedded widget on a page

Let’s look at how to install the script:

To add the booking widget as an embed directly on your page:

NOTE

Ensure that the page where you want to embed the RevenueHero booking widget has a container/div to accommodate the booking widget.

  1. In the choices for “Where would you like to install this router?”, select Embed on a page.

  1. Choose your form provider (Custom/Hubspot/Formspree) from the drop-down list. This ensures that we generate the most compatible version of the JavaScript code snippet.

  2. In the Router Snippet (JavaScript), look out for the line with hero.schedule and replace the #embedDivId with the id value of your container/div in which you want the booking widget to be embedded.

  3. Now, copy the router snippet. You’ll find two parts to this script.

Add the first script to the <head> section in your website builder/CMS.

In the second part of the script replace #embedDivID with the Id value of the container/div where the widget should be embedded.

Now, paste the code before the closing body tag on your page. Depending on your CMS/Website builder, you can also add this to the footer section.


NOTE

Ensure that you add the appropriate height and width properties to your container/div that holds the booking widget to ensure that the scheduler is in full view on all devices.

You’re all set!