Все подключаемые ресурсы (стили, скрипты, изображения) должны находиться в папке files/
files - возвращает путь к папке «files» шаблона. Имейте ввиду, что простое прописывание в html-коде пути вида <img src="files/image.jpg" /> приведет к недоступности подключаемого ресурса. Необходимо использовать следующую конструкцию <img src="files/image.jpg" />

jquery - подключает jQuery 1.9.1. Можете не использовать его если вам нужна альтернативная версия jQuery. В любом случае, для более быстрой загрузки лендинга рекомендуем загружать jQuery c CDN. Например, отсюда http://api.yandex.ru/jslibs/libs.xml#jquery

Ваши шаблоны должны быть в кодировке UTF-8

domain - возвращает текущий домен. Текущее значение: «http://demo-1.leadvertex.info»

webmaster - возвращает ID вебмастера. Текущее значение: «0». Используется в тех случаях, когда на странице успешного заказа предлагается посмотреть другие офферы. В таком случае, вы можете сделать ссылки на эти офферы партнерскими, и лиды, совершенные на них будут засчитаны от веб-мастера, который привел текущего покупателя. Например, ссылка на другой оффер может быть вида http://demo-1.leadvertex.info/?f=0

webmaster=1: ... content ... :webmaster=1 - условный тег отобразит все, что находится между открывающим и закрывающим тегом для вебмастера с ID = 1. Например, вы можете вставлять отдельные счетчики и коды на лендинг только для конкретных веб-мастеров

utm_source - возвращает метку utm_source. Текущее значение: «»

utm_medium - возвращает метку utm_medium. Текущее значение: «»

utm_term - возвращает метку utm_term. Текущее значение: «»

utm_content - возвращает метку utm_content. Текущее значение: «»

utm_campaign - возвращает метку utm_campaign. Текущее значение: «»

order_number - возвращает номер текущего заказа пользователя. Текущее значение: «нет»

order_total - возвращает итоговую стоимость оформленного заказа пользователя. Текущее значение: «0»

content - В корне папки каждого домена есть главный файл layout.html - это шаблон основной страницы, в которую обычно включается шапка и подвал, а контент прочих страниц загружается из отдельных файлов. Тег content включает в содержимое главного файла layout.html содержимое файла, находящегося в папке pages. Т.е. запрос вида http://demo-1.leadvertex.info/page.html выведет внутри главного файла layout.html содержимое файла pages/page.html

no_layout - если этот тег прописан в коде страницы из папки pages/, то содержимое этой страницы будет отображено само по себе, т.е. без использования главного файла index.html
Пример можете посмотреть на странице успешного заказа

upsell_time="10" - этот параметр должен задаваться только в файле vars.html, находящемся в корне лендинга. Параметр указывает количество минут, в течение которых может быть использована форма уточнения заказа после оформления самого заказа. Это ограничение нужно для того, что во время изменения данных заказа пользователем и операторов не возникло конфликтов

upsell_hide="0" - этот параметр должен задаваться только в файле vars.html, находящемся в корне лендинга. Может принимать значения 0 или 1. Обозначает, нужно ли скрывать форму уточнения заказа по истечению заданного времени (см. выше). Если 0, то форма уточнения заказа будет доступна постоянно до тех пор, пока в браузере будут хранится специальные cookie

Вы можете определять свои или переопределять существующие переменные из файлов шаблонов. Вы можете определять свои переменные в любых html-файлах лендинга, однако для глобальных переменных, которые могут быть использованы на многих страницах (например, название валюты, старая цена, телефон) мы рекомендуем в файле vars.html, находящегося в корне лендинга определять несколько переменных, которые будут использованы в других местах в коде лендинга:

[[currency="руб"]]
[[price_old="3900"]]
[[phone="8-800-2000-600"]]
[[email="mail@example.com"]]

Используя такой подход в файле vars.html в любом месте на любой странице вы сможете использовать объявленные ранее переменные просто вызывая их (currency, price_old, phone, email) в любом месте на странице

При таком подходе вы легко сможете изменить валюту на лендинге и контактные данные отредактировав всего один файл.

