Как внедрить микроразметку в шаблон блога

Автор:Дата:Без плагинов, сторонних генераторов и лишних трудозатрат внедряем микроразметку Schema в шаблон блога. Размечаем авторство, дату, описание

микроразметка schemaВ предыдущей статье мы обсудили, зачем использовать микроразметку, какие данные стоит размечать и так далее. Сегодня разберемся, как внедрить эти микроформаты в шаблон блога на движке Вордпресс, чтобы сделать работу с ними максимально удобной и адекватной. Как всегда, предлагаю делать это без плагинов. Один раз прописать в шаблоне и расслабиться!

Популярные варианты размещения микроразметки

Если вы посмотрите в поиске, как нам предлагается работать с микроданными — то обнаружите три самых популярных варианта:

  1. Установить плагин;
  2. Использовать внешний инструмент;
  3. Вписывать микроразметку в редакторе;

Эти возможности кажутся мне, мягко говоря, кособокими. Посудите сами!

Плагины для микроразметки

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

Внешние генераторы микроразметки

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

— Справедливо? — Конечно!

— Нужно оно нам? — Нет!

К тому же, полученный код не повисает в воздухе — его надо куда-то прописать. То есть, вопрос, где и как расположить микроразметку? — остается.

Самостоятельное внедрение микроразметки

И, наконец, можно посмотреть на примеры разметки текста и внедрить ее прямо в редакторе (не визуальном, конечно, а в режиме «Текст»). Но это уже за гранью добра и зла. Зная, сколько времени занимает написание и оформление каждого поста — не стоит даже заикаться о том, чтобы еще что-то где-то прописывать. Пусть даже мы так набьем руку, что будем жонглировать микроформатами, практически, не задумываясь… Не вариант!

Интересно, что во множестве статей, которые я пересмотрела по теме — я видела именно эти способы в разной степени понятности и в разных сочетаниях. Может, была невнимательна…

В общем, то, что я предлагаю вам — это плод моих экспериментов с микроразметкой в блоге. Могу утверждать, что ее валидаторы Яндекса и Google ее увидят. А уж, используют ли поисковики эти данные для сниппета или нет — это, увы, вне моей власти :)

Как мы хотим добавлять микроразметку в шаблон

Мы хотим один раз определить, какие варианты микроразметки нас интересуют. Потом настроить все так, чтобы данные размечались автоматически. Если нам что-то новенькое взбредет в голову, то можно вернуться и добавить новые строки в код. Вот тот максимум труда, на который мы согласны!

Разметка авторства, даты и описания в формате Schema

Немного о разных форматах и отношении к ним поисковиков

В предыдущей статье я рассказала, почему считаю именно эти данные достойными микроразметки. По крайней мере, для своего Блоготея.

Поисковые системы Яндекс и Google видят любую микроразметку, но есть схемы и форматы, которые они, скажем, «воспринимают» и могут использовать в сниппетах. А есть виды данных, которые не входят в сферу их интересов.

Например, Google желает видеть разметку авторства в формате hcard. А Яндекс считает, что так должны размечать свои данные именно организации. Для личных имен наш могучий поисковик предпочитает Schema. О том, как оформить имя автора и дату публикации в микроформате hcard читайте тут. А дальше мы познакомимся со стандартом Schema, который дает автору простор для микро-творчества.

Еще стоит уточнить, что Яндекс готов «понять» далеко не все. На сегодняшний день он может использовать при формировании своей выдачи следующие микроданные:

  • данные об организациях, адреса, отзывы;
  • словарные статьи;
  • картинки и видео;
  • статьи о фильмах (описания рецензии);
  • кулинарные рецепты;
  • музыкальные аккорды;
  • отзывы об автомобилях;
  • целевая аудитория (типа, «18+» или «дети от 3 до 90 лет»)
  • творческие работы;

Причем, схема для творческих работ была добавлена Яндексом совсем недавно. И именно это сделало тему микроразметки актуальной и интересной для большинства авторов блогов. Ведь под творческой работой (CreativeWork) подразумевается любая статья, в том числе, в блоге. Вот список схем на сайте http://ruschema.org/ :

ruchema1

КЛИКНИТЕ, чтобы увеличить

Подробно мы не будем сегодня изучать этот формат. Просто отметим себе, где он есть. Англо-читающим предлагаю посетить их исходный сайт Schema.org

Еще нужно понять один нюанс:

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

Теперь приступим…

Код для микроразметки 

Имя автора:

<div itemscope itemtype="http://schema.org/BlogPosting">
Автор:<span itemprop="author"><?php the_author(); ?></span>
</div>

Дата публикации:

<div itemscope itemtype="http://schema.org/BlogPosting">
Дата:<span itemprop="datePublished"><?php the_time('c') ?></span>
</div>

Обратите внимание на формат даты ‘c’ — это формат ISO 8601 — ЕДИНСТВЕННЫЙ, который хотят видеть поисковые системы. И хотя выглядит такая дата по-дурацки (2013-10-04T10:00:48+00:00) — приходится мириться…

Описание (description):

<div itemscope itemtype="http://schema.org/BlogPosting">
<span itemprop="description"><?php echo get_post_meta($post->ID, 'description', true) ?></span>
</div>

Понятно, что мы можем впихнуть все три формата в один контейнер div. Например, так:

<div itemscope itemtype="http://schema.org/BlogPosting">
Автор:<span itemprop="author"><?php the_author(); ?></span>
Дата:<span itemprop="datePublished"><?php the_time('c') ?></span>
<span itemprop="description"><?php echo get_post_meta($post->ID, 'description', true) ?></span>
</div>

Добавив классы CSS, вы сможете вписать эту информацию в общий стиль вашего блога.

Где размещать такую информацию? — Я решила выводить ее вверху статьи. В небольшой таблице. Конечно, она совершенно не нужна читателю — ведь я надеюсь, что он прочитает весь пост, а не только его краткое описание. Но это возможный компромисс, между удобством ботов и людей.

Для этого, я собрала код в таблицу и вставила его в шаблон поста (страница single.php) — сразу после заголовка (title), перед контентом (content). Вот, как это выглядит у меня (реализацию можно посмотреть под заголовком каждого поста Блоготея):

<h1 class="entry-title"><?php the_title() ?></h1>

<div class="mystyle" itemscope itemtype="http://schema.org/BlogPosting">
<table class="mystyle"><tr>
   <td>Автор:<span itemprop="author"><?php the_author(); ?></span></td>
   <td>Дата:<span itemprop="datePublished"><?php the_time('c') ?></span></td>
   <td><span itemprop="description"><?php echo get_post_meta($post->ID, 'description', true) ?></span></td></tr>
</table><div class="line"></div>
</div>

   	 <?php the_content(); ?>

Этот код не нужно копировать себе в шаблон — это просто пример того, как можно вписать микроразметку в шаблон поста!

Валидаторы обоих поисковиков правильно видят такую мироразметку.

Яндекс:

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

КЛИКАЙТЕ, чтобы увеличить

Google:

валидатор микрорзметки от Google

КЛИКАЙТЕ, чтобы увеличить

И все! Нам не нужно будет заполнять никаких окошек каждый раз, даже лишнюю галочку не придется ставить нигде… Жду ваших мнений в комментариях!

Оставайтесь на связи! Блоготей пришлет вам новые статьи на почту!
Введите свой E-MAIL:

     Katyaru 22.01.2014


    
Читайте БлоготеЙ! на Google+
Читайте БлоготеЙ! на Фейсбуке

