White label assets for Providers

The following code and examples will guide you to add search boxes, rate grids and buttons to your web pages.

Please replace "YOURSHORTNAME" value with the shortname that you have been supplied.

Search box

Example

Code

In the head of your page include this script:

                    <script type="text/javascript" src="https://book.txgb.co.uk/v4/Services/ScriptService.jsws/ProviderToolkit?v=1&exl_psn=YOURSHORTNAME&exl_tg=large"></script>

In the head of your page include these styles:

                    <link rel="stylesheet" href="https://book.txgb.co.uk/v4/Resources/Platform/TXGB/Custom.css" />

To display the search box include this script in your page:

                    
<script>
    ProviderToolkit.createSearchBox().AppendHere();
</script>

Advanced options:

There are 3 types of search boxes than can be used for displaying a service (Location or Activity)

ProviderToolkit.createSearchBox

This will show a search box for the whole business. If there are Locations and Activities loaded then two tabs will be shown (eg Accommodation and Activities). If there is just one type, then no tab will be shown.

Example. See above.

ProviderToolkit.createSearchBoxForServices

This will show a search box for the service or services specified. If there are Locations and Activities for the services specified then two tabs will be shown (eg Accommodation and Activities). If there is just one type, then no tab will be shown.

Example. Show the search box for one service with a code of 'bb'.

                            
<script>
    ProviderToolkit.createSearchBoxForService('bb').AppendHere();
</script>

Example. Show the search box for multiple services with codes of 'bb' and 'bc'.

                            
<script>
    ProviderToolkit.createSearchBoxForService(['bb', 'bc']).AppendHere();
</script>

ProviderToolkit.createSearchBoxForProducts

This will show a search box for the product or services specified. If the products belong to both Locations and Activities then two tabs will be shown (eg Accommodation and Activities). If there is just one type, then no tab will be shown.

Example. Show the search box for one service with a code of 'bb1'.

                            
<script>
    ProviderToolkit.createSearchBoxForProduct('bb1').AppendHere();
</script>

Example. Show the search box for multiple products with codes of 'bb1' and 'bc1'.

                            
<script>
    ProviderToolkit.createSearchBoxForProduct(['bb1','bc1']).AppendHere();
</script>

Rate Grid

Example

Code

In the head of your page include this script:

                        <script type="text/javascript" src="https://book.txgb.co.uk/v4/Services/ScriptService.jsws/ProviderToolkit?v=1&exl_psn=YOURSHORTNAME&exl_tg=large"></script>

In the head of your page include these styles:

                        <link rel="stylesheet" href="https://book.txgb.co.uk/v4/Resources/Platform/TXGB/Custom.css" />

To display the search box include this script in your page:

                        
<script>
    ProviderToolkit.createRateGridForProducts().AppendHere();
</script>

Buttons

Link to your own booking page using a 'Check availability' button

Example

You can use different class names to change the colour and shape of your buttons. Please refer to the following:

Round		Square
.book-btn-red-round	Button	.book-btn-red-square	Button
.book-btn-yellow-round	Button	.book-btn-yellow-square	Button
.book-btn-green-round	Button	.book-btn-green-square	Button
.book-btn-navy-round	Button	.book-btn-navy-square	Button
.book-btn-black-round	Button	.book-btn-black-square	Button

Code

In the head of your page include these styles:

                        <link rel="stylesheet" href="https://book.txgb.co.uk/v4/Resources/Platform/TXGB/Custom.css" />

Place this code in your page:

                        <a rel="nofollow" class="book-btn-red-round" href="https://book.txgb.co.uk/v4/Pages/Availability.aspx?exl_dn=aaa_mywebsite&exl_psn=YOURSHORTNAME&exl_tg=large" target="_blank">Button</a>