How to update your Banner settings
To change any details in your Banner settings including banner image, logo size and text displayed
1. Go to Venue>Booking Widget>Widget Messages
2. Add the following scripts to the box Day Closed for the action you want to take. All details displayed in your banner live here.
Banner Image
Your banner image is the background image at the top of your booking widget
1. Go to Venue>Booking Widget>Widget Messages
2. In the Day Closed field add the following script, replace the example URL with a URL of the image you want to use beneath your existing day closed message.
<!-- [banner|https/yourimageurl.com] -->
Other banner details
1. Change the size of your logo and hide the venue name
[banner-logo-height|55][banner-venue-name-hidden|true]
2. Type
<!-- [type|Italian Dining] -->
3. Heading 1
-
[heading1|Come for Dinner]
4. Heading 2
-
[heading2|Stay for the feeling]
In this example, the following script is added to the Day Closed field to show the display you see above:
<!-- [banner|https/yourimageurl.com] [type|Italian Dining] [heading1|Come for Dinner] [heading2|Stay for the feeling] [banner-logo-height|55] [banner-venue-name-hidden|true] -->
Omitting any of these details will revert to default.
Example: If you didn't want to remove the banner venue name, you don't need to change [banner-venue-name-hidden|true] to [banner-venue-name-hidden|false], just don't add anything for the venue name. Your script would instead look like this:
<!-- [banner|https/yourimageurl.com] [type|Italian Dining] [heading1|Come for Dinner] [heading2|Stay for the feeling] [banner-logo-height|55] -->
How to edit your Section details
Each of your bookable sections as well as events and functions can have their own images and text. To do this you need to go to the Diary>Settings>Services
You only need to do this for one service per day and the settings will show for all services that day.
You must ensure the section name matches exactly to the section name in your settings
Section Images
1. Go to Diary>Settings>Schedules
2. Select the Service and edit the below script to include the exact name of the section and the url to the image. If you have multiple sections you can do the same script in a new line.
<!-- [section-image|section name|https://yourimageurl.com]-->
3. Copy and paste for each day
Section Descriptions
To add a short description of under the section name along with the image
1. Go to Diary>Settings>Schedules
2. Select the Service and edit the below script to include the exact name of the section and the text description you want to include.
[section-description|The Terrace|Relaxed table seating]
In the above example the script would look like this
<!-- [section-image|The Terrace|https://cdn.example.com/bar.jpg] [section-description|The Terrace|Relaxed table seating] -->
Set your widget colour
Set the colour theme of the buttons and icons on your booking widget. This will be the default colour theme on tiles and banners if no images are selected.
1. Go to Venue>Booking Widget>Widget Generator
2. Select the colour theme you'd like to display
Once you've finished editing the widget, scroll to the bottom, select save and copy the code snippet to add to your website.
For deeper customisation, or if you have a web developer assisting with your set up you can go to Venue Settings>Bookings>Booking Widget>Widget Generator
Once you arrive at Widget Generator, scroll to the widget embed code and select </>Embed examples
This will open the Booking Widget Embed reference for your Venue.