Всем привет. В серии уроков, где мы разбирались в создании сайта на стандартных блоках мы подключали форму обратной связи. Получать заявки мы собирались в панель тильда, но это не единственный вариант.
Сегодня я покажу, как интегрировать телеграм в тильду. Получать все заявки мы будем прямо в мессенджер, что в разы удобнее, чем получать их на сайте. Поехали!)
Переходим к настройкам сайта
Открываем настройки сайта и ищем раздел «Формы». Переходим туда.
В данном разделе мы можем интегрировать автоматическую рассылку форм на разные каналы, а так же подключить стороннюю CRM систему. Нам же нужен пункт Telegram — отправка данных форм в телеграм.
Переходим в бота.
Нажимаем «Начать» и бот присылает нам все нужные данные. АПИ ключ и секретный ключ. Копируем их и вставляем в соответствующие поля в самой тильде.
Вставляем данные и нажимаем «Сохранить». Бот тильды пришлёт нам сообщение о том, что бот подключен.
Спросит нас тильда. Нажимаем добавить, нам нужны все формы. Готово! Идём тестировать. Я заполню форму на том самом сайте ресторана, который мы делали вместе с вами.
Как установаить Онлайн чат для сайта в Tilda
Готово! Тильда прислала нам данные с формы прямо в телеграм. На этом всё. Вот такой простой урок.
Делаем кликабельным номер телефона, Whatsapp, Telegram и E-mail
Скорость и простота коммуникации — то, к чему современные потребители уже привыкли. В эру высокоскоростного мобильного интернета люди хотят решать свои задачи через смартфон, делая минимум лишних движений. Клик сюда, клик туда и готово!
Поэтому важно сделать так, чтобы взаимодействие с сайтом было максимально простым. Например, чтобы позвонить в компанию достаточно было кликнуть по телефону в шапке.
Разберемся, как проработать такую маленькую, но очень важную деталь сайта, как кликабельные кнопки связи (телефон, почта, мессенджеры).
Номер телефона
Чтобы при клике на номер телефона начинался звонок нужно сделать следующие шаги.
HTML-код сайта
Некликабельный номер телефона (просто текст) может выглядеть в коде по-разному, например, так:
Чтобы сделать обычный текст кликабельным нужно сделать из него гиперссылку и указать действие, которое будет совершено по клику (в нашем случае набор номера).
Для создания любых ссылок используется тег …. Между тегами располагается текст ссылки или картинка (например, иконка трубки). Атрибут href=“” указывает адрес ссылки или действие. Для набора номера используется параметр: tel:+7XXXXXXXXXX, где +7XXXXXXXXXX — нужный номер телефона.
Если доработать предыдущие примеры, то получится следующий код:
Теперь при нажатии на номер телефона будет совершаться набор указанного в ссылке номера. Именно тот, который указан в ссылке, а не в тексте, поэтому будьте внимательны! Проверяйте получившийся код в работе.
Зная, как устроен HTML-код вы легко сможете реализовать на любом движке или конструкторе.
В WordPress
Метод создания кликабельной ссылки на движке WordPress аналогичен пункту «HTML-код сайта» данной статьи. Главная задача в том, чтобы найти нужный фрагмент кода в админ-панели.
Как установить чат на сайт Тильда с возможностью ответа в Телеграм — Сервис Telegram feedback com
Шапка сайта
- Если телефон находится в шапке сайта, то заходим в административной панели: «Внешний вид» -> «Редактор».
- Справа, в Файлах темы находим «header.php», нажимаем на него.
- В коде находим телефон. Для быстрого поиска кликнете левой кнопкой мыши на поле с кодом и нажмите комбинацию на клавиатуре: “Ctrl” + “F”. Затем введите несколько цифр телефона и нажмите “Enter”. Нужный фрагменты станут выделены желтым цветом.
- Теперь остается обернуть простой текст в гиперссылку. Как это сделать смотрите в предыдущем пункте статьи.В данному случае получается по итогу так:
- Нажимаем “Обновить файл” и изменения сохраняются. Проверяем работоспособность на сайте. Готово!
Записи/страница
- Если телефон находится в записи, то переходим в редактор записи/страницы.
- Переходим в редактор кода, нажав на вкладку “Текст”:
- Выделяем номер и нажимаем кнопку “link”. В поле “URL” добавляем гиперссылку для номера:
- Нажимаем “Обновить” и страница сохраняется. Готово!
В Tilda
Zero-блок
- Переходим к редактированию блока, нажав на кнопку “Редактировать блок” в конструкторе нужной страницы:
- Выделяем телефон и нажимаем кнопку “Setting”:
- В поле Link в настройках вводим ссылку: “tel:+ номер телефона с +7”
- Сохраняем изменения в блоке и публикуем страницу.
Стандартный блок
- Нажимаем “Контент”:
- Находим нужный блок, выделяем телефон и нажимаем иконку “Ссылка”:
- Выбираем пункт: “Вставить ссылку”:
- В поле “URL” вводим “tel:+ номер телефона с +7” и нажимаем кнопку “Вставить”:
- Сохраняем изменения в блоке и публикуем страницу.
Активная ссылка на WhatsApp
Принцип точно такой же, как и с телефоном (смотрите предыдущий пункт данной статьи), отличие только в самой ссылке. Она будет выглядеть следующим образом:
Для размещения кликабельного текста на сайте подойдут все инструкции, как для телефонного номера.
Кликабельная иконка для сайта
Но обычно кликабельным делается не номер телефона, а специальная иконка WhatsApp. Для этого:
- Находим иконку, которую будем использовать. Для этого подойдет, например, сервис Flaticon.com.
- Выбираем подходящее по стилистике изображение. Кликаем на него, выбираем формат SVG.
- Дальше будет показан алгоритм действия, если сайт на Тильде. Если сайт на другой CMS, то нужно будет загрузить файл на хостинг и добавить небольшой HTML и CSS-коды на сайт, чтобы разместить иконку, например, в шапке. Для этого понадобятся минимальные знания верстки, либо помощь верстальщика.
- На Тильде переходим в редактирование Zero блока.
- Выбираем пункт добавить изображение и загружаем иконку.
- Масштабируем ее и размещаем в нужном месте блока.
- Добавляем в поле Link ссылку https://wa.me/номертелефона
- Сохраняем изменения в блоке и публикуем страниц сайта. Готово! Кнопка Whatsapp теперь кликабельная и сразу перенаправляет пользователя на диалог в мессенджере.
Ссылка на Telegram
С Телеграм тот же алгоритм действий, что и Whatsapp (смотрите предыдущий пункт данной статьи), но основное отличие в том, что в РФ, например стандартные ссылки в формате https://t.me/seoforge не работают. Поэтому необходимо использовать редирект через такие сервисы, как tele.gg, telegram.im и другие. Сервисы полностью бесплатны и существует большой список таких сервисов без сторонней рекламы, используйте именно их.
Ссылка будет выглядеть следующим образом.
Кликабельная почта E-mail
При клике на e-mail открывался почтовый клиент:
Кликабельный Skype
При клике на кнопку открывался чат в Skype с указанным пользователем пользователем:
Как добавить ссылку на телеграмм в тильде
Как добавить ссылки на соцсети и мессенджеры
Важно: ссылки на wa.me могут не работать в России без VPN, поэтому использовать данные ссылки не рекомендуется.
Не используйте символ плюса, скобки и дефиса при вводе номера телефона в международном формате.
Важно: ссылки будут работать только если у пользователя на устройстве установлено приложение Viber.
Обратите внимание, что в этой ссылке необходимо указать символ плюса «+» перед номером.
Обратите внимание, что в этой ссылке символ плюса «+» перед номером отсутствует.
Ссылка будет работать только если в аккаунте задано имя пользователя, указать ссылку на номер телефона нельзя.
Также вы можете просто скопировать ссылку на профиль из адресной строки браузера.
Как настроить отправку форм с Tilda в Telegram
Технологии и CMS
Для клиентов Странички
После нажатия [Пуск] вы увидите сообщение, содержащее ключ API и секретный ключ. Отправьте эту информацию вашему менеджеру в Страничке.
Как сделать самостоятельно
После нажатия [Пуск] вы увидите сообщение, содержащее ключ API и секретный ключ. Добавьте эту информацию на свою страницу Telegram на Тильде:
Перейдите в Настройки сайта> Формы> Telegram.
Добавьте в форму ключ API и секретный ключ, который вы получили от Telegram. Если у вас есть собственный домен или вы планируете его создать в будущем, перейдите в Общие настройки формы, где вы должны указать все параметры домена, в которых вы планируете разместить формы.
Если все сделано правильно, Telegram покажет сообщение «Источник данных Telegram добавлен в Тильду». Список получателей появится на вашем экране.
Перейдите на страницу с формой, откройте меню в блоке содержимого. Установите флажок рядом с Telegram, затем опубликуйте страницу. Ваша форма готова.
Если что-то не работает, убедитесь, что ваша страница открывается по тому же адресу, что и тот, который вы указали в настройках формы.
Похожие публикации:
- Как поменять значок telegram на андроид
- Как понять что голосовое в телеграмме прослушано
- Как распечатать с телеграмма документ
- Как скачать телеграмм премиум
Источник: gshimki.ru
Как подключить Telegram-чат к сайту на Tilda
Telegram — это мессенджер, который позволяет пользователям общаться между собой в режиме реального времени. Он также может быть использован для создания групповых чатов, где люди могут общаться по определенным темам или интересам. Если вы хотите подключить Telegram-чат к своему сайту на Tilda, это можно сделать с помощью виджета Telegram.
Создайте бота Telegram
Первым шагом к подключению Telegram-чата к вашему сайту на Tilda является создание бота Telegram. Чтобы создать бота, вы должны следовать этим шагам:
Создайте группу Telegram
После создания бота Telegram, вы должны создать группу, в которой будут происходить все обсуждения на вашем сайте. Следуйте этим шагам, чтобы создать группу:
- Запустите Telegram и нажмите на кнопку «+» наверху с правой стороны окна.
- Выберите опцию «New Group».
- Добавьте участников в группу (если это необходимо) и дайте ей название.
- После создания группы получите ее идентификатор, который нужно сохранить. Этот идентификатор будет использоваться для связи вашего сайта с группой Telegram.
Добавьте виджет Telegram на ваш сайт на Tilda
Теперь вы готовы добавить виджет Telegram на ваш сайт на Tilda. Следуйте этим шагам, чтобы добавить виджет:
- Запустите Tilda и перейдите на страницу, на которой вы хотите разместить виджет Telegram.
- Нажмите на кнопку «Add Block» и выберите «HTML-код».
- Вставьте следующий код в поле HTML-кода.
- Замените mytelegrambot на уникальное имя вашего бота Telegram.
- Сохраните изменения и опубликуйте ваш сайт на Tilda.
Похожие материалы:
Советы, как стать успешным пользователем купонов
Традиционно реклама с помощью купонов была отличным способом привлечения новых и удержания существующих клиентов. С помощью Интернета продвижение вашего бизнеса с помощью .
Где в Москве вкусно поесть и хорошо провести время?
Все люди хотя бы иногда посещают заведения общепита. Да, для кого-то обед в кафе является каждодневной практикой, а кто-то ходит в бар/ресторан только по особым случаям, но .
Как обрести счастье в личной жизни?
Одной из главных проблем современного общества по праву можно считать одиночество огромного количества людей, не способных найти свою вторую половинку. Связано это с .
Как удалить страницу в Facebook
Социальная сеть facebook знакома всем современным пользователям интернета. Можно смело сказать, что это самый популярный портал во всемирной паутине. Но, не смотря на то. Что .
Как выбрать лимузин напрокат?
Когда намечается торжественное событие, в особенности, свадьба, понадобится определенный вид транспортного средства, который отличается роскошным видом. Если говорить про лимузин, .
Источник: club-pilot.ru
Лучшие онлайн-чаты/консультанты для сайтов на Tilda
Виджет онлайн-чата на сайте на Тильде позволит вам напрямую общаться с вашими посетителями и быстро решать их проблемы. Это отличный способ увеличить конверсии и продажи вашего сайта! Только имейте ввиду, что добавление сторонних виджетов, каким являются онлайн консультанты, доступно только на платных тарифах (или на пробном периуде). Внизу статьи я добавил информацию о том, как вставить код консультанта на ваш сайт на Тильде.
3 лучших виджета для онлайн чата
Сhatra
- Поддержка чатов через Вконтакте, Facebook и Instagram.
- Чат-боты и триггеры
- Автоматическое переключение языков в зависимости от языка браузера
JivoSite
Один из самых первых и очень популярный виджет консультанта. Пользовался им раньше, претензий не имею.
Есть бесплатный тариф на одного оператора, а платные тарифы от 594 Р в месяц за агента. Видел, часто дают 20+% скидки, можете подловить их
- Поддержка чатов через ВКонтакте, Одноклассники, Viber, WhatsApp, Apple Business, Авито, Telegram и Алиэкспресс
- Чат-боты и триггеры
- Много полезных мелочей (например, вы можете показать посетителю, куда точно нажать на сайте указкой, а если пользуетесь Linux, даже для него есть приложение!)
CarrotQuest
Тяжелая артиллерия. Если вам нужен не только хороший виджет онлайн-консультанта, но и целая система сбора лидов на сайте, рекомендую посмотреть. Скопировали дизайн виджета у моего любимого западного сервиса, поэтому мне он очень нравится
Есть пробная версия на 7 дней. В отличие от вышеперечисленных сервисов стоимость рассчитывается в зависимости от количества посетителей в месяц, а не за агентов. Если у вас 1000 в мес, чат вы получите всего за 1033 Р на минимальном тарифе, 10 000 – 2398 Р , 30 000 – 4868 Р
- Поддержка чатов через ВКонтакте, WhatsApp, Telegram, Viber, Facebook, Instagram и почту
- Чат-боты и триггеры
- Включает в себя дополнительные инструменты как триггерные письма, попап окна и позволяет манипулировать этим всем связанно с друг другом
Другие онлайн чаты
Если вам не нравится моя подборка выше, что ж, на вкус и цвет…
Ниже я сделал полный список всех возможных чатов, поддерживающих русский язык. Там есть и простенькие, и целые “комбайны”, российские и зарубежные. Среди них вы теперь-то точно найдете для себя подходящий:
Envybox – не только чат, но и набор инструментов для продаж на сайте.
Talk-me – симпатичный виджет онлайн-чата и обратного звонка, есть бесплатный тариф.
CleverSite – хороший чат с современным дизайном.
Venyoo – чат с упором на автоматические ответы, оплата за лиды в месяц.
Сomagic – онлайн-консультант идет как дополнение к сквозной аналитике от 4900 Р /мес, также есть сервис колл-центра.
Callibri Мультичат – плата за посетителей, а не за агентов, пробная версия 7 дней.
Quickley – малофункциональный и дорогой сервис, для оплаты нужна Visa/MasterCard.
LiveChat – западный сервис с поддержкой русского языка, нужна Visa/MasterCard.
RedHelper – виджет и сайт немного устарели по дизайну, на любителя.
Mango-chat – чат с устаревшим дизайном, обратный звонок и опросы.
Кстати, я сделал подробный обзор на эти сервисы, если хотите больше информации о них.
Как вставить код онлайн чата в Тильду?
Итак, вы выбрали и зарегистрировались в одном из ваше указанных сервисов. Но как добавить код, который они вам дали, на ваш сайт?
1. Самый простой и оптимальный
Так, вы вставите код онлайн-консультанта на все страницы сайта:
Перейдите в “Редактировать сайт” → “Настройки сайта” → “Еще”.
Найдите там поле “Html-код для вставки внутрь HEAD” и вставьте туда код виджета.
2. Самый гибкий
Этот способ позволит вам добавить онлайн консультанта только на выбранных страницах:
При редактировании страницы добавьте новый блок T123 «HTML-код».
Если у вас есть страницы, которые являются шапкой или подвалом (они задаются в “Редактировать сайт” → “Настройки сайта” → “Шапка и подвал”), то вы можете добавить этот блок там, и тогда он появится на всех ваших страницах.
Если у вас нет страниц, заданных шапкой или подвалом вы можете создать новую пустую страницу, которая будет содержать только этот блок. И потом в тех настройках назначить эту страницу шапкой или подвалом.
Заключение
Онлайн чат – это отличный инструмент для увеличения продаж и сбора контактов на вашем сайте на Тильде. Надеюсь, вы выбрали уже подходящий.
Но, а если застряли в выборе, дам очень простой совет: попробуйте каждый понравившийся по неделе, и тогда уж точно станет понятно, какой вам больше подходит.
Успехов в увеличении продаж!
Источник: makedreamprofits.ru