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.
Which plans include this feature?
Legacy: Soho, Pro, Plus, Enterprise, Flex
New: Growth (Subscription), Growth (Online Booking Fee), Managed
→ Learn more about our new plans or how to change your plan.
Where can I find this feature using the top menu?
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?
- This feature is available in both our classic version using items (Inventory > Items) and our newest version using products (Inventory > Products). → Learn more about products
Managing hero page settings
Back to topClick on the Hero Page Settings link to access Hero Page Settings.
Displaying background images or videos
Back to topAt 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 topSelect 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 DimensionsThe 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 video
Back to topAdd 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 embedded
Back to topCheck 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 text
Back to topIf 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 >