Информация о товарах задается на складе. Каждый товар на складе имеет свой алиас (техническое название, которое используется в коде лендингов). Например, такой товар как «Зеленый кофе» может иметь алиас «coffee». Алиас для каждого товара вы можете посмотреть в списке товаров на складе

Общее

good-unity alias="alias_tovara" - возвращает измерения товара, заданную на складе (например: шт, уп, ед или что-либо другое)

good-reserve alias="alias_tovara" - возвращает остаток товара на складе

Цена товара

Цена товара формируется исходя из цены, указанной на складе. Для каждого товара может быть задано несколько цен, в зависимости от количества. Например, 1 единица товара может стоить 2000, а 2 единицы - 3500.

good-price alias="alias_tovara" - возвращает стоимость одной единицы для заданного товара.

good-price alias="alias_tovara" for=3 - возвращает стоимость трех единиц товара.

good-price-total form="1" - возвращает итоговую стоимость всех добавленных в форму товаров. Параметр form задает номер формы, для которой нужно рассчитать итоговую стоимость

Цена доставки

Для указания цены доставки нет специальных тегов. Доставка добавляется как отдельный товар на склад, у которого просто не списываются остатки (Это важно! При добавлении товара уберите галочку «Вести учет остатков этого товара»). Вы можете добавить на склад 2 товара, например, товар с алиасом «pochta» и «courier» задав для каждого свою цену и выводить ее как цену обычного товара (см. выше)

Вы можете разместить на одной странице до 10 различных форм заказа с разным набором полей и правилами валидации. В любой из форм возможен следующий набор полей:

• fio - ФИО
• country - Страна
• postIndex - Почтовый индекс
• region - Регион
• city - Город
• address - Адрес
• house - Дом
• flat - Квартира
• phone - Телефон
• email - Email
• comment - Комментарий
• checkboxAgreeTerms - Галочка «Согласен с условиями покупки»
• paymentOn - Способ оплаты
• additional1 - additional25 - набор из 25 доп.полей под любые нужды

Специальные теги формы заказа

form1Begin action="/success.html" alias="alias1, alias2"
Форма заказа обязательно начинается со специального открывающего тега form1Begin. В параметре alias передается алиас товара, который по умолчанию будет поступать в админку при отправке формы. Можно указать несколько алиасов через запятую или не указывать их вообще.
Также в открывающем теге form1Begin можно указать параметр validationByAlert со значение 1 и если при заполнении формы были допущены ошибки, то они будут отображены во всплывающем сообщении.
Пример кода form1Begin action="/success.html" alias="alias1, alias2" validationByAlert="1"

form1Label for="fio" label="Ф.И.О. <span>*</span>"
Необязательный тег. Возвращает заголовок (тег <label>) для указанного поля в атрибуте «for».

form1Field name="fio" required="1" type="text" validator="~^.+$~"
Поле формы. Имеет ряд специальных атрибутов:

• name - название поля
• required - обязательность заполнения (0 или 1)
• type - тип поля
  • text - однострочное поле (input)
  • textarea - многострочное однострочное поле
  • select - выпадающий список
  • mask - маска (input)
  • checkbox - галочка
  • payment - выпадающий список для выбора способа оплаты
• validator - правило валидации поля (зависит от типа)
  • Если тип поля text или textarea - регулярное выражение. Примеры регулярных выражений:
    • ~^.+$~ - любые символы
    • ~^.{5,20}$~ - строка из любых символов длинной от 5 до 20 символов
    • ~^.{20}$~ - строка из любых символов длинной ровно 20 символов
    • ~^\d{20}$~ - строка из цифр длинной ровно 20 символов
    • ~\+?\d{9,15}~ - проверка номера телефона
  • Если тип поля select - список значений через запятую. Например, Россия, Украина, Казахстан
  • Если тип поля mask - в шаблоне можно использовать символы:
    • * — любой символ (и буква, и цифра)
    • а (англ) — любая буква
    • 9 — цифра от 0 до 9
    Например, +7 (999) 999-99-99
  • Если тип поля payment - может принимать следующие значения
    • ~0,1~ - сгенерирует выпадающий список в следующем порядке: Online, При получении
    • ~1,0~ - сгенерирует выпадающий список в следующем порядке: При получении, Online
    • ~1~ - сгенерирует скрытое поле со значением - Online
    • ~0~ - сгенерирует скрытое поле со значением - При получении

