Product Overview widget
Product Overview Widget
The Product Overview Widget provides a detailed summary of a product, with information dynamically fetched from Bilberry. This widget is ideal for offering users a quick and comprehensive glance at your product’s key details.
Key Features
-
Dynamic Data Integration Automatically fetches product information from Bilberry, ensuring accurate and up-to-date details.
-
Customizable Headers Offers extensive text customization for various headers to align with your branding.
-
Enhanced User Experience Displays vital product information in a clean and organized layout.
How to Use
Add the widget to your webpage using the HTML snippet below. Replace the product-catalog-id with the appropriate ID for your product.
Example:
<bilberry-product-overview product-catalog-id="123"></bilberry-product-overview>Widget Properties
| Property | Description | Default Value | Required |
|---|---|---|---|
product-catalog-id | ID of the product catalog to display. | N/A | Yes |
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
Customize the headers for different sections of the product overview widget using the following properties:
| Property | Description | Default Value |
|---|---|---|
about-the-trip-text-customization-key | Text for the “About the Trip” header. | Unset |
additional-info-text-customization-key | Text for the “Additional Info” header. | Unset |
prices-text-customization-key | Text for the “Prices” header. | Unset |
starting-time-text-customization-key | Text for the “Starting Time” header. | Unset |
departure-text-customization-key | Text for the “Departure” header. | Unset |
duration-text-customization-key | Text for the “Duration” header. | Unset |
difficulty-text-customization-key | Text for the “Difficulty” header. | Unset |
age-text-customization-key | Text for the “Age” header. | Unset |
prices-from-text-customization-key | Text for the “Prices From” header. | Unset |
Setting Up on Wix
If you’re using Wix as your website builder, follow these steps to configure the widget:
- Access the Configuration Guide: Refer to the relevant guide in these docs for general widget setup on Wix.
- Use the Following Values:
- Server URL:
https://bilberry-widgets.b-cdn.net/v4/wix-wrappers/WixBilberryProductOverview.js - Tag Name:
wix-bilberry-product-overview
- Server URL:
Tips for Effective Integration
- Optimize Header Texts: Use the text customization properties to align the headers with your brand’s tone and style.
- Highlight Key Details: Place the widget prominently to ensure users can quickly access essential product information.
- Test Responsiveness: Verify that the widget displays correctly on various devices and screen sizes.
- Combine with Other Widgets: Pair this widget with Product Gallery or Booking Widget for a richer user experience.
By integrating the Product Overview Widget, you can provide users with a detailed yet concise snapshot of your product offerings, boosting engagement and conversions.