Intro
This article describes how to create a Search Page on your website using Rezfusion Hub.
...
The first step is to go to the channel in Hub you are setting up your search page and click Edit.
Scroll down to the QuickSearch Settings section and set the URL path to what you would like to use for your search page. Example: /vacation-rentals
Go to App Settings and set note that the Search Element ID is set to “app” by default. You can rename this to whatever name you want to give the ID. This defaults to “app”.
Add a page for the URL path to your website’s main navigation. You want a guest to go to this page and search for properties.
On that page you drop the following HTML
...
, but are not required to make any changes.
Find the Hub script by going to Compile Tag and copying the link from Tag ID to enter into the script. Example: https://assets.rezfusion.com/…/bundle.js
The id=”app” is what tells Rezfusion Hub that is where it should display your search experience. Only the ID changes, the script is always your compiled script for the channel in Hub.
Select edit channel
Availability API section
Enter your Booking Confirmation URL
https://www.rezfusionhubdemo.com/booking-confirmation
...
Enter your full URL you would like booking confirmations to be rendered
App Setting section
Enter your App ID if you want it different than the default “booking-confirmation”
...
Quote Settings section
Enter your url as a new row in the Permitted Referrers section.
...
Save your channel settings
Recompile your channel tag
Publish your updated channel tag
...
What to do
...
in your website
Now you need to create the page for booking confirmations, add your Hub script, and give it the ID
In your website’s CMS (Squarespace, Wordpress, etc.) create a page with the same URL you set in Availability API Settings (example https://www.rezfusionhubdemo.com/booking-confirmation)
Publish your new page, but be sure to not have it in your navigation
Next, add your Hub script to the page with the App ID from your channel’s Booking Confirmation App ID (example “booking-confirmation”)
...
Make sure there is a page that matches the URL path from your Hub settings. Example: /vacation-rentals
On that page you drop the following HTML
| Code Block |
|---|
<div id="booking-confirmationapp"> <script src="https://assets.rezfusion.com/…/bundle.js" type="text/javascript"></script> </div> |
The id=”app” is what tells Rezfusion Hub that is where it should display your search experience. Only the ID changes, the script is always your compiled script for the channel in Hub.