Book now button widget

Book Now Button Widget

The Book Now Button Widget adds an inline button to your website that toggles the booking widget’s open/closed state. This widget allows users to quickly access the booking flow with a single click.

Key Features

1. Inline Button Provides a clean and simple button to toggle the booking widget, enhancing user convenience.

2. Customizable Appearance Supports size adjustments and text customization to match your website’s design.

3. Responsive Design Adapts seamlessly to both desktop and mobile screens.

How to Use

Add the widget to your webpage using the HTML snippet below. Customize its properties as needed.

Example:

<bilberry-booking-button size="l" xs-size="m"></bilberry-booking-button>

Widget Properties

Property	Description	Default Value	Required
size	Size of the button on medium to large screens. Options: s, m, l.	s	No
xs-size	Size of the button on small screens (mobile). Options: s, m, l.	s	No
lazy-load	Set to yes to defer loading the widget content until it is visible in the viewport. Options: yes, no.	no	No

Text Customization Properties

Property	Description	Default Value	Required
button-text-customization-key	Custom text for the button. Unset by default.	Unset	No

To customize the button text, use the button-text-customization-key and define the corresponding text in your global text customization settings.

Setting Up on Wix

If you’re using Wix as your website builder, follow these steps to configure the widget:

1. Access the Configuration Guide: Refer to the relevant guide in these docs for general widget setup on Wix.
2. Use the Following Values:
   • Server URL: https://bilberry-widgets.b-cdn.net/v4/wix-wrappers/WixBilberryBookingButton.js
   • Tag Name: wix-bilberry-booking-button

Tips for Effective Integration

1. Place Prominently: Add the button in a visible location, such as a product or service page, to encourage bookings.
2. Test Custom Text: Ensure your custom button text aligns with your branding and resonates with users.
3. Optimize for Mobile: Adjust the xs-size property to provide a user-friendly experience on small screens.
4. Ensure Accessibility: Use clear, actionable text on the button to guide users effectively.

By integrating the Book Now Button Widget, you can simplify the booking process and improve the overall user experience.