Как сделать кнопку в Телеграме: инструкция по добавлению для бота на канале

Как добавлять кнопки в Телеграм-канале

Добавление кнопок в каналы Telegram осуществляется с помощью двух ботов. Первый, @ControllerBot, используется для создания сообщений через браузер и из интерфейса мобильного / компьютерного приложения, добавления канала и отслеживания статистики. С помощью второго — @BotFather — создайте бота для публикации. Добавление кнопок и реакций в каналы Telegram занимает всего две минуты, и мы познакомим вас с процессом ниже.

Создаём бота для канала: пошаговая инструкция

1. При поиске со своего компьютера или мобильной версии мессенджера введите имя бота «@ControllerBot».
   
2. Добавьте его в свои контакты и нажмите кнопку «Пуск», если вы никогда не использовали его раньше, или «Перезагрузить».
3. Выбираем команду «/ addchanel», чтобы добавить новый канал или вставить его вручную.
   
4. Нажмите кнопку «Подключить нового бота».
5. Следуйте инструкциям внутри @ControllerBot для бота @BotFather, чтобы создать нового бота.
   
6. Нажимаем кнопку «Старт».
7. Среди предложенных команд нажмите «/ newbot» или введите его самостоятельно в поле для вставки сообщения и отправьте, нажав кнопку «Ввод».
   
8. Задайте имя для нового бота в @BotFather, отправив ответное сообщение. Например, PostiumPost_Bot (подчеркивание перед словом «бот» обязательно).
   
9. Отправьте сообщение о завершении создания в @ControllerBot. Для этого щелкните правой кнопкой мыши текст сообщения и выберите в контекстном меню пункт «Переслать сообщение», затем найдите @BotController в диалоговых окнах и отправьте ему текст. Чтобы переслать сообщение со своего телефона, нажмите на сообщение и удерживайте палец, пока не появится контекстное меню, в котором вы выберите «Переслать».

Отлично. Половина работы выполнена успешно, итак: настройка бота создана.

Читайте также: Администраторы Telegram: боты, как стать админом

Настройка бота

Здесь тоже ничего сложного:

1. Вам нужно сделать только что созданного бота администратором канала. Сначала скопируйте его имя.
2. Зайдите на свой канал. Нажмите кнопку меню в виде трех точек и выберите «Управление каналом».
3. Откроется окно «Редактировать канал». Щелкните «Администраторы»
   
4. Введите логин созданного бота в строку поиска и выберите его из списка. Чтобы подтвердить его назначение администратору, нажмите «ОК».
   
5. Дайте ему права, как показано на картинке.
   
6. Находясь на своем канале, введите любое сообщение и отправьте его ControllerBot.
7. Появится уведомление о том, что канал подключен. В чате с ControllerBot нужно выбрать часовой пояс, для этого введите название своего города и нажмите «Исправить».

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

Инструкция по использованию

Опять же все просто:

1. Откройте диалоговое окно с созданным и настроенным ботом, в котором вы нажимаете «Выполнить». Вы можете использовать команду / start по своему усмотрению.
2. Нажмите «Создать сообщение» и выберите, на каком канале он будет опубликован.
3. Теперь сформируйте составные места. Порядок должен быть следующим: текст, изображение, реакции, кнопки (они же гиперссылки)
   
4. Чтобы загрузить изображение, нажмите «Прикрепить медиафайл» и выберите нужное на своем телефоне или ПК.
5. также легко добавить реакции. Делается это соответствующей кнопкой, после чего остается отправить смайлы, следуя рекомендациям. Используйте «/» для разделения реакций. Напишите желаемый текст рядом со смайликом. В одном посте не должно быть более шести смайлов.
   
