Внедрение микроразметки Schema.org в блог материалов Joomla 3

Продолжаем внедрение микроразметки в наш Joomla сайт. В предыдущей статье мы добавили микроразметку в тело статьи, на этот раз настало время проверить, как обстоят дела с семантической разметкой материалов в блоге категории. Для начала как обычно воспользуемся помощью «друга» - валидатора микроразметки и посмотрим, есть ли ошибки связанные с микроразметкой на нашем сайте.

Первый тест я запустил в инструменте проверки структурированных данных от Google. Прямо скажу, результат меня не сильно образовал, Гугл обнаружил целый набор ошибок. Однако все оказалось не так страшно.

Ошибки в микроразметке блога Joomla 3 выявленные валидатором от Google

Инструмент проверки структурированных данных указал на 20 ошибок и 10 предупреждений в элементе типа Blog. В валидаторе микроразметки от Яндекса ошибок (предупреждений) получилось несколько меньше, всего 11 штук, но по большому счету все они идентичные. Если отсеять лишнее, то можно выделить одну основную проблему указанную Яндексом – «Не выполнено обязательное условие для структурированных сниппетов творческих работ: поле description или articleBody отсутствует или пусто»:

Валидатор микроразметки от Яндекса так же говорит об ошибках в микроразметке блога

Начнем исправление ошибок микроразметки в блоге с проблем, которые показал нам Google. Ошибки эти стандартные – не указан автор, заголовок, издатель, дата модификации и изображение:

Основные ошибки в микроразметке выявленные Гуглом относятся к отсутствующим данным о дате модификации, авторе материала, издателе и т.п.

Первым делом давайте исправим ошибку, связанную с полем «mainEntityOfPage». Открываем файл blog_item.php расположенный в папке /components/com_content/views/category/tmpl, но лучше все же создать переопределение шаблона блога категории. Добавляем в данный файл уже знакомую нам с предыдущей статьи строку:

<meta itemscope itemprop="mainEntityOfPage" itemType="https://schema.org/WebPage" itemid="<?php $shemaURL = &JFactory::getURI(); print $shemaURL; ?>" content="<?php echo $this->escape($this->item->title); ?>"/>

Одной проблемой меньше, идем дальше. Теперь нам необходимо добавить информацию о дате модификации каждого материала (статьи) в блоге при помощи атрибута «dateModified», но при этом выводить её на экран мы не будем:

<time datetime="<?php echo ($items->modified); /*Показываем точную дату модификации*/?>" itemprop="dateModified"></time>

Добавляем поля author и publisher

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

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

<div itemprop="author" itemscope itemtype="http://schema.org/Person" style="position: absolute;left: -9999px;">
 <span itemprop="name">Joom4all.ru</span>
</div>
<div itemprop="publisher" itemscope itemtype="https://schema.org/Organization">
 <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
  <img itemprop="url image" src="/templates/joom4all/images/logo-min.png" style="display:none;"/>
  <meta itemprop="width" content="230">
  <meta itemprop="height" content="109">
 </div>
 <meta itemprop="name" content="Joom4all.ru">
 <meta itemprop="address" content="Москва">
 <meta itemprop="telephone" content="+7 999 000–00–00">
</div>

Таким образом, я использовал одинаковые данные, как для отдельного материала, так и для каждого материала выведенного в виде блога. После внесенных изменений и повторной проверке Гугл сообщает только о двух ошибках – необходимо указать значение для поля headline и для поля image.

Добавляем недостающие поля headline и image в разметку блога

Почему в блоге категорий для материалов не определены свойства микроразметки, такие как headline и image? Действительно вопрос, ведь все же в Joomla 3 микроразметка Schema.org достаточно качественно составлена. Но как выяснилось, недочеты все же есть. Свойство headline должно быть у заголовков материалов, давайте разберемся, почему в блоге категории Joomla заголовкам материалов не присвоено данное свойство.

Для начала нужно определиться, каким образом у нас формируется заголовок статьи в блоге, если посмотреть на код шаблона блога можно заметить следующую строку:

<?php echo JLayoutHelper::render('joomla.content.blog_style_default_item_title', $this->item); ?>

Да, заголовок материалов в блоге выводится при помощи такой хитрой конструкции, а если точнее с её помощью мы ссылаемся на новый файл, предназначенный для формирования заголовка. Этот файл под названием blog_style_default_item_title.php находится в папке /layouts/joomla/content и его содержимое следующее:

Содержание файла blog_style_default_item_title.php отвечающего за формирование заголовка материалов в блоге

Как видите, заголовок получил от разработчиков атрибут микроразметки name, а если в настройках выводить его в виде ссылки, то к нему еще добавляется атрибут url. Не будем ковырять данный файл, оставим все как есть, но чтобы добиться желаемого результата и избавиться от ошибки придется внести некоторые изменения в файл blog_item.php.

Единственное что нам стоит сделать, это обернуть код вывода заголовка новым блоком div, в результате должна получиться следующая строка:

<div itemprop="headline"><?php echo JLayoutHelper::render('joomla.content.blog_style_default_item_title', $this->item); ?></div>

С заголовком и свойством headline разобрались, переходим к изображению материалов в блоге. Тут, как и с заголовком, тоже не все так просто. Для вывода изображения, как и заголовка, используются слои:

<?php echo JLayoutHelper::render('joomla.content.intro_image', $this->item);?>

Чтобы разобраться, как именно выводится изображение, и какие атрибуты для него выделены, придется лезть в файл intro_image.php расположенный в папке /layouts/joomla/content. Содержимое данного файла следующее:

Код файла intro_image.php отвечающего за вывод миниатюры изображения материала в блоге Joomla 3

Как можно заметить, под миниатюры изображений выделен атрибут thumbnailUrl, и я считаю это вполне логично, но мнение Гугла на этот счет несколько иное, ему, видите ли, подавай изображение с соответствующим атрибутом (image).

Тут поступить можно двумя способами, первый самый простой – добавить новое изображение в файл blog_item.php и присвоить ему соответствующий атрибут, а чтобы изображение не дублировалось скрыть его с глаз при помощи стилей:

<? $arrImg=json_decode($this->item->images); ?>
<img itemprop="image" src="<? echo($arrImg->image_intro); ?>" style="display:none;"/>

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

Другой вариант это внесение изменений в файл intro_image.php, но чтобы после очередного обновления Joomla внесенные изменения не пропали лучше скопировать данный файл в папку templates/имя_шаблона/html/layouts/joomla/content и только после этого приступать к правке.

Открываем файл intro_image.php и ищем в нем следующий код (строка 22 и 27):

src="<?php echo htmlspecialchars($images->image_intro, ENT_COMPAT, 'UTF-8'); ?>" alt="<?php echo htmlspecialchars($images->image_intro_alt, ENT_COMPAT, 'UTF-8'); ?>" itemprop="thumbnailUrl"/>

добавляем атрибут image, в результате строки должны получиться такими:

src="<?php echo htmlspecialchars($images->image_intro, ENT_COMPAT, 'UTF-8'); ?>" alt="<?php echo htmlspecialchars($images->image_intro_alt, ENT_COMPAT, 'UTF-8'); ?>" itemprop="thumbnailUrl image"/>

Очередной раз запускаем инструмент проверки структурированных данных от Google и радуемся отсутствию ошибок.

Проверка микроразметки блога в валидаторе Яндекса

Запускаем тот же самый тест в валидаторе микроразметки от Яндекса, тут собственно все без изменений, как и прежде две ошибки:

  • Не выполнено обязательное условие для структурированных сниппетов творческих работ: поле description или articleBody отсутствует или пусто;
  • поле interactionCount не определено в спецификации https://schema.org/Article.

Что делать с полем interactionCount мы говорили в предыдущей статье, когда внедряли микроразметку в статьи Joomla 3. Повторяем все те же действия и ошибки исчезнет. А вот что касается ошибок связанных с полями description и articleBody надо разбираться.

Как выяснилось все дело в том, что краткое описание материала выводится совершенно без разметки при помощи вот такой строчки кода:

<?php echo $this->item->introtext; ?>

Вы наверно уже догадались, что тут можно сделать? Правильно обернуть этот код блоком div и добавить ему необходимый атрибут. Какой атрибут выбрать description или articleBody? Лично я думаю, что логичнее всего будет использование атрибута description, ведь все же это вступительный текст, другими словами краткое описание статьи. Код у меня получился вот таким:

<div class="intro" itemprop="description">
 <?php echo $this->item->introtext; ?>
</div>

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

Однако даже если описание категории будет составлено и выведено, ошибка сама собой не исчезнет, ведь для описания микроразметка не предусмотрена и её надо будет добавить. По умолчанию описание категории выводится при помощи вот такого кода:

<?php if ($this->params->get('show_description') && $this->category->description) : ?>
 <?php echo JHtml::_('content.prepare', $this->category->description, '', 'com_content.category'); ?>
<?php endif; ?>

Нам же необходимо обернуть код вывода описания категории новым блоком div и добавить ему свойство «description»:

<?php if ($this->params->get('show_description') && $this->category->description) : ?>
 <div itemprop="description"> <?php echo JHtml::_('content.prepare', $this->category->description, '', 'com_content.category'); ?></div>
<?php endif; ?>

Вот и все, микроразметка Schema.org для блога категории в Joomla 3 составлена и прошла все проверки, по результатам которых ошибок обнаружено не было. Кто знает, возможно, в дальнейшем после внесения очередных изменений в словарь Schema.org будут появляться новые ошибки, которые надо будет исправлять, но сделать это будет уже гораздо проще, ведь мы уже знаем, что и как редактировать.

Добавить комментарий


Комментарии   

admin
+1 #1 admin 04.03.2018 00:28
Спасибо как раз сейчас внедряем на сайте климатической компании
Цитировать
Димыч
0 #2 Димыч 06.12.2018 19:31
Ошибка - не сильно обраЗовал
Цитировать
Аlex
0 #3 Аlex 03.05.2019 16:26
Спасибо за годную статью. Все получилось. Блог проходит валидацию.
Только для гл.стр. 1 ошибка "не определено поле description либо articleBody" не исчезает.
Подскажи, пжта, что нужно исправить. com_content\featured\default.php ??? Какую строчку исправить/добавить, чтобы разметить общее поле description?
Цитировать
Аlex
0 #4 Аlex 03.05.2019 19:46
Путем проб и ошибок вымучила)))) такой код, решающий проблему с валидацией в Яндексе.
В дополнение к этой статье напишу здесь, может кому пригодится:
В файл com_content\featured\default.php добавлена строчка, выводящая описание документа с классом, скрывающим отображение :

После этого ОШИБКА "Blog Не выполнено обязательное условие для структурированных сниппетов творческих работ: поле description или articleBody отсутствует или пусто" для главной страницы ИСЧЕЗЛА
Цитировать
Аlex
0 #5 Аlex 03.05.2019 19:52
К сожалению, код в комментариях обрезается...
Цитировать