В качестве примера, будем рассматривать надстройку формы "заказать обратный звонок", как самую популярную. Другие вариации этой формы устанавливаются абсолютно также. Весь процесс установки будет разбит на 3 этапа. Первый этап - создание формы и получение кода с примером использования. Второй - установка кода на сайт, включая популярные CMS. Третий - проверка работы и продление абонемента.
Нажмите кнопку "Создать форму" или перейдите на вкладку "Конструктор" верхнего меню. Откроется конструктор. В центральной части будет текущая форма по-умолчанию. Можно использовать сразу её, а можно перетянуть на неё дополнительные элементы или выбрать из списка заготовок. В правом меню выводятся свойства выбранных элементов. Попробуйте их изменить и посмотреть что получится. Кнопка "Посмотреть результат" покажет вам, как будет выглядеть форма после сохранения. Свойства самой формы можно увидеть, нажав на её заголовок. Здесь вы сможете добавить капчу, сменить стандартные сообщения после отправки формы или убрать копирайт.
Сохранить форму можно лишь после того, как вы войдёте под своей учетной записью. Авторизовавшись, в конструкторе появится список ваших ранее созданных форм, а также откроется доступ к вашему кабинету. В кабинет вас перебросит сразу же после сохранения формы. Здесь необходимо ввести адрес сайта, на который она будет установлена. При необходимости, здесь можно изменить тему письма, редактировать или добавить дополнительный почтовый ящик для оповещения.
В настройках формы, можно задействовать функцию смс-оповещения. На ваш телефон придёт смс, после отправки формы, с текстом, который вы укажете. Поставьте галочку напротив "Использовать SMS-оповещение", выберите провайдера. На данный момент доступно только два провайдера. В скором времени добавятся еще.
Для работы с провайдером
Если вы выбрали в качестве смс-провайдера smsc.ru, то там нужно будет ввести ваш логин и пароль в системе.
Зачастую в смс хочется видеть сразу введённые пользователем данные, а не свой текст. Сделать это просто: берем идентификатор нужного поля (в конструкторе нажать на поле, справа в свойствах идентификатор будет первый в списке), заключаем его в квадратные скобки и вставляем в текст.
Например, вы хотите получат по смс "Имя" и "Телефон": вы открываете в новой вкладке вашу форму в режиме конструктора, копируете идентификаторы нужных вам полей
предположим, что идентификаторы name
и tel
соответственно. Тогда формируем смс-текст, вставив идентификаторы в квадратных скобках в том месте, где хотите, чтобы вставлялись данные.
Так можно вставлять любые поля формы в смс-сообщение.
Если хотите вставить в смс дополнительные данные, например, город пользователя или его IP, то это можно сделать следующими вставками:
Возникли вопросы? Задайте их нам.
В таблице с вашими формами имеется ряд кнопок инструментов . Рассмотрим их функции по очереди:
- это настройки. Здесь можно указать тему письма, почтовые адреса, настроить смс-информирование.
- кнопка откроет форму в конструкторе для редактирования. В конструкторе можно сохранить форму с изменениями, а можно сохранить как новую, таким образом скопировать расположение элементов в другую форму.
- позволит скачать архив с примером. Файлы из архива: index.html и demo.html представляют собой инструкцию по установке именно вашей формы и простой пример вызова.
- код вставки формы. Для тех, кому не хочется качать весь пример по предыдущей ссылке.
- последняя кнопка, - это удаление формы.
Суть установки сводится к тому, что в шаблоне перед закрывающимся тегом </head>
вставляют код из скачанного архива с примером вызова. Для использования скриптов прямо с нашего сайта, открываем и смотрим файл demo.html или index.html. Копируем код между <!-- jbCallMe Начало >>> -->
и <!-- <<< jbCallMe Конец -->
.
Скопируйте файлы из папок css и js на ваш сервер через FTP и подкорректируйте пути к файлам:
<script type="text/javascript" src="путь_к/jquery.jbform.js"></script> <link rel="stylesheet" type="text/css" href="путь_к/jquery.jbform.css" />
Добавьте в любом месте страницы, где вы хотите видеть кнопку, ссылку с любым классом, например <a class="callme_btn" href="#">Заказать обратный звонок</a>
, и этот класс подставить в скопированный код, вместо YOUR_BUTTON
, чтобы получилось $('.callme_btn').jbform({
. Вместо текста ссылки можно вставить картинку и, если есть желание, добавить стиль с абсолютным позиционирование, как в примере. В случае, если jQuery конфликтует с другими библиотеками( например перестаёт работать слайдер на вашем сайте, или форма заказа не всплывает при нажатии на ссылку), нужно добавить $.noConflict();
$.noConflict(); jQuery(document).ready(function($){ $('.YOUR_BUTTON').jbform({ ... }); });
Если возникли проблемы с установкой, не стесняйтесь, спрашивайте. Кстати, на сайте используется такая же форма, и когда вы задаёте вопрос, мне приходит смс, что позволяет быстро вам ответить.
Только после того, как вы установили скрипт на сайт и проверили работоспособность, можно переходить к оплате. Сумма зависит от количества сайтов, на которые модуль установлен, а не от количества форм. В кабинете вы найдёте таблицу со списком ваших сайтов, на которые установлены формы. Продлить абонемент можно не раньше, чем за 3 месяца до окончания срока предыдущего платежа.
При продлении на 1 год, если вы оплачиваете первый раз или платёж по домену был просрочен, датой старта будет сегодняшнее число. Изменения вступят в силу сразу же после оплаты. Если вы заранее продлеваете абонемент, то дата старта будет перенесена на дату окончания предыдущей транзакции по домену.
Формы на неоплаченных сайтах будут работать в обычном режиме, но письма будут приходить с урезанными данными. Мы не храним письма от ваших форм и не сможем потом отослать их с полными данными. Вся информация, переданная вам пользователями вашего сайта через форму, доставляется только на ваши почтовые ящики и не хранится у третьих лиц.