Integrating the Booking Site Using HTML
Seamlessly embed Resova into your HTML or PHP website by following these steps:
1. Retrieve the Embeddable Code from Resova
- Navigate to Settings > Booking Site Settings from the main navigation.
- Select the Publish Booking Site button in the settings menu on the left.
- Choose which part of Resova you would like to publish:
- Booking Site: Link or integrate your entire booking site.
- Items: Link or integrate individual items for customers to book.
- Gift Vouchers: Integrate the option for customers to purchase gift vouchers.
- Customer Accounts: Allow customers to log into their accounts.
- Waivers: Enable customers to sign waivers online.
- Choose which part of Resova you would like to publish:
- Under “How do you want to publish?”, choose HTML Integration.
- Copy the HTML and JavaScript code provided by Resova.
2. Add the Code to Your HTML/PHP Page
- Open your HTML or PHP file in a code editor (e.g., Visual Studio Code, Sublime Text, etc.).
- Paste the copied Resova code into the desired location within your HTML structure, where you want the booking widget to appear.
- Save the changes to your file.
For example:
<div id="resova-wrapper"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
// Your Resova embed script
js.src = "https://your-resova-code-url.com";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'resova-jssdk'));
</script>
3. Upload and Test
- If your website is hosted, upload the updated HTML/PHP file to your web server using an FTP client or hosting dashboard.
- Visit your website to confirm the Resova booking widget is displayed and functioning as intended.
4. Customize and Optimize
- Use CSS to style or position the booking widget, if necessary, to match your website’s design.
- Test the widget’s functionality, including browsing items, making bookings, and payments, to ensure a smooth customer experience.
5. Additional Notes
- For advanced customizations or troubleshooting, ensure you have a basic understanding of HTML and JavaScript.
- If you encounter any issues, reach out to your web developer for assistance.
By following these steps, you can integrate Resova into your HTML/PHP website, offering customers a seamless booking experience directly from your site.