Описание элементов RSS 2.0

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

Примечание. Для создания RSS-канала вы можете использовать специальный плагин. Плагины разработаны для систем 1С-Битрикс, Drupal, Joomla, WordPress и OpenCart.

Данные для Турбо-страниц экспортируются в XML-based формате RSS 2.0.

Корневым элементом RSS-файла является rss, атрибут version которого должен иметь значение 2.0.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0">
    ...
</rss>

Для формирования Турбо-страницы передайте следующие данные:

...
    <channel><!--Информация о сайте-источнике (RSS-канале)-->
        ...
        <item turbo="true"><!--Информация о странице-->
            ...
            <turbo:content>...</turbo:content><!--Содержимое страницы-->
            ...
        </item>
    </channel>
</rss>
  1. Передача информации о сайте-источнике
    1. Подключение систем веб-аналитики
    2. Подключение рекламы
  2. Передача информации о странице
  3. Передача содержимого страницы
  4. Символы и кодировки

Передача информации о сайте-источнике

Сведения передаются в элементе channel.

ЭлементОписание
title

Название RSS-канала.

Если экспортируется содержимое всего сайта, укажите название сайта. Если экспортируется раздел сайта, укажите только название раздела.

<title>Название канала</title>
link

Домен сайта, данные которого транслируются.

<link>http://www.example.com</link>
description

Описание канала одним предложением. Не используйте HTML-разметку.

<description>Краткое описание потока</description>
language
Язык статьи по стандарту ISO 639-1.
<language>ru</language>
turbo:analytics

Счетчик системы веб-аналитики для учета посещаемости Турбо-страниц. Подробнее

turbo:adNetwork

Используйте для отображения блоков Рекламной сети Яндекса и сторонней рекламы, подключенной через ADFOX на Турбо-страницах. А также для учета доходов от рекламы при использовании Турбо-страниц. Подробнее

item *

Информация о странице и ее содержимом.

Чтобы использовать формат Турбо-страниц, добавьте атрибут turbo со значением true. Чтобы отключить отображение Турбо-страницы, используйте значение false. Подробнее см. в разделе Управление показом Турбо-страниц.

...
    <item turbo="true">
        ... 
    </item>

Один элемент item описывает одну страницу.

* Обязательный элемент.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
            ...
        </item>
    </channel>
</rss>

Подключение систем веб-аналитики

Системы веб-аналитики можно добавить в Яндекс.Вебмастере на странице Турбо-страницы → Настройки. В этом случае не добавляйте счетчики в RSS-канал.

  1. Подключение поддерживаемых систем веб-аналитики
  2. Подключение произвольной системы веб-аналитики

Подключение поддерживаемых систем веб-аналитики

Вы можете подключить некоторые системы веб-аналитики с помощью специальных значений атрибута type элемента turbo:analytics.

Чтобы трафик на Турбо-страницах учитывался в разных системах статистики, в элемент channel добавьте сразу несколько элементов turbo:analytics. Также вы можете указывать неограниченное количество счетчиков каждой системы веб-аналитики.
Яндекс.Метрика
АтрибутОписание
type *Принимает значение Yandex.
id *Номер счетчика Яндекс.Метрики.
paramsИспользуйте для передачи параметров визитов.

Также вы можете передать в Яндекс.Метрику адрес страницы-источника и заголовок Турбо-страницы. Для этого в элементе item укажите элементы turbo:source и turbo:topic.

*Обязательный атрибут.

О том, как настраивать цели и просматривать статистику по Турбо-страницам, см. в Помощи Яндекс.Метрики.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:analytics
         id="номер счетчика"
         type="Yandex"
         params="{ 'param' : 'val' }">
        </turbo:analytics>
        <item turbo="true">
            <link>http://www.example.com/page1.html</link>
            <turbo:content>
                ...
            </turbo:content>
        </item>
    </channel>
</rss>
LiveInternet
Укажите атрибут type со значением LiveInternet.
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:analytics
         type="LiveInternet">
        </turbo:analytics>
        <item turbo="true">
            <link>http://www.example.com/page1.html</link>
            <turbo:content>
                ...
            </turbo:content>
        </item>
    </channel>
</rss>

Если один счетчик используется для нескольких сайтов, добавьте атрибут params с  названием именованного счетчика.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:analytics
         type="LiveInternet"
         params="Название счетчика">
        </turbo:analytics>
        <item turbo="true">
            <link>http://www.example.com/page1.html</link>
            <turbo:content>
                ...
            </turbo:content>
        </item>
    </channel>
</rss>
Google Analytics

Укажите атрибут type со значением Google и атрибут id с идентификатором отслеживания.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:analytics
         id="идентификатор отслеживания"
         type="Google">
        </turbo:analytics>
        <item turbo="true">
            <link>http://www.example.com/page1.html</link>
            <turbo:content>
                ...
            </turbo:content>
        </item>
    </channel>
</rss>
Рейтинг Mail.RU

Укажите атрибут type со значением MailRu и атрибут id с идентификатором счетчика.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:analytics
         id="идентификатор счетчика"
         type="MailRu">
        </turbo:analytics>
        <item turbo="true">
            <link>http://www.example.com/page1.html</link>
            <turbo:content>
                ...
            </turbo:content>
        </item>
    </channel>
</rss>
Rambler Топ-100

Укажите атрибут type со значением Rambler и атрибут id с идентификатором счетчика.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:analytics
         id="идентификатор счетчика"
         type="Rambler">
        </turbo:analytics>
        <item turbo="true">
            <link>http://www.example.com/page1.html</link>
            <turbo:content>
                ...
            </turbo:content>
        </item>
    </channel>
