logo

Блог Алeксандра Сергиенко

Я занимаюсь заработком в Интернете.
Читая мой блог, Вы узнаете насколько это реально.
Я выбрал свой путь. Вы со мной?
 

Как сделать микроразметку на сайте вордпресс?

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

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

Жил был поисковик, читал сайты, изучал информацию на них, некоторые индексировал, на некоторые накладывал фильтры... Устал он, стал упускать в индексе некоторую информацию, уж очень много сайтов создаётся, обновляется, что на отдых и времени нет. Тогда он решил упростить этот процесс и создал специальные атрибуты и сказал, что если поместить их на сайт, то уж точно он ничего не потеряет и вся информация, заключённая в эти атрибуты обязательно попадёт в индекс, а ключевая — в сниппет. И с тех пор те, кто прислушался к словам поисковика стали жить счастливо и был им заветный ТОП :) .



style="display:block"
data-ad-client="ca-pub-8243622403449707"
data-ad-slot="1319308473"
data-ad-format="auto">

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

Микроразметка помогает все данные собрать в определённую, удобную для поисковика, последовательность данных (структурирует данные), что облегчает последнему работу, по извлечению и переработке информации.

В 2011 году все крупные поисковики, такие как Гугл и Яндекс (они нас в большей мере интересуют) сообщили о внедрении семантической микроразметке.

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

Как проверить микроразметку?

Хорошо, если мы с вами разобрались, что такое микроразметка на сайте wordpress и для чего она нужна, то сразу возникает вопрос: а как узнать, есть ли семантическая микроразметка на сайте, в статье?

Для этого вам нужно войти в Яндекс Вебмастер, ввести Url проверяемой страницы сайта и нажать «Проверить микроразметку».

 

У Гугла микроразметку можно проверить здесь по аналогии.

Микроразметка на движке WordPress

Перед тем, как начать внедрение микроразметки, необходимо сначала убедиться, что у вас её нет. Для проверки используйте пост, в котором читатели оставили несколько комментариев. Дело в том, что в некоторых бесплатных шаблонах есть своя микроразметка формата "hCard«, в которой присутствуют атрибуты именно для описания человека, написавшего контент. Т.е. указывается фамилия, ник, аватар автора. Эту и любую другую микроразметку необходимо удалить и только после этого приступать к настройке микроразметки schema.org.

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

После того, как „левая“ микроразметка удалена, приступим к установке микроразметки  schema.org. Для начала разметим название сайта и его описание.

Для этого в админке блога открываем header.php, находим тег header и добавляем к нему  itemscope itemtypeгде itemscope указывает на то, что вся информация, которая будет заключена внутри тега, описывает какую-то сущность, а itemtype говорит, что это за сущность.

Теперь давайте покажем, что мы будем описывать именно header вордпресс-блога:

itemscope itemtype=»http://schema.org/WPHeader"

Для того, чтобы указать поисковикам какую именно информацию мы хотим им показать используют атрибут itemprop.

Чтобы указать описание сайта, используем следующий атрибут:

itemprop="headline"

Конкретно куда в файле header.php для вашего шаблона я сказать не могу. В некоторых случаях имеет смысл обратиться, опять же, к фрилансерам. Так, например, для своего шаблона блога, который был сделан на заказ, у меня так и не получается вставить этот атрибут.

В стандартных шаблонах, функция, которая отвечает за вывод заголовка сайта (<?php bloginfo (‘name’); ?>), находится в теге h1. Вот именно туда мы и добавляем наш атрибут (см. скрин ниже).

За описание сайта в стандартных шаблонах отвечает функция <?php bloginfo ( ‘description’ ); ?>, которая находится в теге h2. Опять же внутрь этого тега добавляем следующий атрибут:

itemprop="description"

А вот, что должно получиться:

Вот именно так должно получится, при условии, что у вас стандартный шаблон.

Для семантической разметки header.php мы использовали следующие атрибуты:

  • itemscope itemtype="http://schema.org/WPHeader"
  • itemprop="headline"
  • itemprop="description"

Микроразметка статьи

Итак, при микроразметке статьи нам нужно указать поисковому роботу, что вот это — начало статьи; это — контент поста; это — дата публикации статьи; это — автор поста. Для микроразметки статьи откройте файл single.php либо файл с подобным названием, может быть content-single.php.

Теперь нам нужно найти функцию (она заключена в контейнере div), отвечающую за вывод контента, это функция обычно имеет название content либо что-то похожее, у меня, например, вообще  <?php if (have_posts ()) : while (have_posts ()) : the_post (); ?>.

