Готовые фреймы

Готовые фреймы выводят текст, списки, навигацию и секции страниц. Примеры вставки — в разделе «Готовые фреймы» гайда «Фреймы».

API — https://onpress.pro/api/v2, SITE — id сайта, OP_TOKEN — токен API. Адреса запросов и общие параметры — в общих правилах API, права — в авторизации.

Раздел	Содержание
Как читать каталог	вызов и параметры
Фреймы с текстом внутри	текст внутри фрейма
Фреймы одной строкой	вызов одной строкой
Фреймы шаблона	фреймы страниц и секций

Библиотека и установленный сайт могут содержать разные фреймы. Список фреймов с версиями отдает GET /frames/system, разметку одного фрейма — GET /frames/system/{ref}. Фрейм, которого нет на сайте, ставит POST /frames/system/{ref}/install, а на месте вставки отсутствующего фрейма страница выводит пустое место. Снимки на этой странице сделаны на демо-сайте шириной 1200 CSS-пикселей в светлой теме, на вашем сайте фрейм берет его шрифты, цвета и CSS-переменные.

Как читать каталог

Фрейм с текстом внутри вставляют парой строк:  открывает вставку,  закрывает ее, а Markdown между ними становится содержимым вставки. Фрейм одной строкой вставляют строкой . JSON после имени — параметры вызова, внутри фрейма они доступны как frame.<ключ>; ключи и строки пишите в двойных кавычках. Синтаксис вызова, служебные ключи и пределы вложения описывает справочник «Вставка фрейма».

Параметры в таблицах — это ключи JSON вызова. Тип string — строка, array — список, object — объект. Непустая строка, например "1", включает флаг; пустая строка или отсутствие параметра выключают его. Параметр source называет набор пользовательских данных или системные данные (pages.children, site.socials), из которых фрейм берет список, подробно — в справочнике «Повторитель». Прочерк в столбце «По умолчанию» значит, что без параметра фрейм не выводит соответствующий элемент.

Фреймы с текстом внутри

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

Фрейм	Что выводит	Содержимое вставки	Параметры
`steps`	нумерованные шаги	H3 — шаг, текст под ним — описание	`headline`
`faq`	вопросы и ответы списком	H3 — вопрос, текст под ним — ответ	`anchor`
`site__faq`	секция вопросов лендинга	H3 — вопрос, текст под ним — ответ	`title`
`callout`, `callout--info`, `callout--success`, `callout--warning`, `callout--destructive`	цветную врезку	любой Markdown	`title`, `icon`
`gallery`	сетку картинок	картинки Markdown	—
`howto`	шаги инструкции с разметкой `HowTo`	заголовок — шаг, текст под ним — описание	`title`, `anchor`

steps

steps выводит нумерованную инструкцию: номер в кружке, заголовок шага и описание под ним. Номера фрейм ставит сам, а заголовки шагов попадают в оглавление страницы. Строка вставки:

<!-- frame/steps {"headline":"Заголовок"} -->
### Шаг
Описание шага.
<!-- /frame -->

Параметр	Тип	Обязательно	По умолчанию	Описание
`headline`	string	нет	—	заголовок H2 над шагами, попадает в оглавление

Содержимое вставки фрейм делит на шаги по заголовкам H3: заголовок становится названием шага, текст до следующего H3 — описанием, в описании работает любой Markdown. Например:

<!-- frame/steps {"headline":"Как начать"} -->
### Создайте проект

Нажмите «Новый проект» и дайте ему имя.

### Пригласите команду

Откройте раздел «Участники» и отправьте приглашения.
<!-- /frame -->

faq

Фрейм faq: три вопроса, ответ открывается кликом

faq выводит вопросы списком, ответ посетитель открывает кликом, и добавляет вопросы на страницу разметкой FAQPage. Фрейм подходит для статей и документации. Строка вставки:

<!-- frame/faq -->
### Вопрос?
Ответ.
<!-- /frame -->

Параметр	Тип	Обязательно	По умолчанию	Описание
`anchor`	string	нет	`faq`	id секции для ссылки вида `#faq`

Содержимое вставки фрейм делит на пары «вопрос — ответ» по заголовкам H3. Если в содержимом нет ни одного вопроса, фрейм ничего не выводит. Например:

<!-- frame/faq -->
### Сколько это стоит?

Бесплатно на любом тарифе.

### Нужна ли карта?

Нет, карта нужна только для платного тарифа.
<!-- /frame -->

site__faq

