Введение
Мессенджеры стали неотъемлемой частью коммуникации, и Telegram выделяется среди них своей функциональностью и простотой интеграции с различными сервисами. Одной из популярных задач, с которой сталкиваются владельцы сайтов, является необходимость автоматизации обработки данных, полученных через формы обратной связи. Здесь на помощь приходит Elementor — мощный конструктор страниц для WordPress, который позволяет создавать и настраивать формы без навыков программирования.
В этой статье мы рассмотрим, как связать Telegram с формой Elementor через вебхук, чтобы сообщения от посетителей вашего сайта мгновенно доставлялись вам в мессенджер. Мы подробно разберем процесс настройки, а также рассмотрим возможные сложности и способы их преодоления. Благодаря этому руководству вы сможете настроить автоматизированную систему, которая сделает ваше взаимодействие с пользователями более удобным и эффективным.
Создаем телеграм-бота
Чтобы реализовать отправку данных с формы в бота, первое что необходимо сделать это создать бота. Для этого заходим в BotFather и вводим команду /newbot.
Пишем название бота и присваеваем ему уникальное имя пользователя.
После создания бота Telegram предоставит API ключ этого бота. Он пригодится нам в дальнейшем.
Создаем чат для бота
Наш бот будет отправлять сообщения в группу в Телеграме. Следующий шаг – создание чата для отправки данных с формы.
Создаем самую обычную группу в Телеграме и добавляем туда нашего бота по имени пользователя.
После добавления нам необходимо скопировать ссылку на чат. Сделать это можно из браузерной версии Телеграма. В браузере заходим в нашу группу и копируем все после хэштега.
Интеграция бота в WordPress
К сожалению, форма Elementor не отправляет данные с полей через стандартный вебхук. Вместо данных она выводит только шорткоды этих полей, отправляя их через бот. Поэтому мы воспользуемся редактированием темы для реализации этого функционала.
Заходим в файл functions.php нашего сайта и вставляем туда следующий код:
add_action( ‘elementor_pro/forms/new_record’, function( $record, $handler ) {
$token_bota = “6622594691:AAGCezkZfL65V3XbDOYyFis5o5s5P_SeziI”; // здесь прописывается API ключ бота, который нам присвоил Телеграм
$id_chata = “-4535487874”; //сюда вставляем id группы, который мы скопировали в браузерной версии Телеграма.
$raw_fields = $record->get( ‘fields’ );
$ar = array();
$text = “Новая заявка%0A”; // символы %0A отвечают за сброс текста на новую строку. Перед ними пишем то, что будет в шапке нашего сообщения от бота.
foreach ( $raw_fields as $id => $field ) {
$text .= “”.$field[‘title’].”: “.$field[‘value’].”%0A”;
}
fopen(“https://api.telegram.org/bot{$token_bota}/sendMessage?chat_id={$id_chata}&parse_mode=html&text={$text}&disable_web_page_preview=true”,”r”); // Открывает ссылку, по которой отправляется необходимый текст в Телеграм.
}, 10, 2 );
?>
Тестирование
Переходим на страницу с формой и, заполнив поля, нажимаем “Отправить”.
Если Вы все сделали правильно, в группу в Телеграме придет сообщение от бота с данными, введенными в форме.
Заключение
Интеграция Telegram с формами Elementor — это эффективный способ автоматизировать процесс обработки заявок и улучшить взаимодействие с пользователями. Настроив вебхук, вы сможете мгновенно получать уведомления о новых заявках прямо в мессенджере, что позволит быстрее реагировать на запросы и повышать качество обслуживания. Этот процесс не требует глубоких знаний программирования и доступен каждому, кто стремится оптимизировать рабочий процесс. Используя возможности Telegram и Elementor, вы сделаете свой сайт более функциональным и удобным для вас и ваших клиентов.