form1Error name="fio" text="Поле «Ф.И.О» заполнено неверно"
Обязательный тег, который выводит сообщение об ошибки заполнения поля. Нужен для корректной работы валидации формы.

form1End
Обязательный тег, закрывающйи форму

Интерактивные теги формы

good-button alias="braslet" form="1" add="Добавить" remove="Удалить" add-class="add" remove-class="remove"
Этот тег создает кнопку, которая добавляет товар с алиасом «braslet» к заказу. Имеет ряд специальных атрибутов:

• alias - обязательный атрибут, в котором необходимо указать алиас товара
• form - номер формы заказы (для формы уточнения заказа необходимо указать «update»), в которую необходимо добавить товар, если атрибут не указан, то товар добавится ко всем формам
• add - текст кнопки, пока товар не добавлен к заказу
• remove - текст кнопки после добавления товара к заказу
• add-class - класс кнопки, пока товар не добавлен к заказу
• remove-class - класс кнопки после добавления товара к заказу
• submit - делает из кнопки однокликовый апсел, если поставить значение «1», то при нажатии на кнопку товар добавится к заказу и клиента переведет на страницу успешного заказа
• ajax - делает из кнопки однокликовый апсел, если поставить значение «1», то при нажатии на кнопку товар добавится к заказу и страница не будет перезагружена

good-quantity alias="braslet" form="1" empty="Выберите количество"
Этот тег позволяет добавить к заказу сразу несколько экземпляров одного и того же товара. Создает выпадающий список с количеством от 1 до 10 для добавления товара с алиасом «braslet» к заказу. Имеет ряд специальных атрибутов:

• alias - обязательный аттрибут, в котором нужно указать алиас товара
• form - номер формы заказы (для формы уточнения заказа необходимо указать «update»), в которую необходимо добавить товар, если аттрибут не указан, то товар добавится ко всем формам
• empty - необязательный атрибут. Текст, который будет отображаться в списке на первом месте, пока не выбрано количество товара

good-select alias="alias1,alias2" form="1" empty="Выберите товар"
Этот тег позволяет выбрать какой-либо товар из списка представленных. Создает выпадающий список с названиями товаров. Имеет ряд специальных атрибутов:

• alias - обязательный аттрибут, в котором нужно указать алиасы товара через запятую. Например, alias1, alias2
• form - номер формы заказы (для формы уточнения заказа необходимо указать «update»), в которую необходимо добавить товар
• empty - необязательный атрибут. Текст, который будет отображаться в списке на первом месте, пока не выбран товар

Вы можете смешивать обычные теги с тегами нашего шаблонизатора, а также добавлять к ним любые атрибуты, например прописывать стили, placeholder'ы, data-атрибуты, классы и идентификаторы

[[form1Begin action="/upsell.html" alias="id1, id2"]]
    <div>
        [[form1Label for="fio" label="Ф.И.О. <span>*</span>"]]
        [[form1Field name="fio" type="text" required="1" validator="~^.+$~" placeholder="Как вас зовут?"]]
        [[form1Error name="fio" text="Поле «Ф.И.О» заполнено неверно" class="error" style="color: red"]]
    </div>
    <div>
        [[form1Label for="country" label="Страна"]]
        [[form1Field name="country" type="select" required="1" validator="Россия, Украина, Казахстан, Республика Беларусь"]]
        [[form1Error name="country" text="Поле «Страна» заполнено неверно" class="error" style="color: red"]]
    </div>
    <div>
        [[form1Label for="quantity" label="Количество" data-hint="что-нибудь2"]]
        [[good-quantity alias="id1" empty="Удалить" form="1"]]
    </div>
    <div>
        [[form1Label for="phone" label="Телефон <span>*</span>" data-hint="Мы перезвоним в течение 15 минут"]]
        [[form1Field name="phone" type="mask" required="1" validator="+7(999)999-99-99" class="textField"]]
        [[form1Error name="phone" text="Поле «Телефон» заполнено неверно" style="color: red"]]
    </div>
    <div>
        [[form1Field name="checkboxAgreeTerms" type="checkbox" required="1" style="margin: 0"]]
        [[form1Label for="checkboxAgreeTerms" label="Я принимаю условия" style="display: inline-block" ]]
        [[form1Error name="checkboxAgreeTerms" text="Вы должны согласиться с условиями покупки" style="color: red"]]
    </div>
    <hr>
    <button type="submit" class="btn btn-success" style="width: 100%">Оформить заказ</button>