site__faq выводит вопросы секцией лендинга на всю ширину: заголовок слева, вопросы справа. Вопросы попадают в разметку FAQPage. Строка вставки:

<!-- frame/site__faq {"title":"Вопросы и ответы"} -->
### Вопрос?
Ответ.
<!-- /frame -->

Параметр	Тип	Обязательно	По умолчанию	Описание
`title`	string	нет	—	заголовок H2 секции

Содержимое вставки устроено как у faq: H3 — вопрос, текст под ним — ответ. Например:

<!-- frame/site__faq {"title":"Частые вопросы"} -->
### Нужен ли аккаунт?

Нет, первые сообщения вы отправляете без регистрации.
<!-- /frame -->

callout

Фрейм callout--success: зеленая врезка «Готово»

Фрейм callout--warning: желтая врезка-предупреждение

Фрейм callout--destructive: красная врезка об опасном действии

Врезка — плашка с иконкой, заголовком и любым Markdown внутри: абзацами, списками, кодом. Цвет задает имя фрейма: callout — нейтральная, callout--info — информация, callout--success — успех, callout--warning — предупреждение, callout--destructive — опасное действие. Строка вставки:

<!-- frame/callout--info {"title":"Заголовок","icon":"lightbulb"} -->
Текст врезки.
<!-- /frame -->

Параметр	Тип	Обязательно	По умолчанию	Описание
`title`	string	нет	—	заголовок врезки
`icon`	string	нет	`info`	имя иконки из набора Material Symbols, например `lightbulb`, `bolt`, `warning`

Содержимое вставки — любой Markdown, фрейм выводит его под заголовком. Например:

<!-- frame/callout--warning {"title":"Проверьте перед отправкой","icon":"warning"} -->
В черновике могут быть неверные имена и даты.
<!-- /frame -->

gallery

gallery выводит сеткой картинки, которые вы вставили обычным Markdown. Подпись и alt фрейм берет из самой картинки. Параметров у фрейма нет. Строка вставки:

<!-- frame/gallery -->
![Описание](/media/2026/10/one.webp)
<!-- /frame -->

Содержимое вставки — картинки Markdown, каждая отдельным абзацем. Например:

<!-- frame/gallery -->
![Карандаш на блокноте](/media/2026/10/one.webp)

![Три ключа на кольце](/media/2026/10/two.webp)
<!-- /frame -->

howto

howto выводит шаги инструкции и добавляет на страницу разметку HowTo. Своего оформления у фрейма нет, вид задают стили сайта, поэтому снимка здесь нет. Строка вставки, параметры, содержимое и пример описывает раздел «Инструкция howto» справочника «Фреймы».

Фреймы одной строкой

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

Фрейм	Что выводит	Параметры
`alert--info`, `alert--success`, `alert--warning`, `alert--destructive`	уведомление с заголовком и строкой текста	`title`, `description`, `icon`
`cards`, `cards--cols-2`, `cards--single`	карточки-ссылки с иконкой	`data.items`
`link-cards`, `link-cards--children`, `link-cards--cluster`	простые карточки-ссылки	`data.items`, `source`
`buttons`	ряд кнопок	`data.items`
`tabs`	вкладки	`data.key`, `data.items`
`gallery--lightbox`	сетку картинок с увеличением	`data.items`
`video`	видеоплеер	`src`, `poster`, `preload`, `width`, `height`, `style`
`file`	ссылку на файл	`href`, `text`
`shortcut`	сочетание клавиш	`data.keys`, `data.text`
`faq-items`, `faq__schema`	вопросы из параметров, разметку `FAQPage` из набора	`data.items`, `source`
`page-list`, `plan-list`	список страниц или тарифов	`source`
`value`, `terms`, `featured-image`	значение поля, метки страницы, превью	`value`, `taxonomy`, `link`, `label`, `figure`

alert

Фрейм alert--warning: желтое уведомление о лимите

Фрейм alert--destructive: красное уведомление об ошибке оплаты

alert--info, alert--success, alert--warning и alert--destructive выводят плашку с иконкой, заголовком и коротким текстом без разметки. Цвет задает имя фрейма. Если внутри нужен абзац, список или ссылка, возьмите врезку. Строка вставки:

<!-- frame/alert--info {"title":"Заголовок","description":"Текст.","icon":"info"} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`title`	string	нет	—	заголовок
`description`	string	нет	—	текст под заголовком, без разметки
`icon`	string	нет	`info`	имя иконки Material Symbols

