Установка «Интеграция сервиса SendPulse в uKit»

Введение

Благодарим Вас за покупку товара! Установка займет некоторое время. Пожалуйста, внимательно читайте инструкции и старайтесь поэтапно следовать всем рекомендациям.
Если вы сомневаетесь, что можете самостоятельно произвести установку, то воспользуйтесь дополнительной услугой по установке скрипта на Ваш сайт.


Скрипт «Интеграция сервиса SendPulse в uKit» позволит подключить и использовать на сайте сервис SendPulse для сбора контактных данных ваших клиентов.
Данный скрипт отлично подойдет для сбора данных с форм подписки, либо при оформлении покупателем нового заказа.

Требования к установке:

  • зарегистрированный аккаунт в SendPulse
  • подключенная услуга вставки HTML кода для самостоятельной установки
  • тариф "Магазин" или "Про" для использования виджета магазина

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

Первый шаг: установка кода


Этап 1. Установка кода в разделе "Свой код"

В панели управления вашего сайта перейдите в раздел "Свой код":
Кликните по кнопке "Добавить код":
Затем вставьте следующий код и сохраните.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){$('[data-widget="button"] a').on('click',function(){var urls=window.location.hostname,name=$('form [type="text"]').val(),email=$('form [type="email"]').val(),attr=$(".js-sendpulse-order").attr("src"),src=attr+urls+"&action=order&name="+name+"&email="+email;$('.js-sendpulse-order').attr("src",src);console.log('отправлено')})});
</script>

<iframe class="js-sendpulse-order" src="https://uscript.pro/php/sendpulseukit/index.php?site=" style="display: none;"></iframe>
Перейдите со вкладки "Редактор кода" в "Настройки". В блоке "Выводить код" установите - "В конец body", а в блоке "Применить к страницам" установите - "Оформление заказа".

Этап 2. Установка и настройка формы подписки

Для добавления формы подписки используйте виджет "Обратная связь":
Кликните по добавленнму виджету и настройте форму, активировав два поля - имя и email:
Для получения ID формы отправки, воспользуйтесь инструментами разработчика в браузере (клавиша F12). Откройте исходный код страницы и найдите элемент div с идентификатором блока, сразу же перед открывающим тегом формы -
:
В нижнюю часть страницы с формой добавьте виджет HTML-код:
Кликните по виджету и установите в него следующий код:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>

$(document).ready(function(){
  var form_id = '';

$('[type="submit"]').on('click',function(){var urls=window.location.hostname,form_block=$('[data-widget="feedBack"][id $="-'+form_id+'"]'),name=form_block.find('.feedBack [name="name"]').val(),email=form_block.find('.feedBack [name="email"]').val(),attr=$(".js-sendpulse-form").attr("src"),src=attr+urls+"&action=form&form_id="+form_id+"&name="+name+"&email="+email;$('.js-sendpulse-form').attr("src",src);console.log('отправлено')});

    });
</script>

<iframe class="js-sendpulse-form" src="https://uscript.pro/php/sendpulseukit/index.php?site=" style="display: none;"></iframe>
Найдите в коде переменную form_id и укажите в ее значении последнюю цифру полученного ID формы отправки. Например, если ID - ul-id-1345-2, то необходимо указать цифру 2:
var form_id = '2';

Этап 3. Установка кода в разделе "Свой код"

Перейдите в раздел управления страницами сайта и создайте новую страницу, которая будет служить панелью управления настройками SendPulse:
Укажите для нее уникальный адрес, из набора цифр и букв, который должны знать только вы:
Запомните адрес или запишите его, он вам понадобится для входа в управление настройками. Произведите удаление пункта созданной страницы из меню сайта:
Добавьте на созданную страницу виджет "HTML-код":
Кликните по добавленному виджету для открытия окна редактора кода:
Вставьте следующий HTML-код и сохраните:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){var url=window.location.hostname;$('.js-sendpulse-admin').attr("src",$(".js-sendpulse-admin").attr("src")+url)});
</script>

<iframe class="js-sendpulse-admin" src="https://uscript.pro/php/sendpulseukit/admin.php?site=" style="border: none; width: 100%; height: 1100px;"></iframe>

Второй шаг: подключение сайта


Этап 1. Указание пароля

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


Этап 2. Подключение API SendPulse

После того, как пароль задан, необходимо подключить API SendPulse.

Перейдите на страницу "Настройки аккаунта" и скопируйте ключи API:

Вернитесь на страницу панели управления и введите ID и Secret ключи.
После этого вы успешно войдете в панель управления

Третий шаг: Настройка SendPulse


В разделе "Отправка данных из интернет магазина" вы можете включить/отключить отправку данных пользователей при оформлении заказа в интернет-магазине. А также указать, в какую адресную книгу отправлять данные.

В разделе "Отправка данных через формы подписки" вы можете указать до 3 форм подписки и адресные книги для приема данных подписчиков.

Для того, чтобы получить ID формы, воспользуйтесь инструментами разработчика в браузере (клавиша F12). Откройте исходный код страницы и найдите элемент div с идентификатором блока, сразу же перед открывающим тегом формы - <form>:

Используйте последние цифры в качестве ID формы.
В разделе "Настройка Api SendPulse" вы можете изменить значения API сервиса SendPulse.

Установка завершена!

Если у вас возникли вопросы по товару или проблема с установкой, то Вы можете связаться с нами по адресу электронной почты support@uscript.pro