The Item Details Gadget is only one aspect of operator pages. If you require information on pulling data from Bookit's API please refer to the Operator Pages guide for further information.
As both the Item Details and Cart Gadgets are required to be together, and work together, the two will be covered in the one document. Without the Cart Gadget the Item Details Gadget will not work, and as such both must be implemented on the same page on your site.
The documentation below is still accurate, however we now have a new version of the item details gadget available.
Just use BE.gadget.detailsAccomOrActivities instead of BE.gadget.details for the new version
More details: Accommodation and Tours
As with other gadgets, both of these require the vcID to function correctly. See this page's initialisation below:
<script src="//gadgets.impartmedia.com/gadgets.jsz" type="text/javascript"></script> <script type="text/javascript"> $w(function() { BE.gadget.details('#item-example',{ vcID:85 }); BE.gadget.cart('#cart-example',{ vcID:85, bookingURL:'https://be-gadgets.bookeasy.com.au/doc/04-booking-gadget.html' }); }); </script>
As mentioned in other documentation, the second most important option to get right is the link to the next gadget in the chain which, in this case, is the Booking Gadget. This is defined in the Cart gadget via the bookingURL parameter.
Note: whilst we've only started the cart gadget on the operator page, you're free, and we would recommend, to add the cart gadget on its own sitewide, allowing your users to view it from anywehere within the site.
The Cart gadget has two display modes which can be specified using the autoCollapse parameter.
The default value for this parmater is false. If the parameter is omitted from the gadget or set to false, the full contents of the cart will be displayed, as shown below.
When this parameter has a value of true, the cart will appear as a small icon as shown in the following screenshot.