Например:

<!-- frame/alert--warning {"title":"Лимит почти исчерпан","description":"Осталось 3 запуска из 100 в этом месяце.","icon":"warning"} /-->

cards

cards выводит сетку карточек-ссылок с иконкой, заголовком и описанием: на широком экране по три в ряд, в узкой колонке текста по одной. cards--cols-2 ставит по две карточки в ряд, cards--single выводит одну карточку шириной до 480 CSS-пикселей. Строка вставки:

<!-- frame/cards {"data":{"items":[{"icon":"…","title":"…","description":"…","url":"…"}]}} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`data.items`	array	нет	—	карточки, у каждой поля ниже
`data.items[].icon`	string	нет	—	имя иконки Material Symbols
`data.items[].title`	string	нет	—	заголовок карточки
`data.items[].description`	string	нет	—	описание, без разметки
`data.items[].url`	string	нет	—	адрес ссылки

Например:

<!-- frame/cards--cols-2 {"data":{"items":[{"icon":"school","title":"Первый проект","description":"Пример от задачи до черновика.","url":"/docs/first-project/"},{"icon":"code","title":"API","description":"Проекты и запуски через HTTP.","url":"/docs/api/"}]}} /-->

link-cards

link-cards выводит простые карточки с одним заголовком-ссылкой, без иконки и описания. link-cards--children сам выводит дочерние страницы текущей страницы (pages.children) и параметров не принимает. link-cards--cluster берет ссылки из набора, который называет source, поэтому один список стоит на многих страницах, а правите вы его в одном наборе; пустой набор убирает фрейм целиком. Все три фрейма выглядят одинаково. Строка вставки:

<!-- frame/link-cards {"data":{"items":[{"title":"…","url":"…"}]}} /-->
<!-- frame/link-cards--children /-->
<!-- frame/link-cards--cluster {"source":"имя_набора"} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`data.items`	array	нет	—	у `link-cards`: карточки с полями `title` — заголовок и `url` — адрес
`source`	string	нет	—	у `link-cards--cluster`: набор, у элементов которого есть поля `title` и `url`

Например:

<!-- frame/link-cards {"data":{"items":[{"title":"Фреймы","url":"/docs/v2/ru/guides/frames/"},{"title":"Поля данных","url":"/docs/v2/ru/guides/frames/data-fields/"}]}} /-->

buttons

buttons выводит ряд кнопок-ссылок. Вид кнопки задают классы из стилей сайта, иконка встает после текста. Строка вставки:

<!-- frame/buttons {"data":{"items":[{"text":"…","link":"…","class":"btn","icon":"…"}]}} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`data.items`	array	нет	—	кнопки, у каждой поля ниже
`data.items[].text`	string	нет	—	надпись
`data.items[].link`	string	нет	—	адрес
`data.items[].class`	string	нет	—	классы кнопки, например `btn btn--icon-after` или `btn btn--outline`
`data.items[].icon`	string	нет	—	имя иконки Material Symbols

Например, залитая кнопка со стрелкой и контурная:

<!-- frame/buttons {"data":{"items":[{"text":"Начать бесплатно","link":"/signup/","class":"btn btn--icon-after","icon":"arrow_forward"},{"text":"Тарифы","link":"/pricing/","class":"btn btn--outline"}]}} /-->

tabs

tabs выводит вкладки, посетитель переключает их без перезагрузки страницы. Текст всех вкладок стоит в разметке страницы, поэтому поисковик видит его целиком. Строка вставки:

<!-- frame/tabs {"data":{"key":"…","items":[{"id":"…","label":"…","content":"…"}]}} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`data.key`	string	нет	—	ключ блока вкладок, уникальный на странице
`data.items`	array	нет	—	вкладки, у каждой поля ниже
`data.items[].id`	string	нет	—	ключ вкладки латиницей
`data.items[].label`	string	нет	—	подпись на переключателе
`data.items[].title`	string	нет	—	заголовок в панели
`data.items[].description`	string	нет	—	описание в панели
`data.items[].content`	string	нет	—	текст панели, строчный Markdown
`data.items[].trigger_id`, `data.items[].panel_id`	string	нет	—	id переключателя и панели: `<key>-trigger-<id>` и `<key>-panel-<id>`
`data.items[].trigger_class`	string	нет	—	`basic-tabs__trigger`, у открытой вкладки еще `basic-tabs__trigger--active`
`data.items[].selected`, `data.items[].tabindex`	string	нет	—	у открытой вкладки `"true"` и `"0"`, у остальных `"false"` и `"-1"`
`data.items[].hidden`	string	нет	—	`"hidden"` у всех вкладок, кроме открытой

