Установка формы

Чтобы установить форму на сайт, сначала нужно создать ее в ZoriCRM, а затем опубликовать через встраивание.

В ZoriCRM форма не размещается на сайте сама по себе. Для публикации всегда используется встраивание. Его можно создать сразу в мастере создания формы.

В этой статье показан основной сценарий:

1. создать форму;
2. настроить публикацию через встраивание;
3. получить код;
4. вставить его на сайт;
5. при необходимости подключить открытие формы по нажатию на свою кнопку или другой HTML-элемент.

Перед началом

Перед установкой формы убедитесь, что у вас уже есть:

• доступ к разделу Настройки -> Формы и виджеты в ZoriCRM;
• возможность добавить код на сайт самостоятельно или через специалиста, который поддерживает сайт;

Шаг 1. Откройте мастер создания формы

Перейдите в раздел Настройки -> Формы и виджеты и нажмите Создать форму обратного звонка либо Создать форму заявки.

Откроется мастер создания формы.

На первом шаге мастера нужно указать:

• Шаблон — стартовый вариант формы;
• Название формы — внутреннее название для работы в CRM;
• Код формы — уникальный код формы внутри вашей компании.

Код формы используется для вызова формы через JavaScript, если вы захотите открывать ее по нажатию на свой элемент на сайте.

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

Шаг 2. Настройте форму

На втором шаге мастера настраивается сама форма.

Здесь можно:

• изменить заголовок и подзаголовок;
• настроить поля;
• выбрать внешний вид;
• изменить акцентный цвет;
• выбрать стиль полей;
• настроить обработку заявки;
• посмотреть, как форма будет выглядеть, в режиме предпросмотра.

На этом шаге вы определяете, что именно увидит посетитель сайта и какие данные он сможет отправить.

Шаг 3. Включите публикацию формы на сайт

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

Если эта опция включена, вместе с формой будет автоматически создано и встраивание. Именно оно отвечает за публикацию формы на сайте.

На этом шаге можно сразу задать основные параметры.

Разрешенные адреса сайтов

Укажите адреса сайтов, на которых разрешено использовать это встраивание.

Нужно указывать все варианты корневого адреса, по которым ваши пользователи могут открыть ваш сайт. Например, если домен вашего сайта “zori.kz”, и сайт может быть открыт также по адресу “https://zori.kz” и “https://www.zori.kz”, то нужно указать оба этих варианта.

Это обязательная настройка. Если адрес сайта не добавлен в список разрешенных, форма не будет работать на этом сайте.

Источник для лидов

Укажите источник, который будет записываться в лиды, созданные из этой формы.

Это поможет позже понимать, откуда пришла заявка.

Прикрепить к виджету

Если включить эту опцию, форма будет доступна через виджет на сайте.

Показывать по таймеру

Если включить эту опцию, форма сможет открываться автоматически через заданное время после загрузки страницы.

В этом же блоке можно настроить:

• через сколько секунд показывать форму;
• как часто показывать форму одному посетителю;
• интервал показа, если выбрана частота один раз в период;
• нужно ли прекращать показ после отправки формы;
• на каких страницах показывать форму;
• страницы для включения или исключения, в зависимости от выбранного режима.

Показывать по клику

Форма также может открываться по нажатию на ваш собственный элемент сайта, например кнопку Оставить заявку.

Этот способ доступен всегда. В мастере показывается подсказка с JavaScript-вызовом формы по ее уникальному коду.

Если вы пока не хотите публиковать форму, можно нажать Сохранить без публикации. В этом случае будет создана только форма, без встраивания.

Шаг 4. Получите код для установки на сайт

Если на предыдущем шаге выбрана опция Встроить в мой сайт, после публикации откроется шаг с инструкцией по установке.

На этом шаге ZoriCRM показывает код, который нужно добавить на сайт.

Как установить код на сайт

После того как вы получили код встраивания, добавьте его в HTML-код сайта.

Вариант 1. Добавить код в общий шаблон сайта

Подходит, если форма или виджет должны работать на всех страницах сайта.

В этом случае код обычно вставляют в общий шаблон сайта перед закрывающим тегом .

Вариант 2. Добавить код только на отдельные страницы

Подходит, если форма должна работать только на некоторых страницах.

В этом случае код можно вставить только на нужные страницы сайта.

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

Как открывать форму по своей кнопке

Кроме виджета и автопоказа по таймеру, форму можно открывать по нажатию на свою кнопку или другой HTML-элемент на сайте.

Для этого:

1. установите на сайт код встраивания;
2. привяжите JavaScript-вызов формы по ее коду к нужному элементу сайта

Например, форму можно открыть по нажатию на кнопку в hero-блоке, кнопку Связаться с нами, ссылку в меню или любой другой элемент страницы.

Так можно добавить кнопку в разметку сайта, по нажатию на которую будет открываться форма:

<input type=“button” value=“Связаться с нами” onClick=“window._zorifrms.showForm(‘ЗДЕСЬ_КОД_ВАШЕЙ_ФОРМЫ’)” />

Точный JavaScript-вызов показывается в мастере создания формы на шаге публикации.

Что произойдет после установки

После установки кода форма может работать в одном или нескольких режимах, в зависимости от ваших настроек:

• открываться через виджет;
• открываться по нажатию на ваш элемент;
• показываться автоматически по таймеру.

Когда посетитель отправляет форму, в ZoriCRM создается лид.

Если вы пока не готовы публиковать форму

Вы можете создать форму заранее и сохранить ее без публикации.

В этом случае форма появится в разделе Формы и виджеты, но не будет установлена на сайт, пока вы не создадите или не настроите для нее встраивание.

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

Что проверить после установки

После добавления кода на сайт проверьте:

• открывается ли форма или виджет;
• добавлен ли адрес сайта в разрешенные адреса;
• срабатывает ли показ по таймеру, если он включен;
• работает ли открытие по вашей кнопке, если вы его настроили;
• создается ли лид после отправки формы.

Если форма не открывается или не работает ожидаемым образом, перейдите к статье Проверка и отладка.