А добавить нужно следующий атрибут:

itemscope itemtype="http://schema.org/Article"

У меня получилось вот так:

</div>
<?php if (have_posts ()) : while (have_posts ()) : the_post (); ?>
<article itemscope itemtype="http://schema.org/Article">

Опять же, у меня шаблон индивидуальный, поэтому нестандартно. У вас же должно получиться примерно так:

<div id="content" itemscope itemtype="http://schema.org/Article">

Ок. Идём дальше.

Для того, чтобы вывести заголовок статьи, Вордпресс использует функцию <?php the_title (); ?>, ищем её и внутри её контейнера либо тега, в моём случае h1, вставляем следующий код:

itemprop="name"

Вот что получилось у меня:

<h1 class="title" itemprop="name"><?php the_title (); ?></h1>

Для того, чтобы разметить содержание статьи, нам необходимо для начала найти функцию, которая отвечает за её вывод. Это функция <?php the_content (); ?>, находим её и внутри неё добавляем следующий код:

itemprop="articleBody"

В итоге у меня получилось следующее:

<div class="post_content" itemprop="articleBody">
<?php the_content (); ?>
</div>

Далее нам нужно указать роботу на автора статьи, находим функцию <?php the_author () ?>, в некоторых случаях данная функция не имеет контейнера, а внутрь её нельзя вставить необходимый код, так как шаблон перестанет работать, тогда её нужно будет заключить в тег <span> </span>:

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

Код, который нужно вставить, как вы уже поняли — это itemprop="author".

В моём шаблоне я убрал надпись автора статьи, посчитал лишним, поэтому свой код я вам не покажу.

Дальше размечаем дату публикации поста. За вывод даты отвечает функция <?php the_time ('Y-m-d'); ?>, находим её, и в её контейнер (если его нет, заключаем <span> </span> ) вставляем следующий код:

itemprop="datePublished"

У меня получилось в итоге так:

<div class="info_date" itemprop="datePublished"><?php the_time ('Y-m-d'); ?></div>

Ну и последнее по микроразметке статьи: если вы хотите указать поисковому роботу на рубрику, в которой находится размечаемая статья, то нужно найти функцию <?php the_category (', '); ?>, и вставить в её контейнер или при отсутствии его между тегами <span> </span> следующий код:

itemprop="articleSection"

Итог проделанной работы:

<div class="info_cat" itemprop="articleSection"><?php the_category (', '); ?></div>

либо ( со span)

<span itemprop="articleSection"><?php the_category(', ') ?></span>

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

  • itemscope itemtype="http://schema.org/Article"
  • itemprop="articleBody"
  • itemprop="name"
  • itemprop="articleSection"
  • itemprop="datePublished"
  • itemprop="author"

Семантическая микроразметка изображений сайта

Раньше приходилось делать микроразметку картинок вручную! Т.е. внутри каждой картинки вставлять атрибут «itemprop=»image"

Представьте только: к каждой картинке! Это хоть и не долго (когда руку набьёшь), но нудно очень. Благо можно этот процесс автоматизировать. Для этого в файле functions.php нужно добавить следующий код:

/*** ДОБАВЛЯЕМ МИКРОРАЗМЕТКУ ИЗОБРАЖЕНИЙ ***/
function micro_image ($content) { global $post; $pattern = «<img»; $replacement = '<img itemprop="image"'; $content = str_replace ($pattern, $replacement, $content); return $content; } add_filter ('the_content', 'micro_image');

Вот и всё. Неважно где, главное, чтобы предыдущий код (функция) закрывалась. Обычно добавляют в конец, перед ?>.

Микроразметка комментариев

Честно говоря в Интернете сложно найти нормальное пояснение для разметки комментариев. Да и в каждом шаблоне может быть по-разному. Поэтому я предлагаю самое простое решение — внедрение микроразметки комментариев через функцию (код), который нужно будет вставить в файл functions.php ПОСЛЕ тега ?>, а не как мы привыкли до ?>, этот код вы можете скачать посмотреть здесь.

Отлично. Идём дальше. Теперь нам нужно найти в файле comments.php такой код:

<?php wp_list_comments (); ?>

После чего в его скобках вставить вот этот код:

'callback=mayak_comment'

Если в скобках есть какой-либо код, то 'callback=mayak_comment' добавляем через & в самый конец выражения, например вот так:

<?php wp_list_comments ('type="comment"&callback=mayak_comment'); ?>

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