Например, две вкладки, первая открыта:

<!-- frame/tabs {"data":{"key":"start","items":[{"id":"web","label":"Браузер","title":"В браузере","content":"Вы открываете проект по ссылке без установки.","trigger_id":"start-trigger-web","panel_id":"start-panel-web","trigger_class":"basic-tabs__trigger basic-tabs__trigger--active","selected":"true","tabindex":"0"},{"id":"api","label":"API","title":"Из кода","content":"Каждому запросу нужен токен.","trigger_id":"start-trigger-api","panel_id":"start-panel-api","trigger_class":"basic-tabs__trigger","selected":"false","tabindex":"-1","hidden":"hidden"}]}} /-->

Фрейм gallery--lightbox: сетка из трех картинок

gallery--lightbox выводит сетку картинок по три в ряд и по клику открывает картинку во весь экран. Картинки, вставленные обычным Markdown, оформляет gallery. Строка вставки:

<!-- frame/gallery--lightbox {"data":{"items":[{"img":"…","alt":"…","width":"…","height":"…"}]}} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`data.items`	array	нет	—	картинки, у каждой поля ниже
`data.items[].img`	string	нет	—	адрес картинки
`data.items[].alt`	string	нет	—	описание картинки
`data.items[].width`, `data.items[].height`	string	нет	—	размеры в пикселях, убирают сдвиг верстки при загрузке

Например:

<!-- frame/gallery--lightbox {"data":{"items":[{"img":"/media/2026/10/one.webp","alt":"Карандаш на блокноте","width":"1376","height":"768"},{"img":"/media/2026/10/two.webp","alt":"Три ключа на кольце","width":"1376","height":"768"}]}} /-->

video

video выводит плеер для видеофайла из медиатеки. Строка вставки:

<!-- frame/video {"src":"…","poster":"…"} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`src`	string	нет	—	обязательно; адрес видеофайла
`poster`	string	нет	—	картинка до запуска
`preload`	string	нет	—	`none`, `metadata` или `auto`; без параметра решает браузер
`width`, `height`	string	нет	—	размеры ролика в пикселях
`style`	string	нет	—	стиль плеера, например `aspect-ratio: 640 / 480;`, чтобы место под ролик было с первой отрисовки

Например:

<!-- frame/video {"src":"/media/2026/10/demo.mp4","poster":"/media/2026/10/demo.png","width":"640","height":"480","style":"aspect-ratio: 640 / 480;"} /-->

file

file выводит ссылку на скачивание файла. Строка вставки:

<!-- frame/file {"href":"…","text":"…"} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`href`	string	нет	—	адрес файла
`text`	string	нет	—	подпись ссылки

Например:

<!-- frame/file {"href":"/media/2026/10/price-list.pdf","text":"Прайс-лист, PDF"} /-->

shortcut

shortcut выводит клавиши тегами <kbd> и пояснение рядом. Вид клавиш задают стили сайта. Строка вставки:

<!-- frame/shortcut {"data":{"keys":["…"],"text":"…"}} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`data.keys`	array	нет	—	клавиши, каждая строкой
`data.text`	string	нет	—	пояснение после клавиш

Например:

<!-- frame/shortcut {"data":{"keys":["⌘","K"],"text":"открывает меню команд."}} /-->

faq-items и faq__schema

Фрейм faq-items: два вопроса со значком плюса

faq-items выводит вопросы из параметров и добавляет их в разметку FAQPage. Щелчок по вопросу показывает ответ. Вопросы, которые вы пишете заголовками в тексте страницы, оформляет faq. faq__schema ничего не показывает на странице, а только добавляет в FAQPage вопросы этой страницы из набора source: фрейм берет элементы, у которых поле page равно слагу страницы, вопрос — из поля q, ответ — из поля a. Строка вставки:

<!-- frame/faq-items {"data":{"items":[{"question":"…","answer":"…"}]}} /-->
<!-- frame/faq__schema {"source":"имя_набора"} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`data.items`	array	нет	—	у `faq-items`: вопросы с полями `question` и `answer`, текстом без разметки
`source`	string	нет	—	у `faq__schema`: набор с полями `page`, `q` и `a`

Например:

<!-- frame/faq-items {"data":{"items":[{"question":"Можно ли перенести проект?","answer":"Да, вместе со всеми файлами."},{"question":"Нужна ли карта?","answer":"Нет, только для платного тарифа."}]}} /-->

page-list и plan-list

Фрейм page-list: список ссылок на страницы

page-list выводит список ссылок из источника source: из системных данных, например дочерних страниц pages.children или соседних pages.siblings, или из набора с полями title и url. plan-list выводит тарифы списком строк «название — цена за период, для кого» из набора с полями name, amount, per и audience; своего оформления у него нет, поэтому снимка здесь нет. Строка вставки:

<!-- frame/page-list {"source":"pages.children"} /-->
<!-- frame/plan-list {"source":"имя_набора"} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`source`	string	нет	—	источник списка

Например:

<!-- frame/page-list {"source":"pages.siblings"} /-->

value, terms и featured-image

Эти фреймы выводят одно значение страницы без своей верстки, поэтому снимков у них нет. value выводит текстом одно поле данных, например page.data.version или site.name. terms выводит метки страницы из таксономии списком, данные берет из pages.terms. featured-image выводит превью страницы картинкой <picture> и ничего не выводит, если превью нет, данные берет из pages.featured_image. Строка вставки:

<!-- frame/value {"value":"page.data.version"} /-->
<!-- frame/terms {"taxonomy":"topic","link":"1","label":"Рубрика:"} /-->
<!-- frame/featured-image {"figure":"1"} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`value`	string	нет	—	у `value`: имя поля данных
`taxonomy`	string	нет	`category`	у `terms`: таксономия меток
`link`	string	нет	—	у `terms`: `"1"` — метки ссылками, `"0"` — текстом
`label`	string	нет	—	у `terms`: подпись перед списком
`figure`	string	нет	—	у `featured-image`: флаг, оборачивает картинку в `<figure>` с подписью из медиатеки
`img_class`, `picture_class`	string	нет	—	у `featured-image`: классы `<img>` и `<picture>`
`loading`, `fetchpriority`	string	нет	`lazy`, —	у `featured-image`: атрибуты `<img>`
`link`	string	нет	—	у `featured-image`: флаг, картинка становится ссылкой на страницу

Фреймы шаблона

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

Фреймы страниц

Фрейм страницы обрамляет страницу целиком: вокруг текста страницы он ставит шапку, подвал и все остальное. Задайте его свойством frame в свойствах страницы или полем frame в PATCH /pages/{ref}. Параметров вызова у фреймов страниц нет, текст страницы они берут из page.content. Например:

---
name: "Как начать"
url: "/blog/kak-nachat/"
frame: "article"
---

Фрейм	Что выводит
`article`	статью: шапку, заголовок, подпись автора при свойстве `author: 1`, текст, вопросы из набора `faq`, оглавление справа, подвал
`docs`	документацию: дерево разделов слева, текст, оглавление справа
`headless`	страницу ассистента без шапки: чат над статьей, подпись автора, кнопки «Поделиться», вопросы, оглавление
`landing--home`, `landing--about`, `landing--feature`, `landing--pricing`, `landing--contact`, `landing--wall`	лендинги: шапку, текст страницы во всю ширину, подвал
`landing--news`, `news`, `news__category`, `news__post`	ленту новостей, рубрику и одну новость
`landing--changelog`, `changelog`, `changelog__post`	ленту изменений и одну запись
`site__404`	страницу «не найдено»

article

docs

headless

Лендинги

Фреймы лендингов выводят шапку, текст страницы во всю ширину и подвал. Каждая оболочка задает свои классы, от которых стили сайта считают отступы и фон секций. Секции страницы вы пишете в ее тексте вставками фреймов из раздела «Секции лендинга».

Фрейм landing--about: страница о компании

Фрейм landing--feature: страница возможности

Фрейм landing--pricing: страница тарифов

Фрейм landing--contact: страница контактов

Новости

landing--news — оболочка страницы ленты: шапка, текст страницы и подвал, а саму ленту выводят вставки в тексте. news выводит ленту новостей из наборов news_posts и news_cats сам, с заголовком и описанием страницы над ней, news__category — ленту одной рубрики, news__post — страницу новости с автором, кнопками «Поделиться» и оглавлением. Страниц на news и news__category на демо-сайте нет, поэтому их снимков здесь нет.

Изменения

