Embedding the Bookeo scheduling widget on your WPBakery WordPress page builder is very easy.

In this article:

• Step 1 - Set up the Website integration in Bookeo
• Step 2 - Set up the integration in your WPBakery Page Builder page builder
• Step 3 - Set up the integration in Bookeo
• WP Rocket plugin
• WordPress speed optimization plugins

Step 1 - Set up the Website integration in Bookeo

1. in your Bookeo account, click on Settings>Theme and Layout>Website integration

2. From the Page location [1] dropdown menu, select the option embed a widget in my website

3. Copy the widget code shown in the Widget section at point #1 [2]

4. In the Options section from the Second screen [4] dropdown menu, select:

• remain inside the widget, or
• open a separate full-screen page

Click here to learn more about these options.

5. In the Options section from the Mobile [5] dropdown menu, select:

• use the widget embedded in the website
• enlarge the widget to full screen

Click here for more information on the options offered by Bookeo for the mobile widget.

6. leave the browser window open and open a new tab in your browser

Step 2 - Set up the integration in the WPBakery Page Builder page builder

1. Create the page where you want your Bookeo widget to appear. A good name for the page could be "Online Bookings"

2. Open the page in your WPBakery Page Builder, in the page section where you want to show the widget, click on + [6] element


3. Click Structure [7] and select Raw HTML [8]. 



4. Paste [9] the code copied earlier at Step 1 - Point 2. 

5. Click on the Save Changes [10] button. The widget won't show on the page, but don't worry!

5. Click on the Update [11] bottom to save the changes, then on the three veritcal dots [12]>View page[13]

5. Go to your Booking Page and copy the URL of the page

Step 3 - Set up the integration in Bookeo

1. In your Bookeo account, click on Settings>Theme and Layout>Website integration.

2. In the Widget section #2, paste the URL of the webpage where you put the widget [3] (the booking page in your website)

3. Save

WP Rocket Plugin

If you are using the WP Rocket plugin for caching, the options "Load JavaScript deferred" and "Combine JavaScript" of WP Rocket settings will conflict with the Bookeo plugin and prevent it from loading on the page.

To avoid conflicts, make sure to open the plugin settings and add bookeo.com to the list of exclusions under "Excluded JavaScript Files", for both options.
For instructions on how to change these settings please see https://docs.wp-rocket.me/article/976-exclude-files-from-defer-js and https://docs.wp-rocket.me/article/39-excluding-external-js-from-concatenation

You should then clean the cache of the plugin, following the steps here.

WordPress speed optimization plugins

If you are using a WordPress speed optimization plugin - such as Perfmatters, WP Fastest Cache, WP Super Cache, W3 Total Cache, WP-Optimize, Siteground, etc - you should make sure to disable any Javascript minifier/compressor, or at least exclude bookeo.com from the addresses that are optimized.