[[form1End]]

Форма уточнения заказа используется на странице успешного оформления заказа, и служит для того, чтобы предложить клиентам дополнить данные о себе (например, город, адрес и индекс) или совершать апселы, которые будут добавлены в заказ.

Важно Форма уточнения заказа не может быть выведена на одной странице с формой заказа. Также, форма уточнения заказа выводится только в течение 10 минут после того, как основной заказ уже был совершен. Это сделано для того, чтобы избежать конфликтов у операторов прозвона и клиентов, уточняющих данные заказа. После использования формы уточнения заказа или по истечению 10 минут она исчезнет, и не появится у клиента до тех пор, пока он не сделает новый заказ

Для вывода формы уточнения заказа используются те же теги, что и для вывода основной форма, только вместо номера формы указывается Update. Пример

[[formUpdateBegin action="/upsell.html" alias="id1, id2"]]
    <div>
        [[formUpdateLabel for="address" label="Адрес"]]
        [[formUpdateField name="address" type="text" validator="~^.+$~"]]
        [[formUpdateError name="address" text="Поле «Адрес» заполнено неверно"]]
    </div>
    <div>
        [[formUpdateLabel for="postIndex" label="Почтовый индекс"]]
        [[formUpdateField name="postIndex" type="text" validator="~^.+$~"]]
        [[formUpdateError name="postIndex" text="Поле «Почтовый индекс» заполнено неверно"]]
    </div>
    <hr>
    <button type="submit" class="btn btn-success" style="width: 100%">Уточнить данные</button>
[[formUpdateEnd]]

Условные теги

formUpdate: ... content ... :formUpdate Условные теги formUpdate выведут находящееся в них содержимое, если на лендинге в настоящий момент доступна форма уточнения заказа.

today - возвращает текущую дату. Текущее значение: «28 апреля»

year - возвращает текущий год. Текущее значение: «2024»

from_to - возвращает диапазон дат (по умолчанию за 7 дней), где последний день является текущим. Текущее значение: «21 по 28 апреля»

from_to=5 - возвращает диапазон дат за 3 дня (параметр изменяемый). Текущее значение: «23 по 28 апреля»

only_to - возвращает текущую дату + 2 дня. Текущее значение: «30 апреля»

only_to=5 - возвращает текущую дату + 5 дней (параметр изменяемый). Текущее значение: «3 мая»

geo_city - возвращает город пользователя по IP. Текущее значение: «Колумбус»

geo_region - возвращает регион пользователя по IP. Текущее значение: «Огайо»

geo_country - возвращает страну пользователя по IP. Текущее значение: «США»

geo_country_code - возвращает ISO-код страны пользователя по IP. Текущее значение: «US»

О том, как реализовать простейший гео-таргетинг смотрите в FAQ

О том, как подключить к проекту jQuery, описано выше

Подключать сторонние, популярные библиотеки типа bootstrap и moderniz мы рекомендуем с Яндекс CDN - такой подход поможет вам обеспечить более высокую скорость загрузки страниц, что повысит вашу конверсию и снизит нагрузку на наши сервера

Обратный отсчет времени

countdown.js - подключает скрипт таймера обратного отсчета.

Время отсчета таймера задается в секундах в любом месте страницы (или в вашем скрипте). В данном примере: 560 секунд <script>window.leadvertex.seconds = 560</script>

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

• .lv_countdown_days Дней:
• .lv_countdown_hours Часов:
• .lv_countdown_minutes Минут:
• .lv_countdown_seconds Секунд:

После истечения времени счетчик пойдет повторно

Добавление товаров к форме заказа

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

• window.leadvertex.form.goodAdd(form, alias, quantity) - добавляет товар в указанную форму. Описание параметров: form - номер формы, alias - алиас товара и quantity - количество товара
• window.leadvertex.form.goodRemove(form, alias) - удаляет товар из указанной формы. Описание параметров form - номер формы, alias - алиас товара.