Learn how to work with the Hero Page Settings, including accessing settings, adding a header image or background video, displaying images when embedded, and adding or editing hero text.
Are you new to the Booking Page? Please read the first article in this series for an introduction to the Booking Page.
✓ Soho | ✓ Pro | ✓ Plus | ✓ Enterprise | ✓ Flex |
Manage > Layout > Booking Page
What more do I need to use this feature?
- Admin permissions to configure Booking Page options.
Which Checkfront version supports this feature - classic, new or both?
- The Booking Page feature is available to both those using items (Inventory > Items), a key feature of our classic version of Checkfront, and those using products (Inventory > Products), a key feature of our newest version of Checkfront.
New to Checkfront - Products ✨
Products (Inventory > Products) is the successor feature to (Inventory > Items) and is available in our newest version of Checkfront.
Not yet on our newest version and interested in upgrading? Please reach out to our Technical Support team for more information.
Discover more product-related help articles here: Products (New).
Managing hero page settingsBack to top
Click on the Hero Page Settings link to access Hero Page Settings.
Displaying background images or videosBack to top
At the top of the booking portal is a Hero Image. This can be a static image or a YouTube video. This is the first thing your Customers see when they arrive at your booking page.
Displaying a static image (Jumbotron)Back to top
Select the Jumbotron option for the Hero Image Display setting to use a static image as your Hero Image.
Click Choose File next to Hero Image to locate the image on your computer.
If you'd like to remove the current image, you can click the Delete Hero Image button.
Image Resolution and Dimensions
The image should be at least 1920 x 450 px. Image sides appear cropped on smaller displays. To reduce cropping, use an image taller than 450px.
Displaying a YouTube background videoBack to top
Add a video to your home page! With this setting, you can select a YouTube video to be displayed as the Hero Image. This plays automatically, without sound, when a Customer arrives at the page.
Simply enter the URL of the video from YouTube and click Save.
If you add a Youtube background video and the video fails to load, then the booking page defaults to show a sample image.
To prevent this and have the image default to one of your choosing instead, upload a Jumbotron image and add the Youtube background video.
Displaying images when embeddedBack to top
Check the Display when embedded option to display the image/video within pages if using integrations such as the Booking Widget or WordPress plugin.
The Hero image/video is then always displayed on the
Adding or editing hero textBack to top
If you want to display a tagline over the image/video in the Hero header, then enter the copy in the Hero Text field provided.
An example finished header is shown below.
< Introduction to managing booking page layouts | Managing category display settings for booking page layouts >