Package booking inline widget

Package Booking Inline Widget

The Package Booking Inline Widget provides an interface for booking package products directly on your website. It enables users to select ticket quantities, booking dates, and product options seamlessly within an inline form.

Key Features

1. Inline Booking Interface Displays a step-by-step form for selecting tickets, dates, and product options for package bookings.

2. Dynamic Product Selection Users can choose between different times for products included in the package.

3. Comprehensive Summary Shows a detailed summary of selected ticket options and products before adding the package to the cart.

How to Use

Add the widget to your webpage using the HTML snippet below. Replace the package-id with the appropriate ID for your package.

Examples:

<bilberry-package-booking-inline package-id="123"></bilberry-package-booking-inline>

With date selection first:

<bilberry-package-booking-inline
    package-id="123"
    date-selection-first="yes"
></bilberry-package-booking-inline>

Widget Properties

Property	Description	Default Value	Required
package-id	ID of the package to display for booking.	N/A	Yes
date-selection-first	When set to yes, displays date selection before ticket selection in the booking flow. Options: yes, no.	no	No
lazy-load	Set to yes to defer loading the widget content until it is visible in the viewport. Options: yes, no.	no	No

Theme Customization

The widget uses the following theme properties for styling:

Theme Property	Description
bookingWidgetColor	Background color of the form.
bookingWidgetColorContrast	Text color of the form.
bookingWidgetPrimaryColor	Color of the “Next” button in the form.
bookingWidgetPrimaryColorContrast	Text color of the “Next” button.
productCardColor	Background color of product cards in the list and summary.
productCardTextColor	Text color of product cards.
primaryColor	Color of the “Book Now” button.
primaryColorContrast	Text color of the “Book Now” button.

Common Issues and Solutions

1. No Dates Available Ensure you have added availability to the actual package in the Bilberry Backoffice. Adding availability only to the products in the package is insufficient.

2. Dates Still Unavailable Despite Package Availability Verify that the individual products in the package have availability on the same dates as the package. The package’s availability depends on both the package’s and the products’ availabilities.

3. Products Missing for Specific Ticket Options Packages may have different products for different ticket options. For instance, “Adult” tickets may include different products than “Child” tickets. Ensure the missing products are assigned to the correct ticket options in the Bilberry Backoffice.

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/WixBilberryPackageBookingInline.js
   • Tag Name: wix-bilberry-package-booking-inline

Tips for Effective Integration

1. Test Availability Settings: Ensure both the package and its individual products have correct availability configurations.
2. Optimize Theme Customization: Use the theme properties to align the widget’s style with your brand.
3. Highlight Key Packages: Feature popular or high-value packages to maximize engagement.
4. Verify Compatibility on Mobile: Test the widget on various devices to ensure a seamless user experience.

By integrating the Package Booking Inline Widget, you can provide users with an efficient and user-friendly way to book packages, driving engagement and conversions.