8. Микроразметка карточки товара: цена, отзывы, рейтинг

Опубликовано в Статьи
/
2 Авг 2018

От слов к делу, без воды и соплей! Размечать будем следующие элементы:

  • информацию о товаре (название товара, цену, наличие, бренд, картинку товара, описание товара);
  • суммарный рейтинг товара (делаем звездочки для сниппета в Google);
  • отзывы (имя автора отзыва, тело отзыва, выставленная оценка).

 

Микроразметка карточки товаров (schema.org)

 

1. Готовый шаблон микроразметки карточки товара

[!] Все три блока микроразметки выполняются в элементе <div itemscope itemtype="http://schema.org/Product">.

 

1.1. Пример микроразметки Product, отвечающий за разметку карточки товара (цены с валютой, названия и описание товара, бренд, наличие, изображение товара):

 

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

 

 <span itemprop="brand">[brand]</span>

 <span itemprop="name">[name]</span>

 <img itemprop="image" src="[img_url]" />

 <span itemprop="description">[description]</span>

 <span itemprop="offers" itemscope itemtype="http://schema.org/Offer">

       <meta itemprop="priceCurrency" content="[currency]" />

       <span itemprop="price">[price]</span>

       <link itemprop="availability" href="http://schema.org/InStock"/>

 </span>

 

1.2. Продолжение шаблона микроразметки товара - блок разметки отзывов (пример микроразметки itemreviewed).

 

<div itemprop="review" itemscope itemtype="http://schema.org/Review">

   <span itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating">

       <meta itemprop="worstRating" content = "[min_rating]">

       <meta itemprop="bestRating"  content = "[max_rating]">

       <span itemprop="ratingValue">[rating]</span>

   </span>

   <span itemprop="itemreviewed">[item_name]</span>

   <span itemprop="author" itemscope itemtype="http://schema.org/Person">

       <span itemprop="name">[author_name]</span>

   </span>

   <meta itemprop="datePublished" content="[date]">

   <div itemprop="reviewBody">[review]</div>

</div>

 

1.3. Продолжение шаблона разметки - суммарный рейтинга товара (пример разметки aggregateRating - звезды):

 

<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">

     <span itemprop="ratingValue">[value]</span>

     <meta itemprop="bestRating" content="[max_rating]"/>

     <meta itemprop="worstRating" content="[min_rating]"/>

     <span itemprop="ratingCount">[num_votes]</span>

     <span itemprop="reviewCount">[num_rewiev_count]</span>

</div>

 

</div>

 

[!] На живом сайте данные куски разметки могут быть разбросаны по всему коду. Главное, чтобы верхним “дивом” был этот: <div itemscope itemtype="http://schema.org/Product"> </div>.

 

2. Переменные, используемые в микроразметке карточки товара.

[brand] – название производителя товара;

[name] – наименование товара;

[img_url] – URL изображения товара;

[description] – блок описание товара;

[currency] – валюта в формате ISO-4217;

[price] – цена, без пробелов, должна быть слитной: 16000, а не 16 000;

<link itemprop="availability" href="http://schema.org/InStock"/> – наличие товара. Если товара нет в наличии - заменить inStock на OutOfStock.

 

[rating] – рейтинговая числовая оценка, выставленная в отзыве;

[author_name] – имя автора отзыва;

[date] – дата публикации отзыва;

[review] – текст отзыва.

 

[value] – текущая средняя оценка товара/услуги/страницы;

[max_rating] – максимально возможная оценка (чаще всего по-умолчанию 5);

[min_rating] – минимально возможная оценка (чаще всего по-умолчанию 1);

[num_votes] – кол-во оценок;

[num_votes_review] – кол-во написанных отзывов;

 

3. Дополнительные доработки при реализации блока отзывов.

В функционал отзыва необходимо добавить:

  1. Возможность поставить рейтинг при написании отзыва (внедрить рейтинг в форму написания отзыва).
  2. Суммарная числовая рейтинга должна считаться на основании среднего от всех оставленных отзывов с выставленным рейтингом. Если отзыв написали без рейтинга - такую оценку в суммарном подсчете рейтинга не учитывать (такой принцип использует украинский интернет-магазин Rozetka).
  3. Реализовать возможность простановки рейтинга как при написании отзыва, так и просто оставить возможность выставить рейтинг товару без написания отзыва (путем наведения курсора на “звездочки” и простановки соответствующего числового рейтинга).

 

4. Проверка корректности реализации разметки в инструменте проверки структурированных данных.

Инструмент доступен по ссылке “Инструмент проверки структурированных данных Google”. Ниже - примеры реализации разметки товара:

 

  1. Пример микроразметки карточки товаров проекта Rozetka (тексты отзывов - не размечены, т.к. они реализованы на отдельной вкладке, но размечен автор и числовая оценка) - ПРИМЕР.
  2. Отличный пример реализации микроразметки карточки товара и отзывов (отзывы не вынесены на отдельную страницу, а выводятся на странице карточки) - ПРИМЕР.
Поделись в соц.сетях:
  •  
  •  
  •  
  •  


1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (18 оценок, среднее: 4,67 из 5)
Загрузка...