landing--changelog — оболочка страницы ленты изменений, саму ленту выводит вставка в тексте страницы. changelog выводит ленту из набора changelog сам, с заголовком и описанием страницы над ней, changelog__post — страницу одной записи. Страниц на changelog на демо-сайте нет, поэтому его снимка здесь нет.

Фрейм landing--changelog: лента изменений

Фрейм changelog__post: страница записи об изменениях

site__404

site__404 выводит страницу «не найдено»: шапку, название и текст страницы /404/, подвал.

Шапка и подвал

site__header и site__footer выводят шапку и подвал, их вкладывают фреймы страниц. Параметров вызова у них нет, тексты и ссылки они берут из данных сайта.

Фрейм site__header: шапка с логотипом, меню и кнопками

site__header берет логотип и подписи из набора header (logo_url, logo_alt, logo_text, logo_link, btn_primary, btn_secondary и другие), а пункты меню — из меню menu.header. Над шапкой фрейм выводит site__announce.

Фрейм site__footer: подвал с логотипом, колонками ссылок и копирайтом

site__footer берет тексты из набора footer, колонки ссылок — из меню menu.footer_1, menu.footer_2 и menu.footer_3, соцсети — из поля socials того же набора. Над подвалом фрейм выводит site__cta.

Объявление, призыв и cookies

Эти фреймы стоят внутри шапки и подвала, а включаете вы их данными, а не вызовом.

Фрейм	Что выводит	Как включить	Поля набора
`site__announce`	полосу объявления над шапкой, посетитель закрывает ее крестиком	элемент набора `announce` с `enabled: 1`	`text`, `link_label`, `link_url`, `close_label`
`site__cta`	призыв к действию над подвалом	свойство страницы `cta: 1` и элемент набора `cta` с `show: 1`	`eyebrow`, `title`, `text`, `buttons` (`label`, `url`, `class`)
`site__cookies`	плашку согласия на cookies	набор `cookies` с одним элементом	`title`, `text`, `policy_label`, `policy_url`, `accept_label`, `decline_label`
`site__lightbox`	просмотр картинок во весь экран	подписи кнопок в наборе `lightbox`	`close_label`, `prev_label`, `next_label`

Фрейм site__cta: призыв к действию над подвалом

Фрейм site__cookies: плашка согласия на cookies

Пока на странице есть плашка site__cookies, страница не загружает Яндекс Метрику и Google Analytics 4 до нажатия «Принять». У site__announce и site__lightbox снимков нет: объявление на демо-сайте закрыто шапкой, а просмотр картинок появляется только по клику.

Служебные фреймы страниц

Фреймы страниц вкладывают еще три служебных фрейма. site__outline выводит оглавление по заголовкам H2 и H3 и сворачивает подразделы, site__prose задает оформление текста страницы и своей разметки не имеет, site__pager выводит номера страниц под лентой из набора pager.

Пейджер, оглавление и ссылки на ИИ

Эти фреймы выводят части страницы документации и статьи. Разметка у них открытая: установите фрейм на сайт и правьте его, как любой другой. Фреймы читают системные данные, поэтому правка текста страницы или ее соседей запускает пересборку зависимых страниц.

pager выводит ссылки на предыдущую и следующую страницы в порядке дерева документации. У страницы без соседей фрейм ничего не выводит. Строка вставки:

<!-- frame/pager {"root":"/docs/v2/ru/guides/,/docs/v2/ru/reference/"} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`root`	string	нет	—	корни разделов через запятую, адреса или id; соседи ищутся внутри раздела страницы
`prev_label`	string	нет	«Назад» на языке страницы	подпись ссылки назад
`next_label`	string	нет	«Далее» на языке страницы	подпись ссылки вперед
`label`	string	нет	«Страницы документации» на языке страницы	подпись для `aria-label`

Фрейм pager: ссылки на соседние страницы

outline

