If you already have a website, you can add Hospitable’s booking functionality using widgets. This allows guests to view availability, see pricing, and submit booking requests directly from your site.
This article explains how to generate and add a booking widget to your website.
Before You Start
Make sure:
You have an existing website (e.g., WordPress, Squarespace, Wix, or custom-built)
Your properties are eligible for Direct bookings
Your Direct setup is complete
Also see: Managing Property Eligibility for Direct Bookings
How to Get Your Widget Code
Each property has its own booking widget.
To access the widget code:
Go to Direct Bookings → Websites
Select your site
Open the Properties section
Find the property you want to embed
Open the options menu (three dots)
Click Copy widget code
This code is unique to that property.
Property list in Direct Websites with a three-dot menu and Copy widget code option
Add the Widget to Your Website
Once you have the code:
Open your website editor
Navigate to the page where you want the booking widget to appear
Add an HTML embed block (or equivalent)
Paste the widget code
Save and publish your page
The widget will load on your page and allow guests to start the booking process.
Website page with a booking widget showing calendar, pricing, and booking button
Set Up One Widget Per Property
Each property requires its own widget.
For best results:
Create a dedicated page for each property
Add the corresponding widget to each page
This ensures:
Accurate availability and pricing
Compatibility with features like property search and distribution
Each property must have its own widget and page to function correctly.
Optional: Add a Search Widget
If you have multiple properties, you can also add a search widget.
This allows guests to:
Search across all properties
View availability based on dates and guest count
Navigate to individual property pages
Also see: Direct Multi-Property Search
Platform-Specific Considerations
Some website builders may require additional setup.
For example:
Wix may require developer mode or additional configuration
Some platforms restrict how embedded scripts behave
Also see: Using Hospitable with Wix
Widget behavior may vary depending on your website platform.
Test Your Widget
After adding the widget:
Open your page in a browser
Select dates and check availability
Start a booking request to confirm it works
Use an incognito window to avoid cached results.
Common Issues
If your widget is not working:
The code may not be fully pasted
The property may not be eligible
The page may not support embedded scripts
Also see: Troubleshooting Widget Issues
Important Things to Know
Widgets sync automatically with pricing and availability
Each property requires its own widget
You must manage your own website separately
Widgets do not control your site’s design
Some platforms may require additional configuration