К записи "Как внедрить микроразметку в шаблон блога" оставлено 48 коммент.

  1. nehydna:

    Мамочки… Для меня эти коды — темный лес до сих пор. Пойду сначала предыдущие почитаю, а то глаза уже квадратные…

    [Ответить]

  2. Елена:

    Ой для меня это все -темный лес. Не разобраться. И даже вникать не могу — не лезет.Потому и забросила блог на Вордпрессе

    [Ответить]

  3. Katyaru:

    Девочки, вы меня пугаете)))

    [Ответить]

  4. Анна:

    Т.е. то, что последнее надо просто вставить в файл темы single.php?

    [Ответить]

    Katyaru отвечает:

    Да

    [Ответить]

  5. tanichka:

    У меня до микроразметки по плану еще четыре пункта затратных по времени реорганизаций, ставлю пятым пунктом разобраться в этом вопросе.

    [Ответить]

    Katyaru отвечает:

    Озвучишь другие пункты?

    [Ответить]

  6. Блогобабушка:

    Я а бы хотела, чтобы рядом с постом в поисковике выводилась картинка :)

    [Ответить]

    Katyaru отвечает:

    Все бы хотели :)

    [Ответить]

  7. Алевтина:

    Начинаю читать и думаю о том, какие люди сейчас грамотные и продвинутые, а я темнота полнейшая.

    [Ответить]

    Блогобабушка отвечает:

    Алечка, у тебя еще все впереди. Я вон тоже несколько дней билась с настройкой плагина и думала — что же я такая тупая?… А потом до меня дошло, что плагин не может сделать того, что мне нужно, он делает, как правильно :)

    [Ответить]

    Katyaru отвечает:

    Кстати, Люда, я жду тебя в чате, чтобы узнать, что с плагином. Я за него переживаю)))

    [Ответить]

    Блогобабушка отвечает:

    Иду :)

    [Ответить]

    Katyaru отвечает:

    Не-е-е. Это просто кому что интересно — тот тем и морочится)))

    [Ответить]

  8. ladosha:

    Темна вода в облацех… Не осилить мне сих премудростей!

    [Ответить]

  9. ирина:

    Пойду-ка я лучше статейку напишу, а с разметкой девочки, я пас….

    [Ответить]

  10. Алиса:

    Вечно ищу куски кода, потом все опять забываю, теряю)

    [Ответить]

  11. Андрей:

    Спасибо, у Вас самое лучшее решение! К сожалению, используя Ваш код, у меня на странице не выводится описание(description). Блог на WP и установлен плагин All In One SEO Pack. Не подскажете как можно откорректировать код описания?

    [Ответить]

    Katyaru отвечает:

    Здравствуйте, Андрей! Первое, что я должна спросить: а Вы прописываете описание в полях плагина All In One? Второе (если прописывете): посмотрите в списке произвольных полей (вот статья о них /proizvolniye-polya/ ), генерирует ли плагин поле description? — Если, вдруг, не генерирует, то это какой-то ломаный плагин. Просто нужно его переустановить (с официального сайта вордпресс) или поставить Platinum SEO Pack (вот статья о нем /platinum_seo/ )

    [Ответить]

  12. Валентина:

    А почему вы выбрали BlogPosting? Я вот решила, что лучше Article. Дело в том, что если помечать BlogPosting, поисковики анализируют до 200 слов, а если Article, то 400, они считают, что пост не должен быть длинным, но мы то с вами пишем довольно длинные посты, поэтому лучше Аrticle.

    [Ответить]

    Katyaru отвечает:

    Вот пример вдумчивого подхода! Возможно переделаю на Article…

    [Ответить]

  13. Sergey:

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

    [Ответить]

    Katyaru отвечает:

    Да, увы, они теперь дату хотят видеть в таком формате некрасивом

    [Ответить]

    Валентина отвечает:

    Мне нравится Катин блог, и я надеюсь, она не обидится, если я кое в чем ее исправлю, ведь мы должны делиться идеями и опытом, тем более если это ново для всех. Дату можно отобразить так, как вы захотите, для этого есть одна хитрость, которая описана здесь — happyblogging.ru/mikrorazmetka-wordpress/

    [Ответить]

    Валентина отвечает:

    Я очень осторожна с кодом на странице. А почему вы так боитесь ссылок. у меня на блоге — всегда пожалуйста.

    [Ответить]

    Katyaru отвечает:

    Я не боюсь) Но не считаю это возможным без разрешения автора) Не в обиду, но я считаю не вполне этичным поставить ссылку на аналогичную статью.

    [Ответить]

  14. Валя:

    Очень сложный вопрос, но интересно и доступно изложено.

    [Ответить]

  15. Валентина:

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

    [Ответить]

    Katyaru отвечает:

    Да я и не думала обижаться! :) Просто ответила, почему убираю ссылки и сама их не ставлю в своих комментах))) Все нормально. Решение с датой — очень правильное.

    [Ответить]

  16. Евгений:

    Здравствуйте, скопировал себе на сайт undelete-file.ru в шаблон записей, — автор показывается, дата тоже, а описания НЕТ. Почему? И гугл ругается на мою эту разметку? Что не правильно? Спасибо.

    [Ответить]

    Katyaru отвечает:

    Здравствуйте, Евгений!
    Вероятно, у Вас не работает php функция, которая должна выводить описание. У Вас стоит SEO-плагин, типа, All-in-One SEOpack или аналогичный. Думаю, что функции просто неоткуда взять описание. Или вы просто его не заполняли для статей… Сильнее ничего проинтуичить не могу)

    [Ответить]

    Евгений отвечает:

    Стоит All-in-One SEOpack, описание, ключи везде заполнены!
    Как исправить? Или функции добавить?

    [Ответить]

    Katyaru отвечает:

    А Вы не добавили функцию, которая выводит описание? Вот, как в коде в статье.
    Евгений, извините, я сейчас еще работаю, но понимаю уже очень туго))) Единственное, что очевидно сейчас — описание появится, если заработает php-функция…

    [Ответить]

  17. Александр Борисов:

    Привет. Спасибо за статью, только я не понял одного. А зачем выводить описание? Ведь их получается будет два?

    В all in one seo pack выводится одно и будет второе?

    [Ответить]

    Александр Борисов отвечает:

    Было бы круто itemprop=»description» просто прописать там где плагин all in one seo pack выводит описание, вот это высший клас, только где это делается я не знаю.

    [Ответить]

    Katyaru отвечает:

    Вот тут есть ответ /proizvolniye-polya/

    [Ответить]

    Александр Борисов отвечает:

    Спасибо, но я ни чего не понял.

    [Ответить]

    Katyaru отвечает:

    :)

    [Ответить]

    Александр Борисов отвечает:

    Я прописал строчку ID, ‘description’, true) ?> в single.php, но описание не показывает http://webmaster.yandex.ru/microtest.xml все равно! Значит описание каким-то другим кодом выводится в новых версиях пресса.

    [Ответить]

    Katyaru отвечает:

    (извините, что только сейчас нашла Ваш коммент — попал в СПАМ почему-то) Ну надо, как минимум, вписать все, вместе со строкой, указывающей на адрес шаблона разметки, прописывать… Вы так сделали?

    [Ответить]

    Katyaru отвечает:

    Спасибо за отклик) В All in One дается SEOописание для поисковиков. На странице будет одно описание — видимое пользователям. Оно же станет частью и микроразметки, которую считывают «другие роботы» поисковиков… Как-то так.

    [Ответить]

  18. Юрий:

    Бодрого дня! Есть такой плагин для Chrome, SeoQuke называется. Этот плагин не видит микроразметки на вашем блоге. Сегодня целый день потратил на изучение микроразметки, вернее, как ее применить, но нигде ничего не могу найти. Думал воспользоваться вашим способом, но неизвестно, работает ли он.

    [Ответить]

    Katyaru отвечает:

    Да-да, был у меня Сеоквейк (сейчас что-то слетел — хром обновился). Он много чего не видит… Мне кажется, важнее, что ее видят валидаторы Яндекса и Гугла.

    [Ответить]

  19. Юра:

    Вот я и подумал: возможно плагин не видит. Хорошо, если так. Буду завтра устанавливать разметку.
    Успехов!

    [Ответить]

  20. Юрик:

    Екатерина, а в чем разница между BlogPosting и Article?! Я размещал разметку с помощью инструментов Google, но там мне система указала, что указать нужно Article (в начале выбрал «Статья», так как более подходящего не было).
    Вы бы могли посоветовать что-то для меня, — сайт автомобильной тематики об конкретно одном бренде (новости, двигатели, характеристики), ну, вообщим публикую практически все, что связано с этой маркой.

    [Ответить]

    Katyaru отвечает:

    Да, в сущности, особой разницы не вижу. Главное, чтобы Гугл заметил, что есть разметка. На ранжирование, имхо, это сильно не повлияет. Просто добавит ресурсу некого «траста» в глазах поисковика. Поскольку Ваш блог все-равно не официальный сайт бренда — размечать его стоит, как любой другой. Если у Вас есть обзоры отдельных деталей, например, можете посмотреть разметку review здесь http://schema.org/Review

    [Ответить]

  21. Алексей:

    Катерина здравствуйте, искал информацию про микроданные попал на Ваш блог. Подскажите пожалуйста, я воспользовался инструментов для вебмастеров от гугл, после проверки структурированных данных ввел url одной из записей на блоге, мне выдало ошибку. Что это может быть, как ее исправить?

    Ошибку выдает после оставления комментариев пользователями?

    hcard
    fn: Андрей Назыров
    person-name:
    family-name: Назыров
    given-name: Андрей
    url:
    http:…

    Ошибка. If this markup is about a person, at least 2 of the following fields are needed: organization, location, or role. See the people help page for more information.

    [Ответить]

    Katyaru отвечает:

    Здравствуйте. По сути, это и не ошибка. Просто Гугл считает, что для обозначения человека нужно добавить еще поля «организация», «местоположение» или «роль» («должность»).

    [Ответить]


девять − 7 =

Палю тему!
Гугл в помощь
Надо подписаться!

Введите свой E-MAIL:

Delivered by FeedBurner

Дружите с Блоготеем в соцсетях


Смотрите все ВИДЕО Блоготея на YouTube


Blogotey | 


Спутник Блоготея в Tumblr

Наверх