<h3 id="comments">Комментариев к записи: <?php comments_number ('Нет', '1', '%' );?></h3> 

Это опять же у стандартных шаблонов, у вас может отличаться.

И в данный контейнер функции <?php comments_number ('Нет', '1', '%' );?> добавляем следующий атрибут:

itemprop="interactionCount"

В результате получаем следующее:

<h3 id="comments" itemprop="interactionCount">Комментариев к записи: <?php comments_number ('Нет', '1', '%' );?></h3>

Семантическая разметка контактных данных

Здесь всё просто, вставляете свои контактные данные в шаблон кода:

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

<span itemprop="name">Прописываем название блога</span>

<span itemprop="postalCode">Ваш индекс</span>

<span itemprop="addressLocality">Город, в котором Вы живете</span>

<span itemprop="streetAddress">Адрес</span>
<span itemprop="telephone">Телефон</span> <span itemprop="email">Электронная почта (желательно, чтобы в адресе фигурировал домен)</span>

Разметка контактных данных повышает уровень доверия поисковиков, так, что не пренебрегайте этим.
Вот и всё, что я хотел вам сказать в данной статье. Применяйте данные методы микроразметки и поисковики полюбят вас :) .
А вы уже оформили подписку на обновления блога? :)
Р/S 
Надо сказать, что фрилансеры берут за такую работу от 500р и то редко, в основном, от 1000р. Прочитав эту статью, Вы сами сможете сделать микроразметку и сэкономить деньги. По крайней мере, даже, если будите заказывать у фрилансеров, то сможете адекватно проверить заказ.
А вы применяете семантическую разметку у себе на сайте?
С уважением, Александр Сергиенко


Видеостудия своими руками

Как создать блог в интернете бесплатно?

