Impart Media Item Details and Cart Gadgets

As these two gadgets are required together, specifically the items details gadget requires the presence of the cart gadget, this page will examine both together.

As with all previous gadgets, both these gadgets 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>

You can edit the above code and either: hit esc or click this paragraph to refresh the gadget...

As before, the second most important option to get right is the link to the next gadget in the chain - in this case the booking page, which is defined as an option in the cart startup.

Note: whilst we've only started the cart on this page, you're free (and we would recommend it) to add the cart gadget on its own all over your site, thus letting your users see their cart state anywhere on your site.

Item Details Gadget Defaults

If not supplied, these are the default values for the Item Details Gadget

campaignID:                             null
descriptionHover:                       true
embedSearch:                            true
noAdults                                45 
noChildren                              45
noInfants                               45
noConcessions                           45
noStudents                              45
noObservers                             45
noFamily                                10
productID                               null
showSimilarProperties:                  null
thumbsInGrid:                           true
type                                    null
vcID:                                   null
specificTours:                          null
showQuantity:                           true
showPeriods:                            true
showAllAccom:                           false
showAllTours:                           true
showAllEvents:                          true
showHoverInline:                        false
showHoverInlineToggleButtonContent:     .
		

Each option is described below.


Note: in addition to its own options, the item details gadget (if embedSearch is true) can be passed options from the search gadget to initialise state.


campaignID

This will put the gadget into campaign mode, and will only show operators that are part of the supplied campaign ID. In campaign mode, the sort order tool is hidden, as the sort order is defined at the campaign level. Should the campaign have used the levels functionality, then the gadget will add classes you can use to style the various levels.

The syntax for converting your level names to classes is: set to lowercase, replace spaces with hyphens and remove any numbers at the start of the name. So for example, 'First Class' would become 'first-class'. Note: your style declarations will need to use !important if you don't set rules any more specific than the ones already in use by the gadget.

descriptionHover

Set to false to NOT show descriptions of each item when the user hovers their mouse pointer over the item name.

embedSearch

If set to false, you will need to manually start your own search gadget on the page.

noAdults

Maximum number of adults that can be selected from the drop adult drop down.

noChildren

Maximum number of adults that can be selected from the drop children drop down.

noInfants

Maximum number of adults that can be selected from the drop infants drop down.

noConcessions

Maximum number of adults that can be selected from the drop concessions drop down.

noStudents

Maximum number of adults that can be selected from the drop students drop down.

noObservers

Maximum number of adults that can be selected from the drop observers drop down.

noFamily

Maximum number of adults that can be selected from the drop family drop down.

productID

Normally, this is not required as the previous gadget will use the url hash to pass the required information, same for type option below. If you need to hard-set the gadget to a productID, use this.

showSimilarProperties

If passed an object that matches:

{
    container: 'css-selector',
    onlyGold: false,
    random: true,
    maxProperties:3,
    maxNumberOfGuests:true,
    itemDetailPageURL:'/product/detail.html',
    filterOrder: ['type','rating','location'],
	enableRegionSearch: true,
	forceRegionState: "QLD",
	forceRegionRegion: "Brisbane and South East Qld Country",
	forceRegionLoc: "Brisbane"
} 

Then the gadget will attempt to show similar properties to the current one. 'container' refers to the DOM element you want the similar properties list inserted into.

'onlyGold' is a boolean to show only gold medal operators.

'random' is a boolean that will attempt to show different properties every page load.

'maxProperties' will let you set the gadget to show up to seven similar properties if you prefer / have space.

'maxNumberOfGuests' will only display similar properties whereby the number of guests is equal to or greater than the number of PAX requested by the end user.

'itemDetailPageURL' is the syntax used to find your item details pages. See the option of the same name in the region gadget for more information.

'filterOrder' is an array, where you can rearrange to order shown above if you wish to prioritise location over rating (for example) when the gadget chooses which properties to show.

'enableRegionSearch' is a boolean which will enable you to specify a specific area to search.

'forceRegionState' when enableRegionSearch is set to true specifying this value will limit the results to the State provided

'forceRegionRegion' when forceRegionRegion is set to true specifying this value will limit the results to the Region provided

'forceRegionLoc' when forceRegionLoc is set to true specifying this value will limit the results to the Location provided

thumbsInGrid

Set to false if you don't want to show thumbnails for each item in the grid.

type

As above with productID, this is not normally used. If you need to hard-set a product type, set this to a string, either: 'accom','tours','events','carhire' or 'packages'.

vcID

You must set this to the visitor centre ID.

showQuantity

Set to false if you don't want to show quantity dropdown for each item in the grid.

showPeriod

Set to false if you don't want to show periods dropdown in the embedSearch option.

showAllAccom

If set to true, this will show all operators, even if they are unavailable for the time period searched.

showAllTours

If set to true, this will show all operators, even if they are unavailable for the time period searched.

showAllEvents

If set to true, this will show all operators, even if they are unavailable for the time period searched.

showHoverInline

This option will alter the description hover to show inline instead of as a tooltip.

showHoverInlineToggleButtonContent

This option will alter the toggle buttons content for inline.


Cart Gadget Defaults

If not supplied, these are the default values for the Cart Gadget

autoCollapse:        false
bookingURL:          '/product/book.html'
campaignID:          null
overlaySettings:     {
    useBlockout:     true,
    overlayColour:   '#777',
    overlayOpacity:  0.5,
    innerBackground: '#FFF',
    zIndexLowest:    1000000,
    width:           false,
    height:          false
}
vcID:                null

Each option is described below.


autoCollapse

If set to true, the gadget will go into a collapsed mode which only shows an icon and a number signifying the number of items in the cart

bookingURL

Set this to the url of your booking page. Make sure that it is a full url, pointing to a secure (SSL) page on your website.

campaignID

This will put the gadget into campaign mode, and will only show operators that are part of the supplied campaign ID. In campaign mode, the sort order tool is hidden, as the sort order is defined at the campaign level. Should the campaign have used the levels functionality, then the gadget will add classes you can use to style the various levels.

The syntax for converting your level names to classes is: set to lowercase, replace spaces with hyphens and remove any numbers at the start of the name. So for example, 'First Class' would become 'first-class'. Note: your style declarations will need to use !important if you don't set rules any more specific than the ones already in use by the gadget.

overlaySettings

If supplied with an object, this allows you to override some of the basic parts of the overlay that appears when a user clicks a product to book. 'useBlockout' set to false will stop the overlay from having a panel behind it blocking the page. 'overlayColour' allows you to change the colour of the blockout panel. 'overlayOpacity' sets the transparency of the blockout panel, from 0->1. 'innerBackground' sets the background colour of the actual overlay panel itself. 'zIndexLowest' sets the z-index of the panel, should you need a higher number. 'width' sets the width of the overlay panel, and 'height' sets its height.

vcID

You must set this to the visitor centre ID.

specificTours

You can only use this option if you are a tour manager client. It is an array of integers with each value in the array representing a tour id. When specified the tour will be displayed in the final results if it has availability.

Home