This post explains how to set up landing pages with flight ticket and hotel search features.        

In this article you can find information about setting up Travelpayouts landing pages. The landing page code you can find here.

• Setting of a landing page
• How to set the departure and arrival city in the search form
• The White Label setting for a landing page
• Statistics

Setting a landing page

First, unpack the file and find index.html. In this file find the following string:

var set_marker = '11501';

replace 11501 with your affiliate marker.

Set_cookies is a systemic parameter and does not affect the landing. It does not need to change.

Please note! That this marker is not only just automatically inserted into the search form code, but also into all widgets placed on a landing page. That is why you should replace it, even if you want to place your own search form.

Create a search form in your affiliate’s dashboard. Clear the check box Short code and copy the search form handle-code:

Insert this code into the string:

var set_handle = "96070048c84676bf2e585f9f912b3ed7";

After that it is completely functional and a landing page may be hosted. However, these are not the only settings. You may set it up so that the search results open on your website’s subdomain.

How to set the origin and destination city to the search form

Open the full code of the search form:

Copy the part marked on the image:

Open the js/app.js file in the landing page source and find the set form settings block there. It is necessary to place the copied code in it like this:

The White Label setting for a landing page

To set the White Label for a landing page, you will need to first create and set up the White Label.

Next, open the search form code (that was placed or will be placed on your landing page) in the affiliate’s dashboard and select the URLs of White Label in these fields:

• Flights. Domain for flight results
• Hotels. Domain for hotel results

Clear the check box Short code and copy the code "search_host": "YourWhiteLabelName/flights", needs to be placed on the landing page of the flight search and the field "hotels_host": "YourWhiteLabelName/hotels", needs to be placed on the landing page of the hotel search.

Open the file js/app.js find the search form code and place the copied data into the line:

The White Label shall be opened upon clicking on the widgets as well if you find the widgets’ code (they are marked with the inserts <!- add widget ->) in js/app.js. Specify your White Label address in the parameters host and searchUrl.

How to change the logo on the landing page

Find this part in the code of index.html:

and replace

<svg class = "icon-logo">
<use xlink: href = "# logo" />
</svg>

your logo code:

<img src="HerePasteLinkToYourLogo">

Statistics

For statistics tracking the click throughs to landing pages, use the Reports. This will also prove to be useful as an additional marker (sub ID).