How to install the indie "book now" widget on your website

Install your widget (book now button) to allow visitors to purchase tours directly from you. The indie widget lets you also offer Booking Protect refund protection to your visitors to enable them to buy peace of mind for anything they book with you.

Note: If you are using WIX CMS follow the steps on this LINK.

Before you begin:

Make sure that you have a payment option connected to your account. For more information follow this LINK.

Step 1: Connect Your Website

Log into your indie site at https://dashboard.indietravel.co/login
Click on “Integrations” on the side tab
Click on “Setup” (Purple Button) on the powered by indie box

On the resulting popup, you will be asked to configure your generated code:

Step 2: Configure your booking app display

Link - Select this option if you want to link to an existing button on your website which when selected will open the booking app on a new page.

Iframe - Select this option if you want to embed the booking app inside your site to display within your webpage.

Next, Would you like to have all your tours appear on your widget? (Box 1)

Alternatively, if you'd like to display a specific tour, click on “Specific” and select the tour you'd like to show from the drop-down (Box 2):

Select the choice you would like
Once you have done that, click the purple button that says “Generate Code.”
The popup will then expand and display the code you will need to add to your website.

Step 3: Add to your Website

Copy the code from the dialogue box by clicking the “Copy to clipboard” purple button

Then log in to your admin dashboard on your website and follow the below options depending on if you chose the link or iframe option in the previous step.

Link - If you selected this option to link to an existing button on your website.

Navigate to the button and open the button settings
Select the option to "insert url" and paste the link.

Iframe - If you selected this option to embed the booking app inside your site.

Navigate to the page you want to embed your booking app
In the admin dashboard select the option to add (+) a new element to your site
Select the option to Embed Custom HTML and paste the link.
Remove the width and height percentage

Add the following px
width="390px"
height="680px"

Preview and then SAVE!

If you have any questions or would like some help doing this, you can reach out to our team at hello@indietravel.co.

We would recommend testing the payment journey once the widget is installed. Below is an example of what you, and your customers, should be able to see.

The indie widget as seen on your tour page:

Selecting the date:

Adding the booking details, this is where the customer will have the option to 'Protect this booking via Booking Protect'. Read an overview of Booking Protects integration with indie here.