Сайты с ИИ2026-08-038 минНатали Анарбаева

Как сделать сайт для телеграм-канала в 2026: визитка, посты, заявки

Как сделать сайт для телеграм-канала в 2026: визитка, посты, заявки

Сайт для телеграм-канала это обычная веб-страница вне мессенджера: на ней вы объясняете, о чём канал, показываете свежие посты официальным виджетом Telegram и ставите кнопку подписки. Собирается она за вечер, в том числе с помощью ИИ. Ниже четыре формата такой страницы, разбор того, что Telegram даёт официально (а что придётся делать руками), готовый промпт и цены на домен и хостинг в 2026 году.

Зачем каналу отдельная страница в интернете

У публичного канала веб-адрес уже есть: страница вида t.me/s/имя_канала открывается в браузере даже без установленного мессенджера. Но это страница Telegram, а не ваша. Заголовок, структуру и содержимое вы там не меняете, форму заявки не поставите, счётчик не подключите. Своя страница закрывает четыре задачи.

  • Понятный адрес. Домен вида имя.ru уместен на визитке, в подписи к письму и в объявлении, где ссылку на мессенджер принимают не всегда.
  • Место для того, что в канал не помещается. Прайс, портфолио, отзывы, условия работы: всё это в ленте тонет за неделю.
  • Точка сбора контактов. Заявка со страницы приходит вам в Telegram, а не теряется в личных сообщениях.
  • Аналитика. На своей странице стоит счётчик, вы видите источники переходов и нажатия. Внутри мессенджера такой картины нет.

Четыре формата страницы: выберите свой

Форматы разной сложности, и разница в трудозатратах примерно десятикратная.

  • Визитка канала. Один экран: о чём канал, для кого, что человек получит, кнопка «Подписаться». Самый быстрый вариант и правильная точка старта.
  • Страница с лентой постов. К визитке добавляется виджет Telegram с двумя-тремя свежими публикациями: человек видит живой канал ещё до перехода в мессенджер.
  • Страница с заявками в бота. Кроме подписки есть форма (заказ, запись, вопрос), и ответ падает вам в чат. Здесь появляется серверная часть.
  • Мини-приложение. Страница открывается прямо внутри Telegram. Это уже не сайт про канал, а сервис для подписчиков: каталог, запись, калькулятор.

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

Собрать страницу это половина дела. Вторая половина: довести её до вида, который не стыдно показать клиенту.

Занять место

Что Telegram даёт официально, а что придётся делать руками

Виджетов у Telegram ровно четыре: кнопка «Поделиться», виджет поста, виджет входа и виджет обсуждения (виджеты Telegram). Отдельной кнопки «Подписаться» среди них нет, и это первое, что стоит учесть при планировании страницы.

  • Виджет поста показывает конкретную публикацию из публичного канала или группы. Код выдаёт сам Telegram: откройте ссылку на пост в браузере и нажмите кнопку EMBED (документация).
  • Виджет обсуждения подтягивает на страницу комментарии под постом канала.
  • Виджет входа пускает человека на сайт через аккаунт Telegram. Работает только по HTTPS и требует заранее внести адрес сайта в список Allowed URLs в настройках бота (в BotFather раздел Bot Settings, пункт Web Login) (Login Widget).
  • Кнопка подписки делается обычной ссылкой https://t.me/имя_канала и оформляется как кнопка средствами вашей же вёрстки. Форматы ссылок описаны в документации (ссылки Telegram).

Код виджета поста выглядит так, менять в нём нужно только имя канала и номер публикации:

<script async src="https://telegram.org/js/telegram-widget.js?24"
        data-telegram-post="durov/43"
        data-width="100%"></script>

Здесь durov/43 это имя канала и номер поста (ровно то, что стоит после t.me/ в ссылке на публикацию), а data-width задаёт ширину блока. Автоматической ленты Telegram не отдаёт: если постов нужно несколько, вставляйте несколько таких блоков подряд и меняйте их по мере выхода новых публикаций.

Не ставьте на страницу десяток виджетов подряд. Каждый подгружает скрипт Telegram, и страница начинает открываться заметно медленнее. Три свежих поста дают тот же эффект «канал живой», остальное закрывает кнопка подписки.

Один сайт для своего канала обычно заканчивается вопросом «а что ещё я могу собрать сам». На бесплатном вебинаре по вайбкодингу разбираем этот путь на живых примерах и отдаём гайд в подарок.

Смотреть бесплатно

Как собрать такую страницу с ИИ: пошагово

