Как изменить текст в сети в Телеграмме печатает через бота

Всем — привет. Давно зрела идея разобраться с отправкой данных из формы на сайте в мессенджер Telegram, но руки не доходили, а моментально получать заявки прямо в телефон, ой как хотелось!

И вот, наконец-то посидел и разобрался. Конечно постичь все тонкости API — не удалось, но по кусочкам насобирал информацию и удалось отправить данные из контактной формы в чат Telegram.

Это актуализированная статья, в которой решены такие проблемы, как отправка фото и пропадающий символ «+», который не приходил в сообщение и из-за этого номер телефона был некликабельным. Появилась возможность не просто отправлять 1 фото, а сразу несколько файлов, в том числе PDF, docx и любых других.

Как отправить данные формы на сайте в Telegram

Как связать форму с Telegram

  • Пишем команду /newbot, для создания нового бота.
  • Придумываем имя бота.
  • Придумываем ник бота.

Создание бота в Телеграм

Если все прошло успешно, то увидите поздравления и токен вашего бота, в моем случае это:

Активация бота в Telegram

После этого можно пойти двумя путями:

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

Давайте займемся этим и, пока, пойдем по первому пути.

Зайдите в меню, нажмите «New Group» («Создать группу») и задайте имя вашему чату.

Создание чата для приема заявок

Не забываем пригласить своего бота в чат. Откройте меню чата, перейдите в «Add Members» («Добавить участников») и введите имя своего бота.

Добавление бота в чат для приема заявок

На данный момент у нас есть бот, мы знаем его токен, есть чат, в который будут приходить заявки, и нам осталось узнать только id чата. Для этого, напишем в чате:

А затем перейдите в браузер, если используете приложение и введите:

https://api.telegram.org/botXXXXXXXXXXXXXXXXXXXXXXX/getUpdates

где, XXXXXXXXXXXXXXXXXXXXXXX — токен вашего бота, полученный ранее.

Если все сделали правильно, то перед вами откроется подобная страница:

получение id чата в Телеграм

Разметка формы

Не стал выдумывать что-то сверхсложное, а просто 2 поля и возможность прикрепить файл. Оставил телефон, ведь у многих возникала проблема с символом «+», а файл добавил, так как меня просили разобраться с этой темой, при этом, теперь можно вставлять несколько штук.

Добавил стили — получилось примерно так (внешний вид в исходнике немного отличается):

Отправка формы в Телеграм

Не забывайте, что форма отправляется без перезагрузки страницы, а значит используется ajax, и, для упрощения, jQuery. Поэтому подключаем сам jQuery, если не подключен, а после, и сам скрипт. Я сделал специальную папку telegramform, которую нужно поместить в корень сайта. Если нужно, сделаю исходник без использования jQuery.

Еще по теме:  Где на Редми могут храниться фото с Телеграмма

Код с AJAX запросом. Файл — telegramform.js