outline выводит оглавление по заголовкам текста страницы, в правой колонке. Заголовок с явным якорем {#id} ведет на этот якорь. Страница без заголовков оглавления не получает. outline--spoiler прячет то же оглавление в свернутый блок, outline--bare выводит только список, без колонки и подписи. Строка вставки:

<!-- frame/outline {"levels":"2-3"} /-->
<!-- frame/outline--spoiler /-->
<!-- frame/outline--bare {"levels":"2"} /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`levels`	string	нет	`2-6`	какие заголовки брать: `2`, `2-3`, `2,4`
`title`	string	нет	«На этой странице» на языке страницы	подпись оглавления; у `outline--bare` ее нет

share-ai выводит кнопку копирования страницы в Markdown и выпадающий список со ссылками, которые открывают страницу в ChatGPT, Claude, Gemini, Perplexity, Grok и DeepSeek. share-ai--docs — та же кнопка для шапки документации, share-ai--links — только ссылки. Строка вставки:

<!-- frame/share-ai--docs {"label":"Скопировать"} /-->
<!-- frame/share-ai /-->
<!-- frame/share-ai--links /-->

Параметр	Тип	Обязательно	По умолчанию	Описание
`label`	string	нет	«Скопировать страницу» у `share-ai--docs`, «Копировать» у `share-ai`	подпись кнопки; у `share-ai--links` ее нет

Фрейм share-ai--docs: кнопка и ссылки на ИИ

Дерево документации

docs-nav выводит поиск и дерево страниц документации. docs-nav--sidebar ставит его в боковую колонку, docs-nav--drawer — в мобильную шторку, docs-nav--toggle выводит кнопку открытия шторки с путем к странице. Редактор после входа видит еще и черновики с отметками. Поле поиска отдельно выводит фрейм search. Строка вставки:

<!-- frame/docs-nav--sidebar {"root":"/docs/v2/ru/guides/"} /-->
<!-- frame/docs-nav--drawer /-->
<!-- frame/docs-nav--toggle /-->
<!-- frame/search /-->

Параметр	Тип	По умолчанию	Описание
`root`	string	—	корни разделов через запятую, адреса или id; дерево выводит раздел страницы
`search`	string	`1`	у `docs-nav`, `--sidebar`, `--drawer`: пустое значение убирает поле поиска

Фрейм docs-nav: дерево страниц документации

Чат ассистента

ai-assistant выводит виджет чата, ai-assistant--welcome — его первый экран. Разметку виджета собирает платформа, фрейм задает место и параметры. Строка вставки:

<!-- frame/ai-assistant {"assistant":"page.data.assistant","agent":"page.data.agent"} /-->
<!-- frame/ai-assistant--welcome {"assistant":"page.data.assistant"} /-->

Параметр	Тип	По умолчанию	Описание
`assistant`	string	—	id ассистента; без него фрейм ничего не выводит
`lib`, `agent`, `agent_view`	string	—	вход в чат: библиотека, агент и экран

Меню, языки и соцсети

Эти фреймы выводят меню, переключатель языков, соцсети, колонки подвала и копирайт из данных сайта. Своего оформления у них нет: фрейм выводит чистый список с классами op-menu (или свой класс в block), op-lang-switcher__* (данные — pages.lang_switcher), op-socials__*, op-footer-columns__* и op-copyright, а вид задают стили сайта, поэтому снимков здесь нет. Строка вставки:

<!-- frame/menu {"place":"footer_1","depth":"1"} /-->

Фрейм	Что выводит	Параметр	Тип	По умолчанию	Описание
`menu`	меню списком, до трех уровней	`place`	string	`header`	область меню: `header`, `footer_1`, `footer_2` или `footer_3`
		`lang`	string	—	язык меню
		`depth`	string	—	флаг: только верхний уровень
		`block`	string	`op-menu`	класс списка
`menu--dropdown`	то же меню в свернутом списке `<details>`	`place`, `lang`, `depth`	string	как у `menu`	как у `menu`
		`label`	string	`Меню`	подпись свернутого списка
`lang-switcher`	языки текущей страницы списком	`hide_current`	string	—	флаг: без текущего языка
		`show`	string	`name`	подпись языка: `name` — название, `slug` — код прописными
		`block`	string	`op-lang-switcher`	класс списка, от него строятся `__item`, `__link` и другие
		`scope`	string	`page`	`page` — только языки с переводом страницы
`lang-switcher--dropdown`	языки выпадающим списком	`hide_current`, `show`, `block`, `scope`	string	как у `lang-switcher`	как у `lang-switcher`
		`label`	string	—	подпись для `aria-label`
`socials`	ссылки на соцсети из `site.socials`	—
`footer-columns`	колонки подвала из `menu.footer_1`–`menu.footer_3` с заголовком из имени меню	—
`copyright`	строку «© год название сайта»	—

Фрейм меню без пунктов в области и переключатель языков на странице с одним языком ничего не выводят. Пункты меню, ссылки на соцсети и языки задают справочники «Меню», «Соцсети и контакты» и «Языки и переводы».

Секции лендинга

Секции выводят тот набор данных, который назвал вызов в параметре source, поэтому одна секция показывает на главной одни карточки, а на странице тарифов другие. Вместо набора site__bento, site__offer и site__text-media принимают те же поля прямо в параметре data. Разметку с полями отдает GET /frames/system/{ref}. Например:

<!-- frame/site__bento {"source":"home_bento"} /-->

site__bento

site__bento выводит заголовок секции с кнопкой и четыре карточки с иллюстрациями.

Параметр	Тип	Обязательно	По умолчанию	Описание
`source`	string	нет	—	набор, элемент которого — секция с полями `title`, `subtitle`, `cta.text`, `cta.link` и карточками `card1__title`, `card1__text`, `card1__art` … `card4__*`
`data`	array	нет	—	секции прямо в вызове: поля `title`, `subtitle`, `cta`, а карточки — список `items` с полями `title`, `text`, `art` — слаг фрейма иллюстрации и `art_text` — его тексты

site__offer

site__offer выводит предложение по центру: надзаголовок, заголовок, текст, кнопку и три карточки с иллюстрациями.

Параметр	Тип	Обязательно	По умолчанию	Описание
`source`	string	нет	—	набор с полями `eyebrow`, `title`, `text`, `cta.text`, `cta.link` и карточками `card1__` … `card3__`
`data`	array	нет	—	то же прямо в вызове, карточки — список `items` с полями `title`, `text`, `art`, `art_text`

site__marquee

site__marquee выводит бегущую строку из коротких фраз.

Параметр	Тип	Обязательно	По умолчанию	Описание
`source`	string	нет	—	набор, у элементов которого есть поле `label`
`data.items`	array	нет	—	фразы прямо в вызове, каждая строкой

Например:

<!-- frame/site__marquee {"data":{"items":["Перепишите в голосе бренда","Переведите страницу","Напишите заметки к релизу"]}} /-->

site__text-media

site__text-media выводит текст с кнопкой с одной стороны и картинку с другой.

Параметр	Тип	Обязательно	По умолчанию	Описание
`source`	string	нет	—	набор с полями `eyebrow`, `title`, `text`, `img`, `alt`, `cta.text`, `cta.link`
`data`	array	нет	—	то же прямо в вызове
`reverse`	string	нет	—	флаг: картинка слева

site__steps

site__steps выводит шаги с номерами в ряд из набора.

Параметр	Тип	Обязательно	По умолчанию	Описание
`source`	string	нет	—	набор с полями `title` и `text`
`title`	string	нет	—	заголовок секции, строчный HTML

Например:

<!-- frame/site__steps {"source":"feature_assistant_steps","title":"Как это работает"} /-->

site__testimonials

site__testimonials выводит заголовок с кнопкой и до шести отзывов с фото.

Параметр	Тип	Обязательно	По умолчанию	Описание
`source`	string	нет	—	набор с полями `text`, `name`, `role`, `photo`, `alt`
`data.title`	string	нет	—	заголовок секции, строчный Markdown
`data.cta`	array	нет	—	кнопка справа от заголовка: элемент с полями `text` и `link`

page-feed

page-feed выводит дочерние страницы текущей страницы карточками по девять, новые сначала, с номерами страниц внизу. Пока записей нет, фрейм выводит текст empty_section из набора footer. page-feed--related выводит блок «Больше по теме» с четырьмя соседними записями и параметров не принимает; на демо-сайте страниц с ним нет, поэтому снимка здесь нет.

Параметр	Тип	Обязательно	По умолчанию	Описание
`parent`	string	нет	текущая страница	`any` — последние записи всего сайта
`exclude_current`	string	нет	—	флаг: без текущей страницы

Например, лента последних записей всего сайта:

<!-- frame/page-feed {"parent":"any"} /-->

Готовые фреймы

Как читать каталог

Фреймы с текстом внутри

steps

faq

site__faq

callout

gallery

howto

Фреймы одной строкой

alert

cards

link-cards

buttons

tabs

gallery—lightbox

video

file

shortcut

faq-items и faq__schema

page-list и plan-list

value, terms и featured-image

Фреймы шаблона

Фреймы страниц

article

docs

headless

Лендинги

Новости

Изменения

site__404

Шапка и подвал

Объявление, призыв и cookies

Служебные фреймы страниц

Пейджер, оглавление и ссылки на ИИ

pager

outline

share-ai

Дерево документации

Чат ассистента

Меню, языки и соцсети

Секции лендинга

site__bento

site__offer

site__marquee

site__text-media

site__steps

site__testimonials

page-feed