</rss>
Mediascope (TNS)
Укажите атрибут type со значением Mediascope и атрибут id с номером счетчика.
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:analytics
         id="идентификатор tmsec от Mediascope"
         type="Mediascope>
        </turbo:analytics>
        <item turbo="true">
            <link>http://www.example.com/page1.html</link>
            <turbo:content>
                ...
            </turbo:content>
        </item>
    </channel>
</rss>

Где найти идентификатор или номер счетчика.

Подключение произвольной системы веб-аналитики

Если ваша система веб-аналитики поддерживает установку в виде изображения (пикселя), вы можете подключить ее к Турбо-странице:
  1. Добавьте в элемент turbo:analytics атрибуты:
    • type * — со значением custom;
    • url * — с адресом пикселя системы статистики.
  2. Укажите в URL дополнительные параметры, которые хотите передавать в систему веб-аналитики:
    • {referrer} — реферер;
    • {referrerStarsEscaped} — реферер для Mediascope (с экранированным символом *), если вы хотите подключить эту систему, не указывая идентификатор;
    • {pageTitle} — заголовок страницы;
    • {originalURL} — URL местоположения оригинальной страницы;
    • {screenWidth} — ширина экрана;
    • {screenHeight} — высота экрана;
    • {random} — псевдослучайное число (на каждое вхождение в строке генерируется новое значение);
    • {requestId} — идентификатор запроса (одинаковый в рамках страницы);
    • {clientId} — идентификатор клиента (одинаковый для браузера пользователя).
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:analytics
         type="custom"
         url="http://some.doma.in/{screenWidth}*{clientId}/{random}/{originalURL}?title={pageTitle}" >
        </turbo:analytics>
        <item turbo="true">
            <link>http://www.example.com/page1.html</link>
            <turbo:content>
                ...
            </turbo:content>
        </item>
    </channel>
</rss>

Подключение рекламы

Рекламу можно добавить в Яндекс.Вебмастере на странице Турбо-страницы → Настройки. В этом случае не добавляйте рекламу в RSS-канал.

  1. В партнерском интерфейсе создайте рекламный блок для Турбо-страниц.
  2. В RSS-файл добавьте в элемент turbo:adNetwork атрибуты:
    • type со значением Yandex;
    • id с буквенно-числовым идентификатором рекламного блока;
    • turbo-ad-id с произвольным ID, указывающим место размещения рекламы.
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:adNetwork
         type="Yandex"
         id="идентификатор блока 1"
         turbo-ad-id="first_ad_place">
        </turbo:adNetwork>
        <turbo:adNetwork
         type="Yandex"
         id="идентификатор блока 2"
         turbo-ad-id="second_ad_place">
        </turbo:adNetwork>  
        <item turbo="true">
            ...
            <turbo:content>
                ...
                <figure data-turbo-ad-id="second_ad_place"></figure> 
            </turbo:content> 
        </item>
    </channel>
</rss>

Чтобы добавить несколько рекламных блоков, для каждого блока укажите отдельный элемент turbo:adNetwork с уникальным значением атрибута id. Если вы укажете одинаковое значение, отобразится только первый блок.

Чтобы указать место размещения рекламы на странице:
  1. Задайте для рекламного блока произвольный ID в качестве значения атрибута turbo-ad-id. Например, first_ad_place, second_ad_place.
  2. Укажите этот ID в качестве значения атрибута data-turbo-ad-id в элементе figure внутри элемента turbo:content.
Примечание. Если атрибут turbo-ad-id или его значение отсутствует, то отобразится только первый рекламный блок внизу Турбо-страницы. Если атрибут turbo-ad-id указан только для нескольких рекламных блоков, реклама не отобразится.

Где найти идентификатор рекламного блока или код вставки.

Передача информации о странице

Данные передаются в элементе item.

ЭлементОписание
link *

URL страницы сайта, для которой нужно сформировать Турбо-страницу.

<link>http://www.example.com/page1.html</link>
Требования:
  • ссылка должна содержать схему HTTP или HTTPS;
  • домен, указанный в ссылке, должен соответствовать домену сайта-источника;
  • максимальная длина URL — 243 ASCII-символа;
  • по одному URL должна быть доступна одна статья.

При переходе по ссылке заголовок и начало текста должны быть видны на первом экране при разрешении 1024 × 768.

turbo:sourceURL страницы-источника, который можно передать в Яндекс.Метрику.
turbo:topicЗаголовок страницы, который можно передать в Яндекс.Метрику.
pubDate

Время публикации контента на сайте источника.

Передается в формате RFC-822.

<pubDate>Tue, 21 Apr 2015 14:15:00 +0300</pubDate>
authorАвтор статьи, размещенной на странице.
<author>Иван Иванов</author>
turbo:content *

Содержимое страницы.

yandex:related

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

Такие ссылки будут располагаться внизу Турбо-страницы. Чтобы добавить ссылки в любом месте страницы, используйте Блок ссылок на дополнительные материалы.

Бесконечная лента рекомендаций

Посмотрите пример отображения бесконечной ленты.

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

Добавьте в элемент yandex:related атрибут type со значением infinity. Внутри элемента yandex:related укажите элемент link со ссылкой на статью.

Чтобы добавить к статье изображение, используйте атрибут img с URL, по которому доступна иллюстрация.

