Онлайн чат телеграмм на сайт (виджет)

Скрипт добавляет на сайт виджет телеграмм чата с посетителем. Пользователь нажимает на кнопку telegram чата и во всплывающем мессенджере может отправить сообщение с сайта в телеграмм и пообщаться с менеджером или службой поддержки сайта (администратором). Консультант Из чата на сайте все сообщения отправляются в телеграм администратора, администратор получает стандартные уведомления из telegram о новых сообщениях, открывает мессенджер telegram (на телефоне или ПК) и отвечает на них.Сообщение При отправке сообщение тут же приходит в онлайн чат на сайте. Таким образом происходит переписка посетителей с администратором сайта. Данный онлайн консультант можно использовать для ответов на вопросы пользователей (поддержки), консультирования, оформления заказов в интернет магазине и других целей.

Скрипт можно использовать БЕСПЛАТНО (в пределах лимитов). Он подойдет для любых сайтов на любых движках или без них (на простом html).

Пример онлайн мессенджера

Примеры размещения наших виджетов со стилями по умолчанию - в левом и правом углу внизу текущей страницы или в середине внизу по кнопке "Online чат". Текст, цвета оформления, расположение на странице, модальность, размеры - все легко настраивается в конструкторе telegram чата.

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

Описание

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

Как добавить telegram чат на сайт

Инструкция по шагам. Необходимо:
  1. Зарегистрироваться (и подтвердить email)
    Регистрация
  2. Авторизоваться
    Авторизация
  3. Перейти в панель управления
    Не доступно без авторизации
  4. В боковом меню кликнуть "Telegram чат"
    Выберите виджет телеграм чат
  5. Создать новый телеграм чат
    Далее нажимаем кнопку "Добавить виджет" и заполняем название виджета (можно оставить по умолчанию) Создание чата
    Внизу справа появился предварительный просмотр только что созданного виджета. После заполнения полей на текущей вкладке нажимаем кнопку "Применить", чтобы сохранить изменения, а затем кнопку "Вперед" для перехода к следующему шагу
  6. Вводим урл сайта
    Вводим урлы сайтов на которых планируем вставить telegram виджет, каждый сайт с новой строчки:
    Добавляем сайты Нажимаем "Применить" и затем "Далее"
  7. Вводим Chat telegram ID
    Внесите список Chat ID telegram, на которые будут приходить сообщения из виджета. Если несколько, то вводите через запятую. Chat ID в telegram - это не имя профиля в telegram, а уникальный идентификатор (число) вашего профиля в telegram. Для того, чтобы узнать ваш Chat ID в телеграм, необходимо написать нашему боту @PFKARuChatBot сообщение /start (если ранее вы не общались с ботом нашего сервиса, то в телеграм увидите кнопку "запустить", которую нужно будет нажать) и в ответ вы получите ваш Chat ID. Чтобы отправить боту сообщение найдите в telegram в поиске контакт @PFKARuChatBot или кликните https://t.me/PFKARuChatBot
    telegram бот
    Вносим полученный ID:
    telegram чат id
  8. Выбор событий появления
    На этом шаге рекомендуем оставить все по умолчанию ( тут можно выбирать при необходимости события появления виджета. По умолчанию он появляется при загрузке страницы. Для изменения нужно удалить текущее и добавить новое): выбрать событие отображения
    По кнопке добавления доступны события:
    события появления
    Также можно указать задержку в секундах от наступления события до появления виджета:
    виджет появляется при наведении мыши через N секунд
    В данном примере виджет появится через 5 секунд после наведения посетителем курсором мыши на html элемент с классом mouse.
  9. Цвета оформления и расположение
    По умолчанию предлагается готовый вариант оформления чата с кнопкой внизу справа, но вы можете изменить цвета и расположение и шаблон(пресет) свернутого состояния. (Все эти настройки можно сделать и позже, после размещения telegram чата на сайте)
    Дизайн чата
    Вы можете изменить цвета оформления, например изменить цвет шапки и кнопок (рекомендуем делать их одинаковыми). Для этого используйте форму выбора цвета
    Выбор цвета
    Также можно изменить вид кнопки, модальность
    Стиль кнопки
    и расположение на странице (отдельно для свернутого и развернутого состояния).
    Расположение виджета на сайте
  10. Размеры
    На этом шаге можно поменять дефолтные размеры чата и кнопки (свернутого состояния):
    Размеры чата
  11. Проверка
    Проверяем всё ли верно и жмем "Финиш":
    Финальный шаг
  12. Добавление кода телеграм чата на ваш сайт
    Cледуем инструкции по добавлению кода телеграмм чата на сайте. Код онлайн чата Вставляем код в html.
  13. О персональных данных
    По умолчанию отображается шаг о персональных данных: Персональные данныеЕсли мы хотим убрать этот шаг, необходимо его отключить в настройках аккаунта (в панели управления меню слева -> Аккаунт -> Профиль) Персональные данные - снять галочку

Преимущества

  1. Простота добавления чата
    Пару минут - регистрация в сервисе, создание телеграм чата, вставка кода на сайт
  2. Удобно для поддержки пользователей
    Возможность отвечать пользователям с телефона (из вашего telegram) и они не останутся без ответа.
  3. Доступность и универсальность
    Вы можете использовать наши виджеты бесплатно (в пределах лимитов, указанных на главной странице). Нашу адаптивную кнопку телеграмм чата можно добавить на сайт html (с или без php), wordpress, joomla, modx, тильда и любые другие движки
  4. Бесплатная поддержка
    Обратитесь к нам через нашу форму обратной связи и специалисты помогут вам подключить telegram чат и настроить его, если что то не получилось.

Чат телеграмм на сайт - вид по умолчанию. Кнопка telegram чата - вид свернутого состояния по умолчанию.