Пользовательские компоненты Турбо-страниц
Внимание
Рекламные блоки в пользовательских компонентах запрещены в любом виде. Чтобы разместить рекламу, используйте специальные рекламные блоки Adfox или РСЯ. Подробнее в разделе Реклама на мобильных.
Для Турбо-страниц можно создавать пользовательские компоненты и размещать их в своем RSS‑канале. Ознакомиться со списком пользовательских компонентов можно на GitHub. Например, среди них есть компонент ExtFancyButton.
Пример отображения компонента ExtFancyButton
:
Пример RSS-разметки:
<ExtFancyButton>
I am an external component
</ExtFancyButton>
Создание пользовательского компонента
Внимание
Для создания компонентов необходимы знания TypeScript и React.
Чтобы создать пользовательский компонент:
-
Создайте форк проекта turboext/components. Подробнее о создании форка в помощи GitHub
-
Создайте собственный компонент с соблюдением ограничений. Подробнее в README.md на GitHub.
-
Создайте Pull Request на внесение изменений в master-ветку turboext/components.
-
Дождитесь окончания тестов. Если тесты завершились с ошибками, исправьте их с соблюдением ограничений.
-
Дождитесь двух подтверждений от команды Турбо-страниц. После этого ваши изменения будут внесены в master-ветку.
-
В пятницу вечером будет создана и протестирована релизная ветка. Если тестирование пройдет успешно, в понедельник компонент окажется в продакшне.
После создания протестируйте отображение компонента в интерфейсе Вебмастера:
-
Перейдите на страницу Турбо‑страницы для контентных сайтов → Отладка.
-
Вставьте ваш компонент в RSS-разметку Турбо-страницы. Например, для компонента ExtFancyButton:
<ExtFancyButton> I am an external component </ExtFancyButton>
-
Нажмите Применить и проверьте отображение в примере справа.
-
Если пример отображается правильно, используйте компонент в собственном RSS-канале.
Задать вопрос по компонентам Турбо-страниц
Если у вас остались вопросы по компонентам Турбо-страниц, задайте их через форму обратной связи.
Обратная связь
Если у вас технический вопрос и вы зарегистрированы на GitHub, создайте issue.