Обработка голоса для инфобизнесмена
Читай этот блог и ты узнаешь много полезного! Читай и ты!
Поделитесь с друзьями:
Комментарии пользователей ( 37)
  1. Андрей Andrdov
    в 03:13

    Давно применил семантическую разметку на сайте. Правда делал только для статей.

    Ответить
  2. Николай
    в 06:44

    Предлагается продажа баннера, а статистика посещаемости блога скрыта... и доступна только по паролю?

    Ответить
    • Александр Сергиенко
      в 20:33

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

      Ответить
  3. Delphi
    в 19:23

    Пытался реализовать это все. Мешается плагин All in seo. Как решить?

    Кстати, в index.php у меня получалось 5 авторов подряд, потом 5 description тоже подряд.

    Как решить проблему с плагином All in seo ? Лишний itemscope в яндекс выдает.

    Ответить
    • Александр Сергиенко
      в 20:22

      Этот плагин не актуален сейчас, я пользуюсь Platinum SEO. Но я не думаю, что из-за него такое может быть.

      Ответить
      • Delphi
        в 21:17

        А чем этот плагин актуальнее чем All in seo?

        Ответить
        • Александр Сергиенко
          в 21:51

          Не делает дубли страниц.

          Ответить
    • Дмитрий Жилин
      в 22:41

      В all in one seo pack нужно отключить Schema.org — это чтобы микроразметка не конфликтовала.

      Чтобы дубли не делались — нужно отключить пагинацию для канонических URL. Это не плагин дубли делает, а вебмастера не умеют настраивать правильно.

      Ответить
      • Александр Сергиенко
        в 23:22

        Да, действительно, спасибо Дмитрий. Достаточно отключить пагинацию. Когда я устанавливал Аll in one seo pack такой функции не было, вот и перешел на Platinum SEO. Теперь разницы нет.

        Ответить
  4. Виталий Охрименко
    в 00:57

    После внедрения кодов появилась такая ошибка в яндексе:

    microdata

    ОШИБКА: невозможно определить принадлежность данных полей. Возможны две причины: эти поля некорректно размещены, либо указан лишний атрибут itemprop

    itemType =

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

    Ответить
    • Александр Сергиенко
      в 19:39

      Я сейчас не вижу у Вас ошибки. Она возникает после разметки изображений?

      Ответить
      • Виталий Охрименко
        в 05:34

        Нет, ошибка проявляется независимо от внедрения разметки изображений. И видна ошибка только в яндексе, в гугле все гуд!

        Ответить
  5. Виталий Охрименко
    в 04:36

    Александр, а будьте добры, подскажите — куда прописывать разметку контактных данных (в какой файл вообще вносить эти данные?)?

    Ответить
    • Александр Сергиенко
      в 20:22

      На странице, в которой будут размещены данные, в самом её коде, и прописывайте.

      Ответить
      • Виталий Охрименко
        в 05:35

        Туплю, спасибо! Когда добавлю эти данные обязательно размечу

        Ответить
  6. Сергей
    в 16:38

    Отличная статья, все очень понятно и подробно расписано. Спасибо!

    Ответить
  7. Дмитрий Жилин
    в 22:52

    Спасибо за инструкцию. За пол часа сделал себе разметку.

    Только с картинками заминка — они не разметились почему-то. У меня у одного так? Или может быть в коде есть какие-то ошибки (может пробелы лишние)

    Ответить
    • Александр Сергиенко
      в 23:22

      Нет, здесь не в пробелах дело.

      Ответить
  8. Андрей
    в 19:35

    Как удалить старую микроразметку?

    Ответить
    • Александр Сергиенко
      в 20:12

      Ищите в файлах сайта и удаляете вручную её код.

      Ответить
  9. Алексей
    в 18:27

    Не получается разметку сделать для меню На странице меню выводится так

    'Навигация по сайту','container' => 'nav','container_class' => 'menu','items_wrap' => 'меню%3$s','walker' => $walker ) ); ?>

    подскажите куда вставить itemscope itemprop="http://schema.org/SiteNavigationElement"

    Ответить
    • Александр Сергиенко
      в 19:12

      Тут нужно код смотреть, так не скажешь. К общему контейнеру, в котором находится ваше меню нужно добавить атрибут itemscope itemtype="http://schema.org/SiteNavigationElement" у меня на одном из сайтов это тег <nav> который находится сразу под шапкой сайта после добавления атрибута имеет такой вид : <nav itemscope itemtype="http://schema.org/SiteNavigationElement">

      Ответить
      • Алексей
        в 19:16

        'container' => 'nav' строка в коде как раз и оборачивает меню тегом но вот как туда засунуть микроразметку не знаю!

        Ответить
        • Александр Сергиенко
          в 19:23

          Поэтому я и говорю, что код нужно смотреть.

          Ответить
  10. Алексей
    в 22:16

    А не подскажите где применяется itemtype="http://schema.org/Blog"

    Ответить
    • Александр Сергиенко
      в 22:57

      Для разметки статей сайта, обычно в index.php.

      Ответить
      • Алексей
        в 00:05

        Для разметки статей используют itemtype="http://schema.org/BlogPosting"

        а itemtype="http://schema.org/Blog" для чего?

        Ответить
        • Александр Сергиенко
          в 00:23

          Указывает, что контент имеет сущность Blog, после него идёт разметка статей.

          Вот, посмотрите: http://prntscr.com/9bejjh

          Ответить
  11. Алексей
    в 12:43

    с недавним обновлением микроразметки от 9 декабря у всех на блогах появились новые ошибки Подскажите как можно все поправить?

    image [ImageObject]:

    height: отсутствует (обязательное)

    url: отсутствует (обязательное)

    width: отсутствует (обязательное)

    Для image указан недопустимый URL.

    publisher: отсутствует (обязательное)

    dateModified: отсутствует (рекомендуется)

    mainEntityOfPage: отсутствует (рекомендуется)

    Ответить
    • Александр Сергиенко
      в 16:51

      Да, на днях обновились требования к микроразметке в Google, появились новые поля, которые не совместимы с Яндексом prntscr.com/9dxkrh это нормально, оставляйте пока их так.

      Ответить
  12. Сергей Иванисов
    в 15:02

    Будем ждать новостей) вопрос интересует многих) 8-)

    Ответить
    • Алексей
      в 18:55

      уже давно нашли решение и под гугл и под яндекс

      Ответить
  13. Сергей Иванисов
    в 18:52

    Хотел ещё спросить, а что с картинками стало? Теперь их тоже не распознаёт(((

    Ответить
    • Александр Сергиенко
      в 21:10

      На данный момент решение есть. Я по-возможности обновлю статью.

      Ответить
  14. witos1
    в 14:30

    У самого то не сделана!? :-)

    Ответить
    • Александр Сергиенко
      в 19:10

      witos1, в декабре 2015г микроразметка обновилась, я про нее ещё не писал, так как у себя не делал.

      Ответить
  15. Сергей
    в 23:09

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

    Ответить
Ваше Имя
E-mail (не публикуется на сайте)     Поле обязательно для заполнения
Адрес вашего сайта (если есть)
Текст комментария
Статистика сайта блога Александра Сергиенко