Порядок тот же, что при сборке любой страницы вайб-кодингом, плюс два телеграмных шага.

  1. Соберите содержимое заранее. Название канала, одна фраза о теме, три-четыре причины подписаться, ссылки на два-три сильных поста, контакт. Нейросеть не придумает за вас, чем канал полезен.
  2. Опишите задачу одним абзацем и попросите вёрстку на чистом HTML и CSS без внешних библиотек: такую страницу можно выложить куда угодно.
  3. Отдельно попросите оставить место под виджет: «оставь в разметке пустой блок с комментарием TELEGRAM_WIDGET, код виджета я вставлю сам». Иначе ИИ придумает несуществующий скрипт.
  4. Вставьте код из кнопки EMBED в этот блок и откройте страницу в браузере. Посты должны подгрузиться за секунду, пустое место значит опечатку в имени канала.
  5. Проверьте на телефоне. Основная аудитория придёт по ссылке из мессенджера, то есть с узкого экрана.
  6. Выложите страницу и поставьте ссылку в описание канала и в закреплённый пост. Без этого шага её не увидит никто.

Промпт можно давать целиком, одним куском: «Собери одностраничный сайт на чистом HTML и CSS для телеграм-канала о домашней выпечке. Первый экран: название канала, описание в одну строку, кнопка «Подписаться» со ссылкой на канал. Дальше блок «О чём канал» из четырёх карточек, блок «Свежие посты» с пустым местом и комментарием TELEGRAM_WIDGET внутри, блок с формой (имя и вопрос), футер с контактами. Вёрстка мобильная, шрифты системные, без внешних библиотек».

По теме: Как сделать сайт в Телеграме в 2026: Mini App, бот и визитка

Заявки со страницы: как они попадают в Telegram

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

Если серверную часть заводить не хочется, остаются два обходных пути.

  • Кнопка вместо формы. Ссылка https://t.me/имя_бота?start=sayt открывает чат с ботом, а параметр после start подскажет вам, что человек пришёл именно со страницы. Параметр стартовой ссылки описан в документации (ссылки Telegram).
  • Готовая форма стороннего сервиса с уведомлением в Telegram. Настраивается без кода, но грузится дольше и выглядит чужеродно на вашей вёрстке.

Где разместить и сколько это стоит

Страница канала это статика, поэтому в большинстве случаев платить не за что.

  • Бесплатный хостинг. GitHub Pages держит сайт до 1 ГБ, мягкий лимит трафика 100 ГБ в месяц и выдаёт сертификат HTTPS без настройки (лимиты GitHub Pages). Адрес будет вида имя.github.io, и для ссылки в описании канала этого достаточно.
  • Свой домен. С 1 января 2026 года базовая цена регистрации домена в зоне .RU составляет 199 ₽, продление 399 ₽ (изменение цен). Брать его стоит, когда ссылка идёт в рекламу, на визитку или в офлайн.
  • Платный хостинг. Понадобится только с появлением серверной части: приём заявок своим кодом, личный кабинет, оплата.

HTTPS нужен в любом случае: без него не работает виджет входа, и позже вы не превратите эту же страницу в мини-приложение, потому что Telegram принимает от приложения только HTTPS-адрес (Telegram Mini Apps). На бесплатных площадках сертификат выдаётся сам.

По теме: Как сделать пароль на сайте в 2026: закрыть сайт или страницу

Частые ошибки

  • Кнопки подписки нет на первом экране. Человек пришёл посмотреть на канал и ищет ссылку глазами.
  • Посты вставлены скриншотами вместо виджета. Картинки устаревают за неделю и не кликаются.
  • Попытка встроить пост из закрытого канала. Виджет работает только с публичными каналами и группами, у приватного кнопки EMBED просто не будет.
  • Ссылка вида tg:// вместо https://t.me/.... На компьютере без установленного мессенджера она никуда не ведёт.
  • Ни слова о пользе. «Подписывайтесь на мой канал» это не причина подписаться, причина это конкретика: что человек получит и как часто.

Частые вопросы

Можно ли сделать сайт для канала бесплатно?

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

Чем страница канала отличается от сайта внутри мессенджера?

Страница канала живёт в интернете и открывается в браузере, её можно дать любому человеку. Сайт внутри Telegram это мини-приложение, привязанное к боту и открывающееся только в мессенджере. Разницу и требования мы разбирали в статье, как сделать сайт в Телеграме.

Виджет сам покажет всю ленту канала?

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

Нужен ли бот, если мне хватит кнопки подписки?

Нет. Бот обязателен для формы заявок, входа через Telegram и мини-приложения. Для визитки канала с кнопкой и виджетами постов достаточно самого канала.

Сколько времени занимает первая версия?

Вечер, если текст готов заранее. Больше всего времени уходит не на вёрстку, а на формулировку: чем канал полезен и почему на него стоит подписаться.

Страница для канала это первый практичный сайт, который собирается за вечер и сразу идёт в дело. На воркшопе «Сайты с ИИ» показываем весь путь: от промпта до опубликованного адреса, который не стыдно поставить в описание канала.

Занять место
Разборы, кейсы и фишки вайбкодинга каждую неделю в телеграм-канале «Яков вайбкодит».
Первый проект с ИИ: живой разбор, бесплатно Занять место