(function ($) < $(«.contact-form»).submit(function (event) < event.preventDefault(); // Сообщения формы let successSendText = «Сообщение успешно отправлено»; let errorSendText = «Сообщение не отправлено. Попробуйте еще раз!»; let requiredFieldsText = «Заполните поля с именем и телефоном»; // Сохраняем в переменную класс с параграфом для вывода сообщений об отправке let message = $(this).find(«.contact-form__message»); let form = $(«#» + $(this).attr(«id»))[0]; let fd = new FormData(form); $.ajax(< url: «/telegramform/php/send-message-to-telegram.php», type: «POST», data: fd, processData: false, contentType: false, beforeSend: () =>< $(«.preloader»).addClass(«preloader_active»); >, success: function success(res) < $(«.preloader»).removeClass(«preloader_active»); // Посмотреть на статус ответа, если ошибка // console.log(res); let respond = $.parseJSON(res); if (respond === «SUCCESS») < message.text(successSendText).css(«color», «#21d4bb»); setTimeout(() =>< message.text(«»); >, 4000); > else if (respond === «NOTVALID») < message.text(requiredFieldsText).css(«color», «#d42121»); setTimeout(() =>< message.text(«»); >, 3000); > else < message.text(errorSendText).css(«color», «#d42121»); setTimeout(() =>< message.text(«»); >, 4000); > > >); >); >)(jQuery);

А теперь сам обработчик нашей формы. Файл — send-message-to-telegram.php:

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

Тут стоит обратить внимание на константы TOKEN и CHATID. Не забывайте подставить туда свои данные. Чтобы принимать какой-то определённый тип файла, поместите его в «Массив допустимых значений типа файла.» Из популярных можно выделить:

Вот так выглядит отправка сообщения:

Отправка файла из формы в Телеграм

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

Источник: smartlanding.biz

Как написать статью в приложении Телеграф и добавить пост в Телеграме

Как написать статью в приложении Телеграф и добавить пост в Телеграме

Приложение Telegram давно вышло за рамки обычного мессенджера. В социальной сети содержится много полезных инструментов для обучения, бизнеса, блогинга. В конце 2016 года появился сервис для создания контента больших размеров – Телеграф. Программный продукт позволяет писать объемные тексты со вставками изображений, ссылками на видеоролики. Как пользоваться Телеграфом в Телеграме, что он собой представляет, узнаем ниже.

Что такое Telegraph и для чего он нужен?

Телеграф

Сервис создан для публикаций различного контента на основе веб-языка markdown, что позволяет делать их легковесными. Размер публикуемого материала может быть неограничен, поэтому инструмент является оптимальным решением для создания лонгридов. В Телеграфе есть возможность подачи информации в том же формате, что и СМИ:

  • изменение стиля шрифта;
  • маркированные или пронумерованные списки;
  • вставка цитат;
  • добавление иллюстраций;
  • трансляция видео.
Еще по теме:  Как вернуть закрепленное сообщение в Телеграмме чужой группе

Внешне контент Telegraph в Telegram не имеет отличий от материалов, размещенных СМИ на веб-ресурсах. Для блогеров на платформе сохраняется анонимность.

С помощью редактора можно сделать объемную статью по правилам верстки на отдельной веб-странице с картинками, анимацией и видео. Готовый материал становится похож на статью в блоге. В программе не требуется регистрация. Пользователь может лишь привязать контент к боту для контроля статистики.

Какие возможности для блогеров открывает новая платформа?

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

maxresdefault

Заголовки

Это важнейшая часть текста, благодаря которой читатель решает, прочитать ему материал или нет. С ними текст воспринимается легче. Заголовки и подзаголовки передают суть содержания текста, при этом пользователю легче выбрать, какую часть текста он желает прочитать.

1

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

В материале оглавление выглядит следующим образом: автор размещает слово «Содержание» в начале публикуемого материала, а под ним – заголовки.

Шрифт

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

Цитаты

В Telegraph можно использовать цитаты. Оформляются они в двух вариантах. Чтобы переключить вид, достаточно выделить текст, после тапнуть по значку цитаты (две запятые в левой части). Если щелкнуть по тексту одним кликом мыши, шрифт выделится курсивом. Слева появится сплошная вертикальная полоса. При двойном нажатии на цитату текст выделится курсивом и разместится по центру.

3

Медиа

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

2

Чтобы поделиться видео с веб-каналов, нужно тапнуть по значку «<>» в нижней части экрана. Далее добавить ссылку на видеоролик. (Рис №2)

Списки

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

Еще по теме:  Автоматический кик неактивных пользователей ТГ

Обычно нумерация в публикации ставится путем добавления цифры в начале текста. Маркером служит небольшая точка или тире перед началом текста.

Начало пользования программой

Для пользования сервисом не требуется скачивание Телеграма или регистрация. Достаточно перейти на сайт: www.telegra.ph. Пользователю открывается окно с тремя пунктами:

Screenshot_8

  1. Your name – автор может вписать в строку свое имя, псевдоним или оставить ее незаполненной, сохранив анонимность.
  2. Title – заголовок поста. Формируется с датой публикации и ссылкой. Благодаря ей пользователь сможет работать с текстом и на других ресурсах.
  3. Your store – поле, предназначенное для формирования текста. Алгоритм создания контента примитивен и понятен, даже у начинающих авторов проблем с этим не возникнет.

Уникальная ссылка позволяет работать с материалом на сторонних ресурсах. Для редактирования текста нужно сохранить файл cookie.

Как написать статью с помощью Телеграфа?

Новую статью юзер может набрать вручную в окне «Your store» или уже подготовленный материал вставить путем копирования в редактор. В первое поле нужно ввести заголовок статьи. При желании автор во вторую строку вводит имя или псевдоним. Далее пользователь приступает к работе с текстовым редактором.

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

Screenshot_9

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

После завершения редактирования материала автор нажимает кнопку «Publish», чтобы его опубликовать. Для дальнейшего редактирования можно воспользоваться кнопкой «Edit».

Добавление поста из Телеграма в приложение

Если автор желает поделиться пабликом из Telegram в Телеграфе, заново писать текст нет необходимости. Просто нужно переместить его в сервис. Далее следовать инструкции:

  • Нажать кнопкой мыши по тексту. Скопировать ссылку.

3

  • Вставить ссылку, нажать «Enter».
  • При переходе контент откроется в новом окне.

5

Если создать контент в редакторе Telegraph копированием не удается, это может быть связано с несколькими причинами:

  1. Приватность канала. Скопировать текст пользователь может только с публичного сообщества. С закрытого канала перенести публикацию невозможно.
  2. Чат должен иметь статус супергруппы.
  3. При копировании опроса голосование и результаты остаются заблокированы.

В Телеграфе можно скопировать пост голосовой записью.

Бот для Телеграфа

Пользователям мессенджера Telegram предоставлена возможность не только писать короткие посты, но и вести собственный блог с помощью редактора Телеграф. Благодаря удобной и многофункциональной платформе авторы могут создавать качественный контент, подобный публикациям в СМИ.

Источник: it-tehnik.ru

Рейтинг
( Пока оценок нет )
Загрузка ...