Easily integrate Orufy Bookings into your website to allow clients to schedule meetings or appointments directly. Using a simple JavaScript snippet, you can open the booking widget with a custom button click — providing a seamless and professional scheduling experience.
Open Orufy Bookings with a Custom Button
Step 1: Add Script and Stylesheet to Your <head>
Tag.
Add the following lines inside the <head>
section of your website:
<!-- Orufy Booking Widget Stylesheet -->
<link
rel="stylesheet"
href="https://orufybookings.com/external/widget.css"
type="text/css"
/>
<!-- Orufy Booking Widget Script -->
<script src="https://orufybookings.com/external/widget.js"></script>
<!-- Function to Open Booking Modal -->
<script>
function showBookingModal() {
if (window.orufyBookings && typeof window.orufyBookings.Open === "function") {
window.orufyBookings.Open(
"https://orufybookings.com/orufy-bookings/orufy-booking-support"
);
}
}
</script>
Replace the link https://orufybookings.com/orufy-bookings/orufy-booking-support (opens in a new tab) with your own event link.
Where to Get Your Event Link
1. Visit: https://bookings.orufy.com/event-types (opens in a new tab)
2. Select the event you want to embed.
3. Click on the “Share” button.
4. Copy the event link shown and paste it in place of the default URL in the script above.
Step 2: Add a Button to Trigger the Booking Widget
Use the showBookingModal()
function in your button’s onclick attribute:
<button onclick="showBookingModal()">
Book Now
</button>
Note: Make sure the function name (showBookingModal
) matches exactly with the one defined in your script.