6. Кнопки ссылок устанавливаются с помощью инструмента Добавить кнопки URL. Бот подскажет, как и что писать. Вкратце это выглядит так: «Кнопка 1 — ссылка на сайт (http://example.com). Для размещения кнопок в ряд (не более трех) используется разделитель: символ« | » Что произошло: отправьте его боту, чтобы посмотреть, как будет выглядеть результат.
   

Не забудьте и другие функции, например, «Удалить таймер». Этот инструмент позволяет вам создать временный пост, который будет удален через определенное время.

Чтобы опубликовать подготовленный пост на канале, нажмите «Опубликовать». Если вы хотите изменить время публикации, нажмите «Отложить».

Ссылка для перехода в Telegram

Код для встраивания HTML выглядит следующим образом:

Где вместо your_name нужно ввести имя вашей учетной записи. Вы можете просмотреть его, перейдя в Настройки / Имя пользователя.

Этот код — обычная ссылка, при нажатии на нее чат откроется в новом окне. А если добавить в этот код соответствующие стили, можно создать простую или фиксированную кнопку, например, в нижнем углу экрана.

Кнопка Telegram в углу экрана с анимацией

Чтобы создать нашу кнопку, нам понадобится значок Font Awesome. Для этого шаблон вашего сайта должен быть связан с библиотекой шрифтов Font Awesome. Если значок не отображается, эту библиотеку необходимо связать. Это можно сделать вручную или использовать плагин Font Awesome из репозитория WordPress.

HTML код:

Код CSS:

.telegram-button {положение: фиксированное; справа: 13 пикселей; внизу: 90 пикселей; преобразовать: перевести (-50%, -50%); фон: # 0088cc; / * цвет кнопки * / радиус края: 50%; ширина: 55 пикселей; / * ширина кнопки * / высота: 55 пикселей; / * высота кнопки * / color: #fff; выравнивание текста: по центру; высота строки: 53px; / * центрируем иконку в кнопке * / font-size: 35px; / * размер значка * / z index: 9999; } .телеграмма-кнопка a {color: #fff; } .telegram-button: до, .telegram-button: после {content: «»; блок отображения; позиция: абсолютная; край: 50%; граница: сплошная 1px # 0088cc; / * цвет анимированных волн по кнопке * / left: -20px; вправо: -20 пикселей; верх: -20 пикселей; внизу: -20 пикселей; радиус границы: 50%; анимация: 1.5с линейная бесконечная душа; непрозрачность: 0; обзор сзади: скрытый; } кнопка телеграммы: после {задержка анимации: .5 с; } @keyframes анимировать {0% {transform: scale (0.5); непрозрачность: 0; } 50% {непрозрачность: 1; } 100% {преобразование: масштаб (1.2); непрозрачность: 0; } }

Если вам нужно изменить положение кнопки на мобильном устройстве, добавьте следующий код в стили CSS.

@media (максимальная ширина: 800 пикселей) {.telegram-button {bottom: 5 px; / * отступ кнопок снизу экрана * / left: 70px; / * отступ кнопки слева от экрана (справа — справа)*/ } }

Установка кнопки на WordPress

В административной панели WordPress перейдите в раздел «Внешний вид / стиль / редактор тем». Затем, в зависимости от структуры вашей темы, перейдите к нужным файлам и добавьте код. Код HTML обычно помещается в файл footer.php (перед закрывающим тегом), а код CSS — в конец файла style.css.

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

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

Например, для вставки HTML подходят такие плагины, как «Snippet Woody», «Head & Footer Code», «DCO Insert Analytics Code» и т.п. А «Custom CSS» или «SiteOrigin CSS» подходят для добавления плагинов CSS».

вот и все! Если эта статья вам помогла, вы можете пожертвовать любую сумму на развитие сайта.

Как сделать пост с url-кнопкой и реакциями в Telegram

Сложности прошли, осталось разобраться в логике создания красивых публикаций через нашего бота:

1. Зайдите в созданный ранее бот. В нашем случае это @PostiumPost_Bot. Нажмите «Enter» или кнопку, показанную на скриншоте.
   
2. Нажимаем на кнопку «Создать пост» и выбираем канал, в котором будет опубликовано сообщение.
   
3. Мы отправляем желаемый контент в следующем порядке: текст, изображение, реакции, URL-кнопки.
   
4. Загрузите изображение, нажав кнопку «Прикрепить медиа» и выберите интересующее фото на своем ПК или смартфоне. Изображение будет прикреплено автоматически.
5. Добавьте отзывы к статье под изображением. Для этого нажмите «Добавить реакции» и отправьте смайлы согласно рекомендациям в боте Telegram. Разделитель смайлов — «/». В каждой строке можно разместить до трех отзывов. Вы можете написать текст рядом со смайликом.
   
6. Нажмите кнопку «Добавить кнопки URL». Следуя совету бота, одна или несколько кнопок. Вы можете добавить до 3-х кнопок в ряд. Они отделены друг от друга знаком «|» и выглядят так: «Кнопка — https://site.com/». Щелкните «Отправить».
7. Нажмите кнопку «Далее», чтобы получить доступ к настройкам публикации подготовленного сообщения.
   
8. Выбираем функции — «Удалить таймер» (сообщение будет автоматически удалено из канала по истечении указанного времени), «Опубликовать» — опубликовав пост в это время, «Отложить» — установив дату и время публикации. Нажмите «Опубликовать» и подтвердите публикацию сообщения.

Готовый! Пост был опубликован с отзывами, ссылками на сайт в виде кнопок и изображения.

Кнопка “Обсудить” (Discuss)

Кнопка «Обсуждение» доступна всем подписчикам канала и ведет в чат, связанный с каналом. У админов каналов нет этой кнопки по вполне логичным причинам (вместо кнопки есть текстовое поле для ввода). Чтобы привязать канал к чату, администратор должен иметь право изменять описание (в чате и на канале). Если ваша группа работает только по приглашениям, вы не хотите связывать их с каналом.

Как добавить чат к каналу

добавить кнопку «Обсуждение:» очень просто:

1. Зайдите в Telegram-канал, администратором которого вы являетесь, и нажмите на фото канала.
2. Нажмите «Изменить» или «Изменить».
3. Зайдите в раздел «Обсуждение».
4. Выберите чат, администратором которого вы являетесь, и нажмите «Подключить группу», тем самым добавив его в канал.

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

Как убрать чат из канала

Удалить чат так же просто, как добавить его: зайдите в настройки канала в разделе «Обсуждение», нажмите «Отменить связь с группой».

Как узнать, к какому каналу прикреплен чат

1. Зайдите в чат Telegram.
2. Нажмите на изображение канала в правом верхнем углу.
3. Нажмите «Изменить» или «Изменить.
4. В разделе «Связанный канал» вы можете увидеть каналы, к которым привязан чат. Здесь вы также можете отключиться от канала Telegram, нажав «Отключить канал».

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

«Пересылка постов» в чат

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