Оборачиваемый в элемент link текст не должен содержать HTML-элементы.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               ...
           </turbo:content>
           <yandex:related type="infinity">
               <link
                url="http://www.example.com/page.html"
                img="http://www.example.com/image.png">Текст ссылки
               </link>
               <link
                url="http://www.example.com/page2.html"
                img="http://www.example.com/image2.png">Текст ссылки
               </link>
           </yandex:related>
        </item>
    </channel>
</rss>

Если вы подключили к Турбо-страницам рекламу с помощью ADFOX, на вкладке Параметры выберите в параметре Тип кода значение <неповторяющиеся баннеры>. Подробнее см. в Помощи ADFOX.

* Обязательный элемент.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               ...
           </turbo:content>
           <yandex:related type="infinity">
               <link
                url="http://www.example.com/page.html"
                img="http://www.example.com/image.png">Текст ссылки
               </link>
               <link
                url="http://www.example.com/page2.html"
                img="http://www.example.com/image2.png">Текст ссылки
               </link>
           </yandex:related>
        </item>
    </channel>
</rss>

Передача содержимого страницы

Контент для Турбо-страницы передается с помощью элемента turbo:content. Содержимое необходимо обернуть в раздел <![CDATA[]]>.

Шапка страницы (верхняя часть страницы)*


Шапку страницы можно настроить в Яндекс.Вебмастере на странице Турбо-страницы → Настройки. В этом случае не добавляйте элемент в RSS-канал.

Используйте элемент header, который может включать в себя:

ЭлементОписание
figureСодержит элемент img с адресом изображения, которое используется в качестве обложки. Изображение может быть в любом формате.
<header>
    <figure>
        <img src="http://example.com/img.jpg" />
    </figure>
</header>
h1 *Заголовок первого уровня.
<h1>Текст заголовка</h1>
h2Заголовок второго уровня.
menu

Навигационное меню.

* Обязательный элемент.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
               ]]>           
           </turbo:content>
        </item>
    </channel>
</rss>
Оформление текста

Вы можете использоваться в RSS-канале следующие стандартные HTML-элементы:

ЭлементОписание
h1
Заголовок первого уровня.
<h1>Заголовок страницы</h1>

Поддерживаются шесть уровней заголовков.

p
Параграф.
<p>Параграф текста</p>
br
Перенос строки без отступа.
Текст<br>
hr
Разделитель в виде горизонтальной линии. Линия начинается с новой строки, а размещенные после нее элементы располагаются на следующей строке.
<p>Первое предложение</p>
<hr>
<p>Второе предложение</p>
Посмотреть пример отображения


ul
Маркированный список.
<ul>
    <li>первый пункт списка</li>
</ul>
ol
Нумерованный список.
<ol>
    <li>первый пункт списка</li>
</ol>
b
Выделение текста жирным.
<b>Текст</b>
strongВыделение текста. Обычно браузеры отображают его жирным.
<strong>Текст</strong>
iВыделение текста курсивом.
<i>Текст</i>
emВыделение текста. Обычно браузеры отображают его курсивом.
<em>Текст</em>
supВерхний индекс.
2<sup>3</sup>
subНижний индекс.
H<sub>2</sub>O
ins

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

Основной текст, <ins>новый текст</ins>
del

Выделение текста, который был удален в новой версии статьи. Большинство браузеров отображают его зачеркнутым.

Основной текст, <del>удаленный текст</del>
small
Уменьшение размера шрифта на одну условную единицу.
<small>Текст</small>
bigУвеличение размера шрифта на одну условную единицу.
<big>Текст</big>
pre
Выделение предварительно форматированного текста.
<pre>Текст</pre>
abbrВыделение аббревиатуры в тексте.
<abbr title="Пояснение">HTML</abbr>
u
Подчеркивание текста.
<u>Текст</u>
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст.</p>
                   <hr>
                   <p>Другой текст.</p>
                   <h2>Заголовок второго уровня</h2>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <ul>
                       <li>пункт 1;</li>
                       <li>пункт 2.</li>
                   </ul>
               ]]>
           </turbo:content>
        </item>
    </channel>
</rss>
Ссылка в тексте
Турбо-страницы поддерживают несколько типов ссылок:
  • ссылка на другую страницу сайта;
  • ссылка на якорь в пределах одной страницы или на якорь другой страницы.
Для добавления ссылки используйте элемент a. Он может содержать следующие атрибуты:
АтрибутОписание
href *URL или якорь.
data-turbo

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

  • true — по ссылке откроется Турбо-версия страницы, если она сформирована. Используется по умолчанию.
  • false — по ссылке откроется обычная страница или ее мобильная версия.

Если атрибут data-turbo не указан, по ссылке откроется Турбо-страница, если она сформирована.

* Обязательный атрибут.

В качестве якоря используйте контент в виде аккордеона и заголовок, выделенный элементом h1 и т. д. При этом элементу, который является якорем, нужно присвоить идентификатор (атрибут id). Если в содержимом Турбо-страницы указано несколько идентификаторов, они не должны повторяться.

<a href="http://example.com/page2/">Ссылка на другую Турбо-страницу</a><br>
<a href="http://example.com/page2/" data-turbo="false">Ссылка на обычную страницу</a><br>
<a href="http://example.com/page2#topic2">Ссылка на якорь другой страницы</a><br>
<a href="http://example.com/page1#topic">Ссылка на заголовок h1 на этой странице</a><br>
<a href="#component">Ссылка на контент в виде аккордеона на этой странице</a><br>
<h1 id="topic">Заголовок</h1>
<div data-block="accordion" id="component">
    <div data-block="item" data-title="Москва">Текст</div>
    <div data-block="item" data-title="Санкт-Петербург" data-expanded="true">Текст</div>
</div>
Блоки ссылок на дополнительные материалы


Количество таких блоков не ограничено, их можно размещать в любом месте Турбо-страницы.

Используйте вложенную структуру элемента div. Корневой элемент div должен содержать хотя бы один вложенный элемент div со значением feed-item в атрибуте data-block.

АтрибутОписание
data-block *

Принимает значение feed.

data-layoutОриентация списка ссылок. Возможные значения:
  • horizontal;
  • vertical — задано по умолчанию.
data-titleЗаголовок блока ссылок. По умолчанию установлено значение «Читайте также».
Вложенный div может содержать следующие атрибуты:
АтрибутОписание
data-block *

Принимает значение feed-item.

data-href *URL страницы с дополнительными материалами.
data-title *Текст ссылки.
data-descriptionОписание.
data-thumbСсылка на картинку элемента. Становится обязательным, если атрибут data-layout принимает значение horizontal.
data-thumb-position

Положение картинки. Возможные значения:

  • left — используется по умолчанию;
  • right;
  • top.

Атрибут игнорируется если атрибут data-layout принимает значение horizontal.

data-thumb-ratio
Пропорции картинки. Возможные значения:
  • 1 × 1;
  • 2 × 3;
  • 3 × 2;
  • 3 × 4;
  • 4 × 3;
  • 16 × 9;
  • 16 × 10.

По умолчанию слева и справа отображаются картинки в формате 1 × 1, а сверху 16 × 9.

* Обязательный атрибут.

<div data-block="feed" data-layout="horizontal" data-title="Southern cross">
    <div data-block="feed-item"
        data-href="https://adelaide.au.com"
        data-title="Welcome"
        data-thumb="https://u24.services/media/service/poster/None/750eb2a4d7f9355bfcaabb19d3019ee388e26101.jpg"
        data-thumb-position="right"
        data-thumb-ratio="3x2"
        data-description="5 reasons to visit the capital of South Australia">
    </div>
    <div data-block="feed-item"
        data-thumb="https://u24.services/media/service/poster/None/750eb2a4d7f9355bfcaabb19d3019ee388e26101.jpg"
        data-thumb-position="left"
        data-thumb-ratio="16x10"
        data-href="https://sydney.au.com"
        data-title="The best city in the world and the capital of New South Wales">
    </div>
</div>
Картинка в тексте


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

Поддерживаются форматы JPEG, PNG, GIF. Вы можете разместить картинку внутри абзаца (элемент p) или между абзацами. Для этого используйте элемент img, в атрибуте src укажите URL изображения.

...
    <img src="http://example.com/img.jpg" />
...
Примечание. GIF проигрывается автоматически, если размер изображения меньше 128 пикселей. Если размер изображения больше, содержимое воспроизводится по клику.

Чтобы разместить картинку с подписью, используйте элемент figure, который может содержать:

ЭлементОписание
figcaptionВидимая подпись картинки.
 ...
    <figure>
        <img src="http://example.com/img.jpg" />
        <figcaption>Подпись</figcaption>
    </figure>
...
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <ul>
                       <li>пункт 1;</li>
                       <li>пункт 2.</li>
                  </ul>
                  <figure>
                      <img src="https://avatars.mds.yandex.net/get-sbs-sd/403988/e6f459c3-8ada-44bf-a6c9-dbceb60f3757/orig">
                      <figcaption>Подпись</figcaption>
                  </figure>
                  <p>Фотографии — http://unsplash.com</p>
               ]]>
           </turbo:content>
        </item>
    </channel>
</rss>
Галерея медиа-контента со слайдером


Слайдер может содержать следующие элементы:
  • Видео.
  • Картинка.
  • Ссылка.
  • Блок рекламы РСЯ. Чтобы добавить в слайдер рекламу, в интерфейсе Рекламной Сети Яндекса на странице Продукты → RTB-блоки → 2. Версия сайта создайте блок Адаптивный (Турбо).

Примечание. Слайдер не поддерживает GIF-анимацию.
Используйте элемент div со следующими атрибутами:
АтрибутОписание
data-block *Принимает значение slider.
data-viewПозволяет задать отображение картинок. Возможные значения:
  • auto — автоматический выбор отображения в зависимости от пропорций исходной картинки;
  • portrait — портрет;
  • landscape — альбом;
  • square — квадрат.
data-item-viewВозможные значения:
  • cover (по умолчанию)— контент полностью покрывает слайдер, может обрезаться;
  • contain — контент масштабируется и отображается полностью.

* Обязательный атрибут.

Внутри элемента div используйте следующие элементы:

ЭлементОписание
headerОбщая подпись ко всему слайдеру. Отображается, если ни у одного элемента figure нет подписи.
figure *

Элемент слайдера. Может быть рекламным блоком РСЯ, картинкой или ссылкой.

figcaptionПодпись к элементу слайдера.
imgКартинка.
aСсылка.
videoВидео-блок.
source *Параметры видео-ролика.

* Обязательный элемент.

Атрибут элемента figure
АтрибутОписание
data-turbo-ad-idВ качестве значения добавьте ID позиции рекламного блока, указанный в элементе turbo:adNetwork или на странице Турбо-страницы → Настройки Яндекс.Вебмастера.
Атрибуты элемента video
АтрибутОписание
width *Ширина видео-блока.
height *Высота видео-блока.
Атрибуты элемента source
АтрибутОписание
src *URL видео.
type *Тип видео. Поддерживается video/mp4.
data-duration *Отображаемая длительность видео, целое число.
data-titleЗаголовок видео-блока

* Обязательный атрибут.

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:yandex="http://news.yandex.ru">
    <channel>
        <turbo:adNetwork
                type="Yandex"
                id="R-A-181354-108"
                turbo-ad-id="first_YAN_ad_place"/>
        <turbo:adNetwork
                type="Yandex"
                id="R-A-181354-109"
                turbo-ad-id="second_YAN_ad_place"/>
        <turbo:logo>http://www.example.com/logo.jpg</turbo:logo>
        <item turbo="true">
            <title>Закат</title>
            <link>http://www.example.com/sunset-lapse</link>
            <turbo:content>
            <![CDATA[
                <div data-block="slider" data-view="landscape">
                    <figure>
                        <figcaption>Фото заката</figcaption>
                        <img src="http://download.cdn.yandex.net/from/yandex.ru/support/ru/webmaster/files/sunset-lapse.jpg"/>
                    </figure>
                    <figure data-turbo-ad-id="first_YAN_ad_place"></figure>
                    <figure>
                        <video width="192" height="108">
                            <source
                                src="http://download.cdn.yandex.net/from/yandex.ru/support/ru/webmaster/files/sunset-lapse.mp4"
                                type="video/mp4"
                                data-duration=15
                                data-title="Закат"
                                />
                            </video>
                        </video>
                        <img src="http://download.cdn.yandex.net/from/yandex.ru/support/ru/webmaster/files/sunset-lapse.jpg"/>
                        <figcaption>Полюбуйтесь таймлапсом заката</figcaption>
                    </figure>
                    <figure data-turbo-ad-id="second_YAN_ad_place"></figure>
                </div>
                ]]>
            </turbo:content>
        </item>
    </channel>
</rss>
Видео в тексте


Вы можете добавить на Турбо-страницу видео, размещенные на вашем сайте или на сторонних ресурсах.

Поддерживается формат MP4. Используйте элемент figure, который может содержать:

ЭлементОписание
videoВключает в себя элемент source с атрибутами:
  • src — ссылка на видео. Видео должно быть доступно по протоколу HTTPS.
  • type — тип медиаматериала и его формат.
...
<figure>
    <video>
        <source
         src="https://example.com/video.mp4"
         type="video/mp4" />
    </video>
    ...
imgПревью видео (изображение) в любом формате.
...
<figure>
    <video>
        <source
         src="https://example.com/video.mp4"
         type="video/mp4" />
    </video>
    <img src="http://example.com/img.jpg" />
    ...
figcaptionПодпись к видео.
...
<figure>
    <video>
        <source
         src="https://example.com/video.mp4"
         type="video/mp4" />
    </video>
    <img src="http://example.com/img.jpg" />
    <figcaption>Подпись к видео</figcaption>
</figure>
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <ul>
                       <li>пункт 1;</li>
                       <li>пункт 2.</li>
                   </ul>
                   <figure>
                       <video>
                           <source
                            src="https://example.com/video.mp4"
                            type="video/mp4" />
                       </video>
                   </figure>
                ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Блок «Поделиться»


Чтобы разместить на Турбо-странице блок «Поделиться», используйте элемент div, который может содержать:

АтрибутОписание
data-block *

Принимает значение share.

data-networkВы можете указать одно или несколько значений через запятую:
  • facebook;
  • google;
  • odnoklassniki;
  • telegram;
  • twitter;
  • vkontakte.

Если атрибут data-network не указан, будут подключены все перечисленные выше сервисы.

<div data-block="share" data-network="twitter, facebook"></div> 
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <div data-block="share" data-network="twitter, facebook"></div>
                ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Цитаты в тексте


Для оформления цитаты в тексте используйте элемент blockquote. Он может содержать поддерживаемые HTML-элементы. Чтобы разместить в цитате картинку, используйте элемент figure.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <blockquote>
                       <p>Текст</p>
                       <figure>
                           <img src="http://example.com/img.jpg" />
                           <figcaption>Подпись</figcaption>
                       </figure>
                   </blockquote>
               ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Таблицы в тексте


Чтобы сделать рамку таблицы прозрачной, используйте в элементе table атрибут data-invisible со значением true.
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <table data-invisible="true">
                       <tr><!--Заголовок таблицы-->
                           <th>Первый столбец</th>
                           <th>Второй столбец</th>
                       </tr>
                       <tr><!--Строка таблицы-->
                           <td>Первый столбец</td>
                           <td>Второй столбец</td>
                       </tr>
                  </table>
               ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Элементы меню

На Турбо-странице может отображаться значок . Когда пользователь нажмет на него, элементы навигации отобразятся в виде блока ссылок с заголовком Меню.

Меню можно настроить в Яндекс.Вебмастере на странице Турбо-страницы → Настройки. В этом случае не добавляйте элемент в RSS-канал.



Чтобы разместить на Турбо-странице меню, используйте элемент menu. Укажите его при оформлении шапки страницы, в элементе header.

Элемент menu элемент a, атрибут href которого принимает в качестве значения ссылку на страницу сайта.

<header>
    ...
    <menu>
      <a href="http://example.com/page1.html">Текст ссылки</a>
      <a href="http://example.com/page2.html">Текст ссылки</a>
    </menu>
</header>
Встраиваемый социальный контент
Facebook
Вы можете добавить на Турбо-страницы социальные плагины Facebook. Например, разместить отдельные публикации и страницы вашей компании или дать возможность пользователю прокомментировать страницу через его аккаунт на Facebook.
ВКонтакте
Вы можете добавить на Турбо-страницу встраиваемый контент ВКонтакте. Например, разместить пост, дать возможность пользователю поделиться страницей или проголосовать.
Одноклассники
Вы можете добавить на Турбо-страницы видео, блок, рекламирующий вашу группу, и кнопку «Поделиться». Подробнее.
Instagram и Twitter


Чтобы разместить на Турбо-странице встраиваемый контент:
  1. Скопируйте код для встраивания ресурса.
  2. Добавьте скопированный код в раздел <![CDATA[]]> внутри элемента turbo:content.

Пример:

...
<turbo:content>
    <![CDATA[
        <!--Код для встраивания-->
    ]]>
</turbo:content>
...
Яндекс.Карты


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

Чтобы разместить на Турбо-странице карту:
  1. На Яндекс.Картах получите код карты в iframe.
  2. Добавьте скопированный код в раздел <![CDATA[]]> внутри элемента turbo:content.
...
<turbo:content>
    <![CDATA[
        <iframe src="https://yandex.ru/map-widget/v1/-/CBucU6V~8B"></iframe>
    ]]>
</turbo:content>
...
Яндекс.Музыка


Вы можете добавлять на Турбо-страницу треки, альбомы и плейлисты, доступные на Яндекс.Музыке. Для этого:

  1. На Яндекс.Музыке получите код для встраивания в iframe.
  2. Добавьте скопированный код в раздел <![CDATA[]]> внутри элемента turbo:content.
...
<turbo:content>
    <![CDATA[
        <iframe frameborder="0" style="border:none;width:600px;height:100px;" width="600" height="100" src="https://music.yandex.ru/iframe/#track/38371520/4903683/">Слушайте <a href='https://music.yandex.ru/album/4903683/track/38371520'>Зима на часах</a> — <a href='https://music.yandex.ru/artist/5019534'>Дидо</a> на Яндекс.Музыке</iframe>
        <iframe frameborder="0" style="border:none;width:900px;height:600px;" width="900" height="600" src="https://music.yandex.ru/iframe/#playlist/yndx-tanzwuta/3/show/cover/description/">Слушайте <a href='https://music.yandex.ru/users/yndx-tanzwuta/playlists/3'>Мне нравится</a> — <a href='https://music.yandex.ru/users/yndx-tanzwuta'>tanzwuta</a> на Яндекс.Музыке</iframe>
        <iframe frameborder="0" style="border:none;width:900px;height:600px;" width="900" height="600" src="https://music.yandex.ru/iframe/#album/30656/">Слушайте <a href='https://music.yandex.ru/album/30656'>Tanzwut</a> — <a href='https://music.yandex.ru/artist/103681'>Tanzwut</a> на Яндекс.Музыке</iframe>
    ]]>
</turbo:content>
...
Комментарии


Используйте древовидную структуру элемента div. Количество уровней вложенности не ограничено.

Примечание. Обрабатываются первые 40 комментариев (содержимое элемента div со значением comment атрибута data-block).
АтрибутОписание
data-block *
Принимает значения:
data-author *Принимает значение author — имя автора комментария.
data-avatar-urlСсылка на аватар автора комментария. Картинка должна быть в формате JPG или PNG, не меньше 64 × 64 пикселей.
data-subtitleДополнительная строка информации, например дата комментария. Располагается под именем автора.
data-urlИспользуется только в элементе div верхнего уровня. Ссылка на страницу добавления комментариев.

Содержимое комментария:

ЭлементОписание
header

Заголовок комментария. Располагается над текстом комментария.

HTML-элементыПоддерживаемые HTML-элементы.
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <div data-block="comments" data-url="http://example.com/comments">
                       <div
                        data-block="comment"
                        data-author="author" 
                        data-avatar-url="http://example.com/img.png" 
                        data-subtitle="2017-12-10"
                       >
                           <div data-block="content">
                               <header>Заголовок первого комментария</header>
                               <p>
                                   <b>Текст</b> комментария
                                   <a href="https://example.com">Текст ссылки</a>
                               </p>
                           </div>
                           <div data-block="comments"> 
                               <div 
                                data-block="comment"
                                data-author="author2">
                                   <!--Ответ на первый комментарий-->
                               </div> 
                           </div>  
                       </div>
                       <div
                        data-block="comment"
                        data-author="author"> 
                           <div data-block="content">
                               <!--Содержимое второго комментария-->
                           </div>
                       </div>  
                   </div>
               ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Рейтинг


Рейтинги на Турбо-странице реализованы по протоколу schema.org/Rating. Чтобы добавить рейтинг, используйте элемент div с вложенным элементом meta.

Элемент div содержит следующие обязательные атрибуты:

АтрибутОписание
itemscopeНе принимает значений.
itemtypeПринимает значение http://schema.org/Rating.

Элемент meta содержит следующие обязательные атрибуты:

АтрибутОписание
itemprop
Принимает значения:
  • ratingValue — значение рейтинга;
  • bestRating — максимальное значение рейтинга.
content

В качестве значения укажите любое положительное число.

Количество звезд всегда равно 5 не зависимо от максимального значения рейтинга. Например, если вы укажете атрибут ratingValue со значением 5 и атрибут bestRating со значением 10, то выделятся 2,5 звезды.

Посмотреть пример


<div itemscope itemtype="http://schema.org/Rating">
    <meta itemprop="ratingValue" content="5">
    <meta itemprop="bestRating" content="10">
</div>
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <div itemscope itemtype="http://schema.org/Rating">
                       <meta itemprop="ratingValue" content="3">
                       <meta itemprop="bestRating" content="5">
                   </div>
               ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Блок обратной связи


Используйте вложенную структуру элемента div. Головной элемент содержит:

АтрибутОписание
data-block

Принимает значение widget-feedback.

data-titleПринимает произвольное текстовое значение. Например, «Обратная связь». Отображается на Турбо-странице, если вы передаете атрибут data-stick со значением false.
data-stick
Позволяет выравнивать блок. Возможные значения:
  • left — выравнивание по левому краю страницы. При таком расположении вы можете разместить до четырех кнопок. Кнопки будут расположены вертикально.
  • right — выравнивание по правому краю страницы. При таком расположении вы можете разместить до четырех кнопок. Кнопки будут расположены вертикально.
  • false — блок будет расположен в том месте страницы, где он указан в RSS-канале. В этом случае количество кнопок не ограничено — пользователь сможет прокрутить блок до нужной кнопки.

С помощью вложенных элементов вы можете передать тип обратной связи и контактную информацию:

АтрибутОписание
data-typeПозволяет передать тип связи. Возможные значения:
  • call — позволяет указать номер телефона;
  • chat — позволяет добавить чат для бизнеса;
  • mail — позволяет указать адрес электронной почты;
  • callback — позволяет добавить форму обратной связи, которая при нажатии кнопки откроется поверх содержимого страницы.
Следующие значения определяют мессенджер или социальную сеть:
  • facebook;
  • google;
  • odnoklassniki;
  • telegram;
  • twitter;
  • viber;
  • vkontakte;
  • whatsapp.
data-url

Позволяет передать контактную информацию. Используйте только для типов связи call и mail, а также мессенджеров.

Возможные значения:
  • номер телефона или ссылка вида tel:<номер телефона>;
  • адрес электронной почты или ссылка вида mailto:<адрес>;
  • URL, по которому доступен чат или канал в мессенджере;
  • URL, по которому доступна страница социальной сети (группа, контакт и др.).
data-send-to
Позволяет указать адрес электронной почты, на который будет отправлено обращение пользователя. Используйте для типа связи callback.
Примечание. Укажите адрес, размещенный на вашем домене, а не на сторонних почтовых ресурсах. Если у вас нет такого адреса, воспользуйтесь сервисами-посредниками, например Яндекс.Почта для домена.
data-agreement-company **Позволяет указать юридическое название вашей организации. Например, ООО «Ромашка». Используйте для типа связи callback.
data-agreement-link ***Позволяет указать ссылку на пользовательское соглашение о предоставлении обратной связи. Используйте для типа связи callback.

** Атрибут становится обязательным, если указан атрибут data-agreement-link.

Как добавить чат для бизнеса

Подробно о технологии Чат для бизнеса.

  1. Заведите учетную запись на одной из поддерживаемых чат-платформ.
  2. В сервисе Яндекс.Диалоги создайте чат для сайта или отдельных страниц.

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

  3. Добавьте элемент div с атрибутом data-type и значением chat в блок обратной связи вашего RSS-канала.

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

Примеры элементов в блоке обратной связи
Вызов звонка
...
<div data-block="widget-feedback" data-title="Обратная связь" data-stick="right">
    <div data-type="call" data-url="+7 012 345-67-89"></div>
</div>
...
Отправка письма
...
<div data-block="widget-feedback" data-title="Обратная связь" data-stick="right">
    <div data-type="mail" data-url="mailto:mail@example.com"></div>
</div>
...
Вызов формы обратной связи
...
<div data-block="widget-feedback" data-title="Обратная связь" data-stick="right">
    <div data-type="callback"
         data-send-to="mail@example.com"
         data-agreement-company="ООО Ромашка"
         data-agreement-link="http://example.com">
    </div>
</div>
...
Вызов Чата для бизнеса
...
<div data-block="widget-feedback" data-title="Обратная связь" data-stick="right">
    <div data-type="chat"></div>
</div>
...
Вызов чата в мессенджере
...
<div data-block="widget-feedback" data-title="Обратная связь" data-stick="right">
    <div data-type="telegram" data-url="https://t.me/example"></div>
</div>
...
Общий пример
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <div data-block="widget-feedback" data-title="Обратная связь" data-stick="right">
                       <div data-type="call" data-url="+7 012 345-67-89"></div>
                       <div data-type="telegram" data-url="https://t.me/example"></div>
                       <div data-type="mail" data-url="mailto:mail@example.com"></div>
                       <div data-type="chat"></div>
                   </div>
               ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Форма обратной связи
Вы можете добавить на Турбо-страницу форму обратной связи. Поля формы предопределены:
  • телефон;
  • имя;
  • вопрос.
Форму можно разместить несколькими способами:


В этом случае используйте элемент form со следующими атрибутами:
АтрибутОписание
data-typeПринимает значение callback.
data-send-to *
Позволяет указать адрес электронной почты, на который будет отправлено обращение пользователя.
Примечание. Используйте адрес, размещенный на вашем домене, а не на сторонних почтовых ресурсах. Если у вас нет такого адреса, воспользуйтесь сервисами-посредниками, например Яндекс.Почта для домена.
data-agreement-company **Позволяет указать юридическое название вашей организации. Например, ООО «Ромашка».
data-agreement-link ***Позволяет указать ссылку на пользовательское соглашение о предоставлении обратной связи.

* Обязательный атрибут.

** Атрибут становится обязательным, если указан атрибут data-agreement-link.

*** Атрибут становится обязательным, если указан атрибут data-agreement-company.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <form
                    data-type="callback"
                    data-send-to="mail@example.com"
                    data-agreement-company="ООО Ромашка"
                    data-agreement-link="http://example.com">
                   </form>
               ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Кнопка с произвольным содержимым

При нажатии такой кнопки пользователь может позвонить по указанному номеру или перейти на ваш сайт, например на страницу оформления заказа.



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

АтрибутОписание
formaction *Возможные значения:
  • номер телефона в формате RFC-3966, например tel:+7 012 345-67-89;
  • URL, ведущий на страницу сайта или чат в мессенджере.
data-turbo

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

  • true — по ссылке откроется Турбо-версия страницы, если она сформирована. Используется по умолчанию.
  • false — по ссылке откроется обычная страница или ее мобильная версия.

Если атрибут data-turbo не указан, по ссылке откроется Турбо-страница, если она сформирована.

data-background-color

Цвет кнопки. Возможные значения:

  • текстовое, например white;
  • HEX, например #FFFFFF.

Если атрибут не указан, используется серый цвет.

Таблица «безопасных» цветов, рекомендуемых для экранного дизайна.

data-color

Цвет текста. Возможные значения:

  • текстовое, например white;
  • HEX, например #FFFFFF.

Если атрибут не указан, используется серый цвет.

Таблица «безопасных» цветов, рекомендуемых для экранного дизайна.

data-primary
Выделение текста жирным. Возможные значения:
  • true;
  • false.
disabledПозволяет отобразить кнопку неактивной.

* Обязательный атрибут.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <button
                    formaction="tel:+7 012 345-67-89"
                    data-background-color="white"
                    data-color="black"
                    data-turbo="false"
                    data-primary="true">8 800 123-45-67</button>
               ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Оформление содержимого в виде аккордеона


Вы можете использовать вертикально сложенный список элементов. Каждый элемент списка может быть развернут или свернут.

Используйте вложенную структуру элемента div. Головной элемент содержит:

АтрибутОписание
data-block *Принимает значение accordion.

Вложенные элементы div могут содержать:

АтрибутОписание
data-block *Элемент списка. Принимает значение item.
data-title *Название элемента в списке.
data-expanded

Позволяет отображать элемент раскрытым. По умолчанию элемент скрыт. Возможные значения:

  • true;
  • false.

* Обязательный атрибут.

<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Текст с <b>выделением</b> и списком:</p>
                   <img src="http://example.com/img.jpg" />
                   <div data-block="accordion">
                       <div data-block="item" data-title="Москва">Текст</div>
                       <div data-block="item" data-title="Санкт-Петербург" data-expanded="true">Текст</div>
                   </div>
               ]]>
           </turbo:content>
       </item>
    </channel>
</rss>
Позиция рекламного блока
Внимание. Не добавляйте рекламные блоки чаще, чем через каждые 250 слов страницы. Часто расположенная реклама ухудшает читаемость сообщений на Турбо-страницах. Из-за этого со временем пользователи могут перестать переходить на ваши страницы.
Чтобы указать место на странице, где должен размещаться рекламный блок, используйте элемент figure. Он должен содержать атрибут data-turbo-ad-id со значением, указанным в элементе turbo:adNetwork или на странице Турбо-страницы → Настройки Яндекс.Вебмастера. О том, как указать рекламу в интерфейсе, см. раздел Дополнительные настройки.
<rss
    xmlns:yandex="http://news.yandex.ru"
    xmlns:media="http://search.yahoo.com/mrss/"
    xmlns:turbo="http://turbo.yandex.ru"
    version="2.0"
>
    <channel>
        <turbo:adNetwork
         type="Yandex"
         id="идентификатор блока"
         turbo-ad-id="first_ad_place">
        </turbo:adNetwork>
        <item turbo="true">
           <link>http://www.example.com/page1.html</link>
           <turbo:content>
               <![CDATA[
                   <header>
                       <figure>
                           <img
                            src="http://example.com/img.jpg" />
                       </figure>
                       <h1>Заголовок страницы</h1>
                       <menu>
                           <a href="http://example.com/page1.html">Текст ссылки</a>
                           <a href="http://example.com/page2.html">Текст ссылки</a>
                       </menu>
                   </header>
                   <p>Первый абзац текста</p>
                   <img src="http://example.com/img.jpg" />
                   <p>Второй абзац текста</p>
                   <figure data-turbo-ad-id="first_ad_place"></figure>
               ]]>
           </turbo:content>
       </item>
    </channel>
</rss>

Символы и кодировки

В экспортном файле укажите кодировку, отдаваемую вашим сервером. Наиболее часто используются: UTF-8, Windows-1251, KOI8-R.

Во всех элементах RSS-файла, кроме содержимого раздела <![CDATA[]]>, необходимо кодировать следующие символы:

СимволНазваниеКод замены
&Амперсанд&amp;
>Правая угловая скобка&gt;
<Левая угловая скобка&lt;
"Кавычки&quot;
'Апостроф&apos;

Например, ссылка http://example.com/?id=1&page=10 должна быть приведена к виду http://example.com/?id=1&amp;page=10.