Как сделать микроразметку главной страницы сайта и страницы комментариев

Вот, наконец дошла очередь до микроразметки Главной страницы сайта и страниц категорий.

Я предлагаю использовать разметку Schema.org, как самую популярную + понимаемую всеми основными игроками интернета (поисковыми системами, сервисами социальных сетей и пр.).

Добавление микроразметки на сайт процесс не сложный — нужно найти в файле нужный раздел, затем обернуть его блоком, после чего задать тип разметки (например, статья, изображение, видео и пр.).

А к отдельным элементам добавить специальные параметры разметки (заголовок, текст статьи, метаданные, автор, дата и пр.).

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

<div itemprop="mainEntityOfPage">

Итак, как сделать микроразметку Главной страницы сайта и страниц категорий?

Сначала, нам нужно выбрать подходящую сущность – полный перечень сущностей можно найти на этой странице.

Поскольку у нас сайт (или блог), нам подойдет сущность Article или BlogPosting.
Микроразметку для Article я уже описывала (ссылку на нее вы найдете внизу поста), поэтому сегодня рассмотрим BlogPosting.

В спецификации сущности blogPosting выберем пункты, которые нам подходят, это:

1. articleBody – собственно, статья,
2. mainEntityOfPage – указание на то, что статья является основным материалом по этой теме,
3. description – описание, по-сути, анонс статьи,
4. articleSection – раздел, в котором она находится (разделов может быть много),
5. url - полный адрес статьи,
6. author - автор,
7. headline - полное название статьи,
8. datePublished - дата публикации,
9. dateModified – дата изменения,
10. commentCount - количество отзывов или комментариев.

Теперь, нам нужно добавить разметку в файлы темы, отвечающие за вывод анонсов на Главной и в категориях. Это могут быть home., index., category. или archive.php.

В них находится цикл вывода анонсов или подключение файла с этим циклом.

Цикл вывода анонсов начинается кодом:

 if (have_posts()): while (have_posts()): the_post();

Подключение выглядит примерно так:

require_once(TEMPLATEPATH."/includes/loop.php");

Или так:

include(TEMPLATEPATH."/includes/loop.php");

Или как-то так:

get_template_part( 'content' );

Далее, нужно открыть указанный файл.
В первом случае это loop.php, а в последнем content.php.

Ход действий:

1. Находим div, которым обернут цикл, добавляем к нему объявление основной сущности для этой страницы: itemscope itemtype=http://schema.org/BlogPosting. Вот так:

   <div itemscope itemtype="http://schema.org/BlogPosting">

   <div itemscope itemtype="http://schema.org/BlogPosting">

2. Далее, отслеживаем нужные элементы на странице и добавляем к ним параметр itemprop="", со значениями, перечисленными выше (articleBody, mainEntityOfPage, description).
   Например, к div, который оборачивает вывод статьи, добавляем itemprop="articleBody" .
   Вот так:

   <div itemprop="articleBody">

   <div itemprop="articleBody">

   Так же поступаем со всеми другими блоками на странице.

Правила добавления разметки:

1. Параметр itemprop добавляется к div, оборачивающему только нужную сущность.

   Пример неправильного использования:

   <span itemprop="articleSection">Категория: <?php the_category(', ') ?></span>

   <span itemprop="articleSection">Категория: <?php the_category(', ') ?></span>

   Пример правильного использования:

   Категория: <span itemprop="articleSection"><?php the_category(', ') ?></span>

   Категория: <span itemprop="articleSection"><?php the_category(', ') ?></span>

2. Параметр itemprop может содержать несколько значений.
   Например, itemprop="url contentUrl".
   Здесь 1й параметр понимает Google, а 2й – Яндекс.
3. Если вы не хотите показывать некоторые сущности, например, свое имя или ссылку на полный текст статьи, эти сущности можно сделать невидимыми для пользователей.
   Для этого их нужно добавить к тегу META, вот так:

   <meta itemprop="author" content="Иван Петров" />

   <meta itemprop="author" content="Иван Петров" />

   Обратите внимание!
   Параметр content тега meta не может содержать ссылок.

   Чтобы скрыть от посетителей, ссылки лучше добавлять к тегу LINK, вот так:

   <link itemprop="url" href="Здесь ссылка" />

   <link itemprop="url" href="Здесь ссылка" />

Файл с микроразметкой Главной страницы сайта и страниц категорий скачайте по ссылке внизу поста ↓.

Теперь о том, как сделать микроразметку комментариев:

Код комментариев находится в файлах comments или functions.
Найдите вывод комментария, обычно он заключен в теги li, выглядит примерно так:

<li <?php comment_class(); ?> id="li-comment-<?php comment_ID( ); ?>">
    <div id="comment-<?php comment_ID( ); ?>" class="single_comment">
        <?php echo get_avatar( $comment, 50 ); ?>
        <div class="commentmetadata">
            <?php comment_author() ?>
             <span class="time"><?php comment_date('Y.m.d') ?> в <?php comment_time('H:i') ?></span>
             <?php if (function_exists('comment_subscription_status')) { if (comment_subscription_status()) { echo '(подписан на отзывы)'; } } ?>
             <?php edit_comment_link('Редактировать &raquo;','',''); ?>
        </div>
        <?php if ($comment->comment_approved == '0') : ?>
        <span class="moderation">Ваш отзыв на модерации.</span>
        <?php endif; ?>
            <div class="comment_text">
                <?php comment_text() ?>
            </div>
            <?php echo comment_reply_link(array('before' => '<div class="reply">', 'after' => '</div>', 'reply_text' => 'Ответить &raquo;', 'depth' => $depth, 'max_depth' => $args['max_depth'] ));  ?>
    </div>
</li>

К тегу li нужно добавить объявление сущности комментария: itemscope itemtype="http://schema.org/Comment" и параметр itemprop="comment".
Вот так:

<li itemprop="comment" itemscope itemtype="http://schema.org/Comment" <?php comment_class(); ?> id="li-comment-<?php comment_ID( ); ?>">

Далее, нужно найти вывод имени автора:

<?php comment_author() ?>

Обернуть его тегами span и добавить к открывающему тегу itemprop="author", вот так:

<span itemprop="author"><?php comment_author() ?></span>

Осталось последнее - вставить itemprop="text" в div, оборачивающий текст комментария. Вот так:

<div itemprop="text" class="comment_text">
   <?php comment_text() ?>
</div>

↓ Мои подписчики могут скачать файл с разметкой по ссылке ниже

Уже скачали 63 раз(а)

Открыть ↓

Только для подписчиков

Для разблокировки содержимого, введите код из последнего, присланного вам письма.

Помощь в разблокировке » Инструкция по разблокировке »

Проверить корректность микроразметки можно валидаторами микроразметки Яндекса и Google.