Booking Tools

Booking Widget 3.0

Get the latest updates on the booking widget, how it can improve booking conversions on your website and how to set it up.

Here's an overview of what we cover in this article:


What's new with our Booking Widget?

  • Keep customers shopping - Website users can now add multiple tours and activities into the same basket, and pay for it all in one go. 
  • Floating cart - After selecting their tours, customers can click on 'Continue Shopping'. The checkout window will be minimised to a 'Floating Cart' that remains on your website until they checkout. You can also define the position of the floating cart (bottom right/ left, top right/left). 

    Floating cart example-1
  • Design improvements - The new widget has a fresh look. Overall it has an easier and faster navigation, which will positively impact booking conversion rates on your website. It's simple design also means that it will fit in nicely with any website.
  • Discounts are clearly displayed when customers buy more than one tour. 
  • Add-ons are more popular in the booking flow, making it easier for you to upsell customers.
  • Improved integration - The new widget integrates more seamlessly with your company's website, improving your customers' booking experience. 
  • Accept more payment methods with an updated hosted payment page from TrekkPay.
  • Third party payment gateways coming soon - The 3.0 Widget currently supports our excellent TrekkPay solution. Other payment solutions such as Stripe are planned to be supported in the future. If you are currently using a PSP such as stripe you can still use the 3.0 widget and you will see payments through the widget come into your TrekkSoft account.


Booking Widget types

  • Activity Booking: When you would like to place a button on your website for a specific activity, which open the calendar straight away in a modal window. 
  • Activity Details: If you would like to show descriptions, route and images before the booking, you can select this button type.
  • Floating cart: This code should be inserted where you do not have a "Book Now" button, but you would still like the floating cart to show up. These should be pages where your guests might navigate during the booking process, such as your home page or your `Contact Us` page. Please note that all other button types contain the floating cart, so you do not need to insert it separately where you already have another button.
  • Inquiry: You can add an "Inquiry" button to allow customers to ask for a specific date for a tour or activity.
  • Shop Item: Creating book now buttons for your shop item categories, such as vouchers, t-shirts or any other merchandise 
  • Package: Create packages from your activities and add a booking button for these packages to your website.
  • Collections: Place a booking button for a group (or collection) of activities.

How to integrate the Booking Widget to your website

    The new booking widget can be found inside your Admin Desk. On the left-hand side menu, click on Settings> Product and Booking  Settings> Booking Widget.

    Here you can generate the widget code to insert to your website. Check out this video for steps to add the widget code to your website. 


    Integrate Booking Widget Into Website


    Adding the Activity Details button type

    If you have any activity related content added to your Activities in your TrekkSoft account, such as descriptions, highlights or images you can display them before taking the customers to the booking calendar with this button type. 

    How to set up

    To start, go to your Admin Desk and click on Booking Widget. Then, select "Activity Details".


    Positioning your floating cart

    You can adjust the position of your floating cart by choosing bottom right/ left or top right/ left depending on how your overall website looks like. For example, if you have a chat tool on the bottom right, you might want to avoid overlapping tools in the same area of your webpage.  

    Please make sure that the generated script is integrated on each page with a Book now button or is integrated as part of the common script so it automatically appears on every page. 

    floating cart settings

    Additionally, you can also define whether your website user should be able to drag the floating cart to a different position on the site. 

    Select position floating cart

    Adding an Inquiry Button

    Besides the "Book Now" button, you can also integrate an Inquiry button on your website.

    You can add an Inquiry button to specific activity pages for customers to ask about dates when you don't have availabilities (perhaps you've sold out or don't run a tour on those days), or you run a private tour and you don't have a fixed schedule for it. 

    Your customers will be able o send an inquiry for a certain activity by entering their email address and selecting a date. 

    How to set up

    To start, go to your Admin Desk and click on Booking Widget. Then, select "Inquiry".

    Next, edit the text and colours of your button. Then, copy and paste the code to your webpage. 

    Inquiry Button


    What happens with inquiries? 

    After the inquiry is sent, your customer will get an automated email in the inbox confirming the sending of the inquiry. Additionally you as the supplier will receive a notification via email and the inquiry will appear in your Admin Desk under Bookings > Inquiries.

    Shop Items

    To create a Shop Item book now button, please go to Admin Desk and click on Booking Widget. Then, select "Shop Items".

    Next, select the Shop Item Collection for which you would like to create the button, change the additional settings and insert the code to you webpage as described in the segment above.


    You can read more about Shop Items here.


    You can combine multiple activities (or just use one) into a package, so your customers can book a predefined combination of activities for a different price price.

    How to set up

    To start, go to your Admin Desk and click on Booking Widget. Then, select "Package booking".

    You can read more about Packages here.


    You can create customised grouping for your activities based on categories such as departure location, seasonality or activity type. There is also a default group where all your activities get added automatically, however once you create a custom group you can make that the default one. You can then place a booking button on your website which will bring up all of the activities belonging to the selected group as a list. 

    You can create Activity Collections under Admin Desk>Settings>Product & Booking Settings>Activity Categories.

    How to set up

    To start, go to your Admin Desk and click on Booking Widget. Then, select "Activity collection".

    Additional Settings


    You can choose which language should be used first when someone opens the booking widget, so it matches the language of the page where you place it on your website

    Selected optional agent

    You can allocate an Agent to your `Book Now` button, so you can track how many bookings are coming from an agent's website and track the Agent Commissions as well.

    Book Now button text

    If you would like to change what text appears on the button instead of Book Now


    You can choose what colour the text and background colour of your `Book now` button should be by default and when someone is hovering over it. Please see the example below.

    We have selected these colours:

    This is how the button looks by default:

    This is how it looks when I hover over it:



    Please keep in mind that the new booking widget won't support iframe integration. We've compiled a couple of reasons why iframe integration is less favourable on your website here: 

    Disadvantages of using an iframe integration on your website