Настройка лендингов Aviasales и Hotellook

В этой статье описывается процесс настройки лендингов с поиском авиабилетов и отелей. Лендинги по умолчанию рассчитаны на работу с сервисами aviasales.ru и hotellook.ru, но вы можете добавлять на них любые инструменты по своему усмотрению.

Ссылки на исходники лендингов находятся в статье Лендинги от Aviasales и Hotellook.

Настройка landing page

В первую очередь распакуйте архив и найдите файл index.html. В нем найдите строку:

var set_marker = '11501';

и замените цифры 11501 на свой Travelpayouts ID.

Параметр set_cookies является системным и не влияет на работу лендинга, изменять его не нужно.

Обратите внимание! Этот ID автоматически подставляется не только в код формы поиска, но и во все виджеты, размещённые на лендинге. Поэтому заменять его нужно обязательно, даже если вы решили разместить собственную форму поиска.

После этого лендинг можно загружать на хостинг — он полностью готов к работе. Но на этом настройки не заканчиваются. Вы можете разместить на лендинге собственную форму поиска и настроить лендинг так, чтобы результат поиска открывался на поддомене вашего сайта.

Как установить определённый город в форму поиска авиабилетов

Если вы хотите, чтобы город вылета и прилёта на вашем лендинге поиска авиабилетов был автоматически заполнен определенным значением, вам нужно внести небольшие изменения в код. Для этого:

1. Откройте файл app.js в папке js в исходнике лендинга и найти там блок <!-- add form widgets -->

<!-- add form widgets -->
docReady(function() {
var searchOrigin;
var searchDestination;

2. Переменная searchOrigin — это город отправления, а переменная searchDestination — это город прибытия.

3. Подставьте нужные значения в виде IATA кода аэропорта, например:

<!-- add form widgets -->
docReady (function() {
var searchOrigin = 'MOW';
var searchDestination = 'LED';

В этом случае в качестве города отправления указана Москва, а город пребытия — Санкт-Петербург.

Как установить определённый город в форму поиска отелей

Если вы хотите, чтобы город расположения отеля на вашем лендинге был автоматически заполнен определенным значением, вам нужно внести следующие изменения в код:

1. Откройте файл app.js в папке js в исходнике и найти там блок <!-- add form widgets -->

<!-- add form widgets -->
docReady(function() {
var searchDestination;

2. Переменная searchDestination — это город, в котором нужно найти отели.

3. Подставьте нужные значения в виде IATA кода города, например:

<!-- add form widgets -->
docReady (function() {
var searchDestination = 'LED';

В этом случае в качестве направления выбран Санкт-Петербург.

Настройка White Label для лендинга авиабилетов и отелей

Чтобы настроить White Label для лендинга, для начала создайте и настройте сам White Label.

Важно! White Label должен быть настроен на поддомене.

После этого в форме поиска, которую вы создали для размещения на лендинге (её handle мы копировали выше), выберите в полях:

  • Авиабилеты. Домен — имя вашего авиа White Label для отображения найденных авиабилетов;
  • Отели. Домен — имя вашего отельного White Label для отображения найденных отелей.

Чтобы при клике на виджеты открывался White Label, необходимо найти в файле js/app.js код виджетов (они обозначаются такими вставками <!- add widget ->) и в параметрах host и searchUrl указать адрес вашего White Label.

Как создать лендинг в Lpgenerator

Если вы не хотите возиться с кодом и хотите получить собственный лендинг — воспользуйтесь сервисом lpgenerator.ru. Совместно с этой компанией мы разработали два шаблона лендинг-страниц (раз, два), которые можно сразу использовать в своей работе.

Чтобы шаблоны появились в личном кабинете lpgenerator, зарегистрируйтесь по ссылке http://lpgenerator.ru/?partner_id=as или, если у вас уже есть профиль в данном сервисе, напишите запрос в службу поддержки. Подробнее об этой возможности вы можете прочитать в блоге lpgenerator.

Статистика

Для отслеживания статистики переходов по ссылкам на лендинги Aviasales используйте Сводка по программе с фильтрацией по хосту. Кроме того, вам будет полезен такой инструмент, как дополнительный маркер (Sub ID).

mceclip0.png