Создание турбо-страниц для Яндекса на CMS ModX Revolution 2.5.6 для блога на Tickets
Интро
Сниппет подготовки текста заголовка
Сниппет подготовки текста содержимого
Чанк турбо-страницы
Ресурс вывода RSS-канала
Результирующий XML-файл
Добавление в панель вебмастера
Проблематика
Заключение
Сегодня технология «турбо-страниц» компании «Яндекс» уже известна очень многим и ей пользуются все больше и больше интернет-ресурсов, делая свой контент еще доступнее аудитории пользователей интернета. Суть этой прекрасной технологии заключается в создании легких версий страниц, которые хранятся на серверах непосредственно самого «Яндекса» и загрузка которых происходит в разы быстрее даже при медленном соединении с интернетом.
Турбо-страницы могут формироваться двумя способами: через YML-файл, сформированный по требованиям сервиса «Яндекс.Маркета» или через RSS-канал, переданный владельцем сайта с помощью веб-интерфейса «Яндекс.Вебмастера» через API сервиса «Яндекс.Турбо-страницы».
В этой статье мы пошагово разберем процесс создания этих самых «турбо-страниц» через RSS-канал для блога, который создан на CMS ModX Revolution 2.5.6 и использующий для организации работы со статьями популярный многофункциональный компонент Tickets вместе с дополнением phpThumbOn.
Кстати говоря, перед началом работы будет не лишним предварительно проверить основные настройки системы ModX Revolution.
Сниппет подготовки текста заголовка
Согласно документации описания элементов RSS 2.0 в использовании технологии «турбо-страниц», во всех элементах RSS-файла, кроме содержимого раздела <![CDATA[ ... ]]>, необходимо кодировать следующие символы: «&» (амперсанд) — «&», «<» (левая угловая скобка) — «<», «>» (правая угловая скобка) — «>», «»» (кавычки) — «"», «’» (апостроф) — «'». Предполагается, что ваш сервер отдает данные в кодировке «UTF-8».
На основание вышеизложенной информации создадим сниппет, который будет подготавливать содержимое для указанных элементов: «title», «description» и прочих.
Создаваемый сниппет назовем «rssText» и вставим в него следующий код:
<?php
if(empty($cnt)) return '';
$output = str_replace( [ '&', '<', '>', '"', '\'' ], [ '&', '>', '<', '"', ''' ], html_entity_decode($cnt) );
return $output;
Пояснение: использование функции html_entity_decode внутри кода обусловлено предположением, что заголовок, дескрипшен или же текст другого элемента могут содержать html-сущности, поэтому сначала происходит процесс декодирования и лишь потом, кодируется с учетом требований документации «Яндекса».
Сниппет подготовки текста содержимого
Как нам говорит документация по подготовке «турбо-страниц» — содержимое <![CDATA[ ... ]]> в кодировании не нуждается. Но все же, кое-какую подготовку провести нужно: вырезать якоря и якорные ссылки, которые служат для внутренней навигации по странице.
Создадим еще один сниппет назвав его «rssCDATA» и вставим в него следующий код:
<?php
if(empty($cnt)) return '';
$output = preg_replace( '/<a\s.*class="pseudo".*>(.+)<\/a>/U', '$1', $cnt );
$output = preg_replace( '/<a\s.*><\/a>/', '', $output );
return $output;
Пояснение: ссылки на якоря страницы мы регламентируем наличием CSS-класса «pseudo», а в вашей же верстке скорее всего это определяется по-другому — выясните как и подставьте нужное регулярное выражение.
Чанк турбо-страницы
Итак, сниппеты подготовлены, а это значит, что теперь пора создать чанк, который будет отвечать за формирование данных для отображения на «турбо-странице» в «Яндексе».
Наш новый чанк мы назовем «tpl.yandex.turbo.rss» и вставим в него следующий код:
<item turbo="true">
<link>{$_modx->config.site_url ~ $id | url}</link>
<title>{'!rssText' | snippet : [ 'cnt' => ( $longtitle ?: $pagetitle ) ]}</title>
<pubDate>{$publishedon | date : 'D, d M Y G:i:s +0300'}</pubDate>
<turbo:content>
<![CDATA[
<header>
<figure>
<img src="{$_modx->config.site_url ~ $id | resource : 'image' | phpthumbon : 'w=640' | replace : '/assets' : 'assets'}" />
</figure>
<h1>{($longtitle ?: $pagetitle)}</h1>
</header>
{'!rssCDATA' | snippet : [ 'cnt' => ( $id | resource : 'content' | replace : '"assets/' : ('"' ~ $_modx->config.site_url ~ 'assets/') ) ]}
]]>
</turbo:content>
</item>
Помните о том, что вставленный код необходимо сохранить.
Ресурс вывода RSS-канала
Теперь создадим непосредственно сам ресурс, который будет отвечать за вывод в RSS-канал информации о турбо-страницах.
Важно! Компоновка элементов панели создания ресурсов может немного отличатся от вашей, т.к. ее вид зависит от установленных в системе ModX Revolution дополнений, например таких, как «SEO Pro».
Для нового ресурса мы зададим параметры, которые указаны ниже и сохраним страницу. Обратите внимание, что мы намеренно оставляем поле «Содержимое» пустым. Его заполнением займемся после того, как к ресурсу применятся наши настройки.
- Заголовок: «Турбо-страницы для Яндекс» (можно свой).
- Расширенный заголовок: «Турбо-страницы для Яндекс» (можно свой).
- Описание: «А это текст нашего описание» (можно свое).
- Шаблон - «Пустой шаблон».
- Скрыть из меню — «Да».
- Опубликован — «Да».
- Псевдоним: «turbo-straniczyi-dlya-yandeks» (можно свой).
- Тип ресурса — «Документ».
- Тип содержимого — «XML».
- Местонахождение содержимого — «Встроенный».
- Контейнер — «Нет».
- Использовать HTML-редактор — «Нет».
- Кэшируемый — «Нет».
- Очистить кэш — «Да».
- Удалён — «Нет».
- Заморозить URL псевдоним для этой страницы — «Да».
- Часть адреса URL следующая после https://mysite.domain/: «turbo.xml» (можно свое значение).
Настройки выставлены и сохранены. Но прежде, чем двигаться дальше, нужно обновить страницу, чтобы новые параметры были учтены в интерфейсе панели управления.
Настало время вставить в поле «Содержимое» созданного нами ресурса код (он указан ниже) и сохранить изменения:
<?xml version="1.0" encoding="utf-8"?>
<rss xmlns:yandex="http://news.yandex.ru" xmlns:media="http://search.yahoo.com/mrss/" xmlns:turbo="http://turbo.yandex.ru" version="2.0">
<channel>
<title>[[++site_name]]</title>
<link>[[++site_url]]</link>
<description>[[*description]]</description>
<language>ru</language>
[[!pdoPage?
&element=`getTickets`
&parents=`3`
&tpl=`tpl.yandex.turbo.rss`
&tvPrefix=`tv.`
&includeTVs=`image`
]]
</channel>
</rss>
В коде параметр &parents=`3` указывает на родителя статей/постов блога, т.е. на идентификатор ресурса-контейнера. Вам нужно указать свое значение.
Результирующий XML-файл
Теперь, указав в браузере URL к ресурсу, описывающего «турбо-страницы» — https://mysite.domain/turbo.xml — мы увидим сформированный XML-файл, который и нужно добавить в панель «Яндекс.Вебмастера». Но прежде, убедитесь, что в вашем файле «robots.txt» не запрещен доступ к RSS-каналу — это так же сказано в документации «Яндекса» о механизме обработки нового RSS-канала.
Добавление в панель вебмастера
Если Вы ранее не производили настройку «турбо-страниц» в панели «Яндекс.Вебмастера», то самое время это сделать.
Для этого перейдем в упомянутую выше панель вебмастера, выберем нужный нам сайт, раскроем в левом меню блок «Турбо-страницы» и выберем пункт «Настройки». Далее укажем для шапки страницы короткое название сайта и тип ее отображения (можно загрузить свое изображение). Добавим пункты меню, которые мы хотим отобразить пользователям, и подключим счетчики метрик. Остальные настройки редактируйте по мере ваших нужд. Сохраняем изменения настроек.
После всех вышеизложенных манипуляций система «ModX Revolution» готова предоставлять для нашего блога заветные «турбо-страницы» и «Яндекс» подготовлена к приему наших данных. А значит мы снова переходим в панель «Яндекс.Вебмастер» и выберем в нем нужный веб-сайт.
На открывшейся странице нужно принять условия публичной оферты, указать ссылку на источник (т.е. на XML-файл нашего RSS-канала) и нажать кнопку «Добавить».
После того, как источник был добавлен в панель вебмастера надо проверить его на наличие ошибок и если их нет — включить.
При включении источника «турбо-страниц» нужно подтвердить производимое действие нажав на кнопку «Да, включить».
Теперь остается дождаться окончания проверки файла системой. В информационной подсказке говорится о том, что проверка обычно занимает около 2 (двух) часов. Но на практике она может длиться гораздо дольше — наберитесь терпения.
После того, как XML-файл источника будет обработан, вам отобразится его статистика.
Ниже приводится изображение, которое демонстрирует на экране смартфона результат работы созданного нами механизма формирования «турбо-страниц» и его интеграции в панель системы «Яндекс.Вебмастер».
Проблематика
Иногда контент сайта содержит код, который априори должен быть закодирован — например, код внутри html-блоков <pre>...</pre>. И это порождает проблему отображения содержимого внутри турбо-версий страниц. Об этом дополнительно сообщает валидатор «Яндекса», когда при очередной обработке RSS-канала обнаруживает кодированные символы: «Cодержимое Турбо-страницы не соответствует оригинальной версии (в содержимом тега [CDATA[]] найдены закодированные символы)» (будет не лишним ознакомиться с перечнем часто встречающиеся ошибок RSS-канала).
Учитывая, что об этой проблеме упомянуло уже довольно большое количество интернет-пользователей, и ими так же были написаны обращения в службу технической поддержки компании «Яндекс», то скорее всего в скором времени эта несправедливость по отношению к обработке кодированных символов будет устранена. Ну, а пока... Ниже мы приведем несколько вариантов решения этой проблемы. Но учтите, что это не руководство к действию, а лишь информация к размышлению.
Вариант 1: в код ресурса, который формирует вывод RSS-канала, в вызов сниппета pdoPage нужно добавить параметр resources и перечислить в нем минусованные идентификаторы тех статей, которые содержат кодированные символы «&resources=`-8,-13`», тем самым запретив учитывать их при формировании «турбо-страниц».
Вариант 2: добавить использование семафора (некоего tv-поле) для статей, который будет служить флагом механизму RSS-канал, включать ли данную статью в XML-вывод, формирующий «турбо-страницы» и назначать ему (семафору) соответствующее значение, если статья имеет кодированные символы (данный метод позволит избавиться от постоянного ручного добавления минусованных идентификаторов непосредственно в код соответствующего ресурса).
Вариант 3: в сниппете подготовки текста для блока <![CDATA[ ... ]]> парсить содержимое на предмет наличия html-блоков <pre>...</pre> и заменять их содержимое — например, на текст «По техническим причинам данный код Вы можете увидеть только на оригинальной странице сайта» (но эта идея по ряду причин является потенциально опасной, т.к. «Яндекс» очень не любит подмены текстов и можно попасть под какие-нибудь фильтры/санкции поисковой системы).
Заключение
После того, как система «Яндекс» начнет использовать RSS-канал, в разделе «Сводка» панели вебмастера Вы можете увидеть текст примерно следующего содержания: «Турбо-версии используются только для 72% страниц сайта» (разумеется процент страниц для каждого сайта в каждом конкретном случае будет свой).
В этой статье мы разработали механизм для системы ModX Revolution, который формирует «турбо-страницы» только для статей из блога, игнорируя при этом остальные разделы. Так что для увеличения процента используемых турбо-версий страниц просто добавляйте нужные разделы в RSS-канал.
И еще... Важно помнить, что «Яндекс» отображает «турбо-страницы» только тогда, когда взаимодействие с системой осуществляется при помощи мобильных устройств, используя мобильную версию поиска, и только для тех страниц вашего сайта, которые участвуют в поиске, т.е. те, что находятся в так называемом «поисковом индексе».
Постоянно оптимизируйте свои интернет-ресурсы и делайте их более человекоориентированными!
14 октября 2018 в 23:33
Возможно Вам будет интересно прочесть и эти статьи
Теперь в турбо-версиях страниц для магазинов имеется возможность подключать разные формы обратной связи, добавлять YML-файлы, которые скрыты от посторонних глаз за паролем и еще некоторые полезности.
Статья-инструкция по расширенной первичной настройке системы ModX Revolution после ее «чистой» установки на веб-сервере под управлением Apache.