Time Picker Type
The 'Select' Time Picker Type feature, when enabled, transforms the time selection interface from individual buttons to a dropdown menu. This design is particularly beneficial when there are numerous timeslots available, making it easier for customers to select their preferred time.
Update Data-Config
Add the below piece of code in the data-config attribute of your checkout script, see the Implementation Guide for more information.
"features": {
"timePickerType": select,
},
Simply adding the feature in the data-config enables the input on all products in the checkout. If you wish to limit this feature to specific products, you can do so by specifying the product ID in the data-config attribute.
You can add the timePickerType feature to your data-config for script or button.
<script src="https://cdn.checkout.ventrata.com/v3/production/ventrata-checkout.min.js" type="module" data-config='{"apiKey":"<YOUR_API_TOKEN>", "features": { "timePickerType": select} }'></script>
'Select' Time Picker Type Flow
The customer selects a product where the 'select' time picker type is enable. Then they select the number of units and date.
Below the date selector a dropdown field is displayed, which is populated with the available timeslots. The customer selects a timeslot and continues the booking flow as usual.
Tour Groups Headlines
You can enable the Tour Groups Headlines feature, used alongside the 'Select time picker type, to organise your timeslots into distinct tour groups, each with its own headline.
This categorisation enhances clarity and allows customers to easily differentiate between various tour options.
Prerequisites:
Make sure that you have tour groups set up on your product.
Update Data-Config
Add the below piece of code in the data-config attribute of your checkout script, see the Implementation Guide for more information.
"features": {
"showTourGroupsHeadlines": true,
},
Simply adding the feature in the data-config enables the input on all products in the checkout. If you wish to limit this feature to specific products, you can do so by specifying the product ID in the data-config attribute.
You can add the showTourGroupsHeadlines feature to your data-config for script or button.
<script src="https://cdn.checkout.ventrata.com/v3/production/ventrata-checkout.min.js" type="module" data-config='{"apiKey":"<YOUR_API_TOKEN>", "features": { "showTourGroupsHeadlines": true} }'></script>
Tour Groups Headlines Flow
The customer selects a product where the 'select' time picker type is enable. Then they select the number of units and date.
Below the date selector a dropdown field is displayed, which is populated with the available timeslots. Timeslots are structured into meaningful groups. The customer selects a timeslot and continues the booking flow as usual.
Tour groups with headlines provide a structured view of available timeslots and help customers understand the type of tours available.
