Как установить Telegram Чат на Tilda сайт

В данной инструкции мы подробно проиллюстрируем, как установить Телеграм чат для Tilda страницы. Примерное время установки - 5 минут.

Подключение чата на сайт значительно увеличивает конверсии в продажи, а также доверие к вашему сайту. Телеграм чат от WidgetSpark можно подключить на ваш сайт на движке Tilda бесплатно!

1. Регистрация

Перейдите на сайт https://widgetspark.com/app и зарегистрируйтестесь, если еще не сделали это. Регистрация займет не более 1 минуты. После регистрации вы увидите интерфейс управления виджетами.

2. Добавление Telegram Чат Виджета

Необходимо добавить Telegram Чат Виджет и получить код, который мы вставим на сайт. Для этого переходим во вкладку Каталог и нажимаем на кнопку Telegram Чат.

^{Изображение 1 - Каталог виджетов WidgetSpark}

Откроется модальное окно с описанием небольших шагов, которые нужно выполнить. 

Шаг 1. Установка названия

На этом шаге придумываем название для нашего ТГ чата, оно будет отоброжено в списке активных виджетов.

^{Изображение 2 - Установка названия для Telegram Чат Виджета}

Шаг 2. Выбор цвета чата

На этом этапе вам предлагается выбрать цвет Телеграм Чат Виджета и форму кнопки запуска. Это не все настройки, а только лишь необходимый минимум, чтобы вы могли как можно быстрее запустить чат. Более подробные настройки дизайна будут доступны после добавления виджета.

^{Изображение 3 - Выбор цвета Телеграм чата}

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

^{Изображение 4 - Превью телеграм чата на сайте Тильда}

Шаг 3. Подключение чата телеграм

Теперь необходимо создать супергруппу в Телеграм, для того чтобы получать в ней сообщения от ваших клиентов с сайта. Для этого переходим в телеграм, открываем боковое меню и выбираем пункт Новая группа (New Group).

^{Изображение 5 - Создание новой супергруппы}

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

^{Изображение 6 - Установка названия супергруппы}

После создания группы нужно открыть её настройки.

^{Изображение 7 - Открытие настроек супергруппы}

В настройках необходимо включить Темы (Topics). Данная функция позволит разделять чаты для общения с каждым новым пользователем. Это значительно упрощает работу с обращениями.

Важно! Необходимо сначала включить Темы для группы и сохранить настройки. Только после этого переходить к добавлению администратора, в противном случае для бота не откроются все необходимы уровни доступа.

Также необходимо добавить в администраторы супергруппы нашего Telegram бота @tg_widgetspark_bot. Через него будет осуществляться отправка сообщения с Tilda сайта и обратно.

^{Изображение 8 - Включение топиков и добавление администратора}

После завершения настройки остается открыть топик #General и ввести команду /auth. В ответ на эту команду бот вернет код доступа, нажав на который вы можете его скопировать.

^{Изображение 9 - Получение кода доступа для чата на сайт Tilda}

Код необходимо вставить в форму добавления Телеграм чата и нажать Продолжить.

^{Изображение 10 - Вставка кода доступа в панель управления WidgetSpark}

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

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

^{Изображение 11 - Получение скрипта для вставки сайт}

3. Установка скрипта Telegram Чата на Tilda сайт

Скопируйте ссылку для чата со скриншота выше. После этого откройте необходимую страницу на Tilda и добавьте блок T123 (HTML код).

^{Изображение 12 - Открытие блоков старницы Tilda}

^{Изображение 13 - Поиск и выбор блока T123 (HTML)}

Далее нажимаем на кнопку Контент и в открывшейся панели вставляем скрипт Телеграм чат виджета. В конце нажимаем на кнопку Сохранить.

^{Изображение 14 - Редактирование блока Т123}

^{Изображение 15 - Вставка скрипта Телеграм Чат Виджета в блок T123}

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

^{Изображение 16 - Публикация сайта Tilda}

^{Изображение 17 - Добавлен телеграм чат на Тильда сайт}

4. Расширенная настройка и WEB клиент Телеграм Чата

После того как виджет добавлен на ваш Tilda сайт вы можете получать и оптравлять сообщения вашим клиентам.

Вам может понадобиться настроить для Telegram Чат Виджета автосообщения, надписи, смещения, шрифты и прочее. Все это можно сделать перейдя в Web клиент WidgetSpark. Чтобы сделать это нажмите на вкладку Мои виджеты и после чего на блок с Телеграм чатом.

^{Изображение 18 - Добавленный виджет Telegram чата}

Вас перенаправит на интерфейс управления Telegram чат виджетом для сайта Tilda. Здесь вы сможете как настраивать ваш виджет так и отвечать на сообщения ваших пользователей.

^{Изображение 19 - Web клиент виджета Telegram чата}

Завершение

На этом мы завершаем настройку Telegram Чата для сайта Tilda. Мы постарались максимально подробно раскрыть каждый этап настройки, чтобы у вас не возникло вопросов и затруднений.

Наши виджеты поддерживаются на 99% платформ по созданию сайтов. Для того чтобы установить виджет необходимо создать его на нашей платформе WidgetSpark и вставить скрипт в HTML разметку вашего сайта. Успехов в использовании наших виджетов!