Contact form 7 whatsapp интеграция
Данная инструкция подходит в тех случаях, когда формы на сайте подключены через плагин Contact Form 7.
После отправки заявки из формы она может быть отправлена на почту с номером визита Roistat и в ту CRM, которая указана в настройках интеграции Roistat.
Для работы данной интеграции в проекте Roistat должна быть настроена интеграция с CRM.
Обратите внимание: если в качестве CRM вы используете WooCommerce, будет невозможно настроить предачу сделок через Roistat (в том числе, отправку данных из Contact Form 7 через Roistat).
Настройка¶
Перейдите в Панель администратора → Contact Form 7 → Form name → Change.
В настройках формы найдите Шаблон формы. В код шаблона нужно добавить скрытое поле, в которое будет сохраняться значение куки с номером визита Roistat:
Скрытое поле заполняется скриптом, который необходимо разместить на страницах сайта после кода счетчика Roistat. Скрипт должен быть установлен именно в шаблоне, а не через редактор форм Contact Form 7 или редактор записей.
Чтобы добавить скрипт, перейдите в раздел Панель администратора → Внешний вид → Редактор → Подвал (footer.php) и вставьте код перед тегом </body> :
Для передачи значения промокода можно дописать в шаблон письма:
Обработка заявки из формы и отправка в Roistat осуществляются через хук в модуле wpcf7_before_send_mail (можно добавить в конец файла с функциями темы: wp-content\themes\functions.php):
Ключ для интеграции можно найти в разделе Интеграции в настройках подключенной CRM:
Ключ находится в нижней части окна настроек:
Настройка Contact Form 7 в виде отдельного плагина¶
Contact Form 7 можно интегрировать с Roistat так, чтобы Contact Form 7 был отдельным плагином.
Для этого нужно:
В каталоге wp-content\wp-content\plugins создать новую папку roistat-contact-form-7-integration.
В папке roistat-contact-form-7-integration создать файл roistat-contact-form-7-integration.php.
Добавить в файл код:
В админ-панели сайта добавить Contact Form 7 в список плагинов.
Альтернативный способ добавления Contact Form 7 в список плагинов¶
В каталоге wp-content\wp-content\plugins создайте новую папку roistat-contact-form-7-integration.
1. В админ-панели перейдите Плагины > Добавить новый и в строке поиска впишите название дополнения.
Установка плагина Contact Form 7 из админки WordPress
2. В найденной карточке нажмите по очереди кнопки Установить и Активировать.
Вывод на сайте
После активации в админке откройте раздел Contact Form 7.
Список форм
В списке уже есть готовая форма. Вы можете создать их сколько нужно. Для каждой автоматически создается уникальный шорткод. Чтобы показать форму на сайте, его нужно вставить в редакторе контента или в шаблоне темы. Для примера выведем на отдельной странице.
Создание новой страницы на сайте WordPress
2. Укажите название (например Контакты).
3. Скопируйте шорткод.
Шорткод формы
4. Вставьте в блок Шорткод из раздела Виджеты и нажмите Опубликовать.
Блок Шорткод
В итоге пользователь увидит:
Как создавать формы
Перейдите Contact Form 7 > Добавить новую.
Создание контактной формы
CF предлагает стартовый шаблон, который можно удалить или изменять. Этот простой пример сделан для того, чтобы было легче разобраться. Чтобы вставить новое поле, нажмите кнопку нужного элемента.
В текстовой области видны поля, которые будут показаны посетителю. Их можно редактировать вручную. Для верстки доступны:
- элементы HTML (позволяют создать произвольную HTML-структуру),
- шорткоды плагина (добавляют элементы формы).
Если вы пока не определились с полями, оставьте как есть. К ним сможете вернуться позже.
Настройка письма
Тут можно использовать имена полей. Например, есть поле [text* telephone] . Если в письме вписать [telephone] , на его месте поставится номер телефона, который ввел пользователь.
В поле Кому вписывайте рабочий e-mail. На этот адрес будут приходить все уведомления.
Настройка уведомлений
Настройка уведомлений при отправке формы
Интеграция reCaptcha
В плагин уже встроена система спам-защиты от Google. Установим последнюю версию - v.3. Чтобы ее добавить, следуйте простой инструкции.
Добавление reCAPTCHA на сайте Google
3. Скопируйте ключи.
4. В админ-панели перейдите Contact Form 7 > Интеграция и кликните Настройки интеграции.
Настройки интеграции в плагине
5. Добавьте скопированные ключи, сохраните изменения.
Для Капчи v.2 нужно вставить тег [recaptcha] . В последней версии нет дополнительных полей.
Установка целей метрики
В CF можно отслеживать конверсии для анализа поведенческих факторов. Рассмотрим как это сделать для Яндекс.Метрики.
1. В Метрике зайдите Настройка > Цели > Добавить цель.
Настройка цели в Яндекс-Метрике
2. Придумайте название цели, отметьте JavaScript-событие, укажите Идентификатор цели. Последний нужен для отслеживания действий.
Настройка цели в Яндекс-Метрике
3. Добавьте в файл functions.php активной Ворпресс-темы код
Замените 999 на ID формы, 555 - на Номер цели, а wptest_form - на идентификатор события в Метрике.
ID формы можно посмотреть, если открыть ее на редактирование.
Редактирование формы
Готовые шаблоны
Оформление в CF7 одинаковое для всех форм. Каждую из них можно видоизменить.
Плагин Contact Form 7 Style
Вы сможете применить к выбранной форме один из нескольких готовых шаблонов. Установка стандартная.
Чтобы задать внешний вид форме:
- выберите форму;
- перейдите на вкладку Contact Form 7 Style Template;
- используя стрелки, выберите дизайн.
Решение проблем и исправление ошибок
Рассмотрим некоторые трудности, которые возникают при работе с дополнением CF7.
Не отправляются письма
Тут может быть несколько проблем:
- электронные письма не отправляются вообще;
- попадают в СПАМ.
- неправильные настройки сайта;
- ограничения на хостинге.
Чтобы заставить работать почту, есть несколько способов.
1. Стандартные настройки
Откройте вкладку Письмо в своей форме и в опции Кому проверьте, правильно ли указан адрес. Он должен быть рабочим.
2. WP Mail SMTP
Если ваш хостинг ставит жесткие ограничения на отправку писем или запрещает их вообще, тогда нужно стороннее решение. Такое бывает, если использовать почтовые ящики, созданные на хостинге.
Рассмотрим универсальный вариант - бесплатный WP-плагин, который использует внешний SMTP-сервер. Работать будем с почтовым ящиком от Gmail. На него будут приходить письма из формы.
8 (800) 333-06-99
Пройдите простую регистрацию в нашем сервисе, создав учетную запись
2. Возьмите API-ключ
В разделе "Интеграции - API" кликните по кнопке "Настройка API" и скопируйте свой ключ
3. Интеграция
Зарегистрируйтесь в Apix-Drive и настройте связь Contact Form 7 и SMS Gorod
1. Описание
2. Начало работы
1. Пройдите регистрацию в нашем сервисе СМС рассылок. Вы получите тестовый баланс, тестовое имя отправителя VIRTA и API-ключ.
3. Подключение
1. Зайдите в аккаунт ApiX-Drive.
2. Создайте новую связь. В качестве источника выберите Contact Form 7. Введите в форме авторизационные данные от своего аккаунта и проверьте получение данных.
3. Выберите систему в качестве приема данных. Соответственно необходимо указать SMS Gorod.
5. Следующим шагом нажимаем "Подключить аккаунт SMS Gorod".
6. Появляется окно с полем "API ключ". Теперь зайдем к нам в SMS Gorod, чтобы получить ключ для интеграции.
7. В нашем кабинете зайдите в раздел "Интеграции" - "Настройка API" и скопируйте ключ.
8. После того, как подключенный аккаунт будет показан в списке "активные аккаунты", выберете его. Если аккаунт не активен, то необходимо проверить скопированный ключ.
11. На этом этап настройки завершен. Включите автообновление и задайте интервал автообновления.
Обращаем внимание! Чтобы исключить нежелательные рассылки спама, все отправленные СМС у новых пользователей проходят проверку и будут отправляться с задержками. Чтобы избежать этого и СМС отправлялись мгновенно, необходимо заключить с нами договор. Напишите нам любым способом и мы подготовим договор.
Многие владельцы сайтов на CMS WordPress уже задумывались как же связать сайт с CRM системой Битрикс 24? Чтобы ответить на данный вопрос, давайте рассмотрим интеграцию Contact Form 7 и Bitrix24.
Прежде всего рекомендую ознакомится со статьей «Битрикс24 лиды с сайта — автоматическое создание лидов» и затем продолжить изучение данной инструкции.
Как связать Contact Form 7 и Bitrix24?
- Хук для перехвата введенных данных из Contact Form 7.
- Выбор подходящего способа передачи в Битрикс 24
- С помощью упрощенного Rest API
- PHP скрипт для интеграции при помощи упрощенного Rest API
- Объединение хука и PHP скрипта.
- PHP скрипт для интеграции при входящего вебхука
- Объединение хука и PHP скрипта.
Хук для перехвата введенных данных из Contact Form 7
Название $posted_data для хука Contact Form 7
Выбор подходящего способа передачи в Битрикс 24
В данной статье рассматривается два способа интеграции CF7 и Битрикс24:
- с помощью упрощенного Rest API;
- при помощи входящего вебхука в Битрикс24.
Из данных двух способов, я бы рекомендовал использовать интеграцию при помощи входящего вебхука в Битрикс24, так как данный способ более безопасный и более функциональный, чем интеграция при помощи упрощенного Rest API.
С помощью упрощенного Rest API
PHP скрипт упрощенного Rest API для отправки данных в Bitrix24
Где взять данный скрипт и как его настроить, вы можете узнать здесь «Автоматическое создание лидов в Битрикс24 через упрощенный Rest API».
Прежде чем указывать ваш логин и пароль в PHP скрипте, ознакомитесь, пожалуйста, с разделом «Логин и пароль пользователя Вашей CRM».
Объединение хука и PHP скрипта
Рассмотрев PHP скрипт упрощенного Rest API для отправки данных в Bitrix24 и Хук для перехвата введенных данных из Contact Form 7 теперь можно перейти к объединению данных двух функций. При этом необходимо будет учесть последовательность функций в коде, которая будет иметь следующий вид:
- вызов функции для перехвата данных;
- подключение к серверу CRM;
- авторизация в CRM;
- перехват данных из Contact Form 7;
- формирование параметров для создания лида в переменной $postData = array из Contact Form 7;
- передача данных из Contact Form 7 в Bitrix24.
Таким образом мы получим код следующего вида:
При помощи входящего вебхука
PHP скрипт входящего вебхука для отправки данных в Bitrix24
PHP скрипт входящего вебхука и принцип его работы был рассмотрен ранее в статье «Автоматическое создание лидов в Битрикс24 при помощи входящего вебхука».
Для того чтобы активировать работу данного скрипта, необходимо создать вебхук в самом Битрикс24 и получить [идентификатор_пользователя] и [код_вебхука] . Как это сделать можно узнать здесь: «Как создать входящий вубхук».
Объединение хука и PHP скрипта
Рассмотрев PHP скрипт входящего вебхука для отправки данных в Bitrix24, хук для перехвата введенных данных из Contact Form 7, активировав входящий вебхук и получив [идентификатор_пользователя] и [код_вебхука] , можно перейти к объединению данных двух функций. При этом необходимо будет учесть последовательность функций в коде, которая будет иметь следующий вид:
- вызов функции для перехвата данных;
- перехват данных из Contact Form 7;
- формирование URL в переменной $queryUrl ;
- формирование параметров для создания лида в переменной $queryData ;
- обращение к Битрикс24 при помощи функции curl_exec ;
Таким образом мы получим код следующего вида:
Особенности для передачи номера телефона, email или мессенджера
При интеграции CF и Битрикс 24 с помощью входящего вебхука, необходимо учесть особенности передачи номера телефона, email или мессенджера. Что это за особенности, и как все-таки передавать данные параметры можно узнать в разделе «Учесть особенность для передачи номера телефона, email, мессенджера».
Читайте также:
- С помощью упрощенного Rest API