- Почему сборка на коде лучше стандартной сборки на Tilda
- Система заголовков H2, H3, H4
- Форматирование текста
- Этапы работы
- Таблицы с объединением строк
- Блок цитаты
- Блок изображения
- Блок видео
- CTA-баннер
- Технические блоки карточек
- Таблица с пагинацией внутри ячеек
- SEO-оптимизация
задаваемые
вопросы
Данная статья — это полная презентация всех технических блоков, доступных при сборке страниц на коде. Здесь вы увидите каждый элемент в действии: от заголовков и таблиц до интерактивного FAQ и встроенного видео. Всё, что описано ниже, работает из коробки на любом устройстве — без дополнительных скриптов, костылей и ручной подгонки.
Почему сборка на коде лучше стандартной сборки на Tilda
Переход на кодовую сборку решает сразу несколько критических проблем, с которыми сталкивается каждый, кто работал со стандартными блоками Tilda. Ниже собраны ключевые преимущества в сравнительной таблице.
| Параметр | Tilda (стандарт) | Сборка на коде |
|---|---|---|
| Заголовки | Только H1 и H2 | H1, H2, H3, H4 — корректные мета-теги |
| Абзацы | Не всегда в , Яндекс может не видеть | Каждый абзац в , Яндекс корректно индексирует |
| Адаптивность | Требует подстраивания, ломается на нестандартных разрешениях | Полный адаптив на все разрешения без танцев с бубном |
| Дополнительные скрипты | Много дополнительного кода на странице | Нет лишних скриптов — чистый код |
| Микроразметка | Нужны костыли: CSS media, span и т.д. | Всё работает без принудительных стилей |
| Sidebar навигация | Не скроллится ровно, теряет позицию | Всегда ровно скроллится, показывает активный пункт |
| Бургер содержания (мобилка) | Плавает, перебивает меню | Фиксированная позиция, не конфликтует с меню |
| Попап содержания | Баг: видно на доли секунды при загрузке | Нет бага — попап скрыт до нажатия |
| Верстка попапа | Элементы скачут, не всегда видны полностью | Иконка закрытия и плашка статичны, пункты скроллятся, активный пункт подсвечен |
| Ссылки в тексте | Не всегда выделены, могут открываться в том же окне | Всегда выделены цветом, target=_blank, rel=nofollow |
| Отступы | Нестабильные, зависят от блока | Единая система 60/45/30px |
| Таблицы | Стандартный стиль, нет кастомизации | Кастомные стили, rowspan, списки в ячейках |
| Вес страницы | Стандартный | На 25–30% меньше |
Система заголовков H2, H3, H4
В сборке на коде поддерживается полная иерархия заголовков. Это критически важно для SEO — поисковые системы используют иерархию заголовков для понимания структуры страницы.
Подзаголовок H3 — второй уровень вложенности
Заголовки H3 автоматически определяются парсером по длине строки, позиции в тексте и контексту. Они не попадают в содержание (TOC), но создают визуальную структуру внутри секции.
H4 Заголовок четвёртого уровня
H4 используется для мелких подпунктов внутри H3-секций. Все уровни заголовков корректно обёрнуты в соответствующие мета-теги.
Форматирование текста
Жирный текстлегко выделяется в статье и сохраняется при генерации. Парсер корректно обрабатывает bold разметку из DOCX.
Ссылки в тексте всегда работают корректно. Например, hl-group.ru — ссылка откроется в новом окне с атрибутом nofollow. Цвет ссылки всегда акцентный для визуального выделения.
Этапы работы
Структура работает в несколько этапов. Каждый этап автоматизирован и не требует ручного вмешательства.
Этап 1. Загрузка кода и статьи
Пользователь загружает HTML-код и вносит данные статьи. Код определяет визуальный стиль, а статья — контент.
Этап 2. Парсинг и распознавание блоков
Парсер автоматически определяет заголовки, таблицы, FAQ, цитаты и технические метки. Вся структура статьи выстраивается за доли секунды.
Таблицы с объединением строк
Сборка на коде поддерживает сложные таблицы с объединёнными ячейками (rowspan). Это позволяет создавать структурированные данные без потери визуальной иерархии.
| Тип блока | Описание | Поддержка |
|---|---|---|
| Таблицы | Простые таблицы с заголовками | Полная |
| Таблицы с rowspan и списками в ячейках | Полная | |
| Карточки | Одна карточка (горизонтальная) | Полная |
| Две карточки (вертикальные) | Полная | |
| Три сервисные карточки | Полная |
Блок цитаты
Цитата поддерживает заголовок и многострочный текст. Заголовок отображается акцентным цветом, текст — основным.
Каждый блок проходит проверку на корректность разметки, адаптивность и совместимость с поисковыми системами. Мы не допускаем компромиссов в качестве кода.
Блок изображения
Изображения вставляются по метке и поддерживают увеличение по клику (zoom overlay). Адаптивная высота подстраивается под экран.
Блок видео
Видео поддерживает все основные платформы: RuTube, YouTube, VK Video, Дзен. Ссылки автоматически конвертируются в embed-формат.
CTA-баннер
Блок призыва к действию вставляется в любое место статьи. Дизайн и текст настраиваются через шаблон.
Технические блоки карточек
Доступны три варианта карточек для перелинковки и навигации по сайту.
Одна карточка
Горизонтальная карточка-ссылка. Изображение слева, текст справа. На мобильных — вертикальная.
Две карточки
Две вертикальные карточки в ряд. Изображение сверху, заголовок и кнопка «Подробнее» снизу.
Три сервисные карточки
Компактные карточки с иконкой для продвижения услуг.
Таблица с пагинацией внутри ячеек
Таблицы поддерживают списки внутри ячеек. Элементы автоматически конвертируются в маркированные списки.
| Поддерживаемые форматы | В разработке |
|---|---|
|
|
SEO-оптимизация
Каждая страница на коде имеет полный набор SEO-полей, которые заполняются при генерации:
Мета-теги страницы
Н1/Н2/Н3/Н4— заголовок, который видит поисковая система.
>- поисковая система распознает абзац
Частые вопросы о сборке на коде
Это способ создания страниц блога, при котором весь контент генерируется в виде чистого HTML-кода. Код вставляется в Tilda через блок T123 — без использования стандартных блоков конструктора.
Корректная SEO-разметка с полной иерархией заголовков H1–H4. Полный адаптив без ручной подгонки. Нет лишних скриптов и CSS-костылей. Вес страницы меньше на 25–30%. Sidebar и попап содержания работают без багов.
Нет. Вы пишете статью в обычном Word-файле, расставляете простые метки вроде
[ТАБЛИЦА]
или
[FAQ]
, загружаете файл в генератор — и получаете готовый код. Все технические детали обрабатываются автоматически.
RuTube, YouTube, VK Video, Дзен. Ссылки автоматически конвертируются в embed-формат. Также поддерживаются прямые ссылки на видеофайлы (mp4, webm).
Да. Генератор универсален — он работает с любым шаблоном. Достаточно создать новый шаблон с нужным дизайном, и тот же парсер будет генерировать страницы в другом стиле.
Внесите изменения в исходный DOCX-файл, загрузите его в генератор заново и замените код в блоке T123 на Tilda. Вся процедура занимает менее минуты.