Ошибка инструмента тестирования богатых фрагментов Google в рецепте
Я пометил страницу для богатых фрагментов рецептов микроданными, однако я получаю ошибку в инструменте тестирования Google:
Ошибка: Для создания предварительного просмотра с расширенными фрагментами необходимы по крайней мере 2 из следующих полей: время подготовки, время приготовления, общее время, калории, рейтинг, количество просмотров, ингредиенты или изображение
Дело в том, что у меня уже есть 4 из вышеперечисленных значений, которые сигнализируются в сообщении об ошибке, и они также признанный Средством тестирования действительным.
Вот вывод инструмента тестирования расширенных фрагментов для моего кода.
И вот пример кода, который я использовал:
<div class="pd_main_wrapper" itemscope="" itemtype="http://data-vocabulary.org/Recipe">
<div class="pd_main_image">
<div id="main_image_container">
<div id="divProductPic3422">
<img id="ProductPic3422" style="cursor:hand;cursor:pointer;" onClick="picShowOverlayBox(imgPathLarge_3422())" title="Seafood Paella Recipe - Click to enlarge" src="https://www.example.com/images/Product/medium/xspanish-seafood-paella-recipe-1S-3422.jpg.pagespeed.ic.GtxjaJwlho.jpg" itemprop="image" alt="Seafood Paella Recipe"/>
</div>
</div>
</div>
<div class="pd_cart_details">
<h1>
<span itemprop="name">Spanish Seafood Paella Recipe
</h1>
<span class="pd_subtitle">by
<span itemprop="author">GourmetFood
<time itemprop="published" datetime="11/3/2014 11:13:10 AM"></time>
<div class="recipe_intro" itemprop="summary">This classic Spanish seafood paella is prepared in two stages: the seafood cooked first to preserve the texture and reserved, then the rice is cooked al dente and all the ingredients mixed.<br><br>
<strong>Prep Time: </strong>
<time datetime="PT30M" itemprop="prepTime">30 minutes</time><br><strong>Cook Time: </strong>
<time datetime="PT25M" itemprop="cookTime">25 minutes</time><br><strong>Total Time: </strong>
<time datetime="PT55M" itemprop="totalTime">55 minutes</time><br><strong>Yield: </strong>
<span itemprop="yield">6 servings
</div>
<div class="pd_add_cart_container">
<span class="pd_print_recipe_button">
<input type="button" name="btnBuy" id="btnBuy" value="PRINT RECIPE" class="btn btn-prntrecipe btn-prntrecipec" onClick="return printManager.printRecipe();">
</div>
</div>
<div id="tabs_container">
<h2>Spanish Seafood Paella Recipe Instructions</h2>
<span itemprop="instructions"><strong>Ingredients</strong><br/>
<ul>
<li>18 mussels (cleaned and scrubbed)</li>
<li>12 clams (cleaned and scrubbed)</li>
</ul>
</div>
</div>
Может ли кто-нибудь дать мне некоторое представление о том, что здесь может быть не так?
4 answers
Пожалуйста, измените itemprop="изображение" на itemprop="фото", и инструмент Google Rich Snippet будет удовлетворен вашим (минимально очищенным) кодом. элемент "изображение" не является допустимой разметкой расширенного фрагмента, так как "фотография" - это имя свойства, которое он ищет.
Пожалуйста, обратите внимание: Поскольку ваш код был очищен и свернут, я не уверен, что добавление полного кода не создаст ту же или новую проблему, но ваш код в том виде, в каком он представлен, будет в порядке, как только вы внесете это изменение.
1.) Я исправляю конкретную проблему, о которой я говорил до того, как стал проблемой времени/формата ISO. Я думаю, это потому, что Схемы смешиваются вместе.
После некоторого удаления разного материала из исходного кода, чтобы сделать этот исходный код меньшим по размеру, выглядит следующим образом:
<div itemtype="http://data-vocabulary.org/Recipe" itemscope="" class="pd_main_wrapper">
<img alt="Seafood Paella Recipe" itemprop="image" src="/images/Product/medium/spanish-seafood-paella-recipe-1S-3422.jpg" title="Seafood Paella Recipe - Click to enlarge" id="ProductPic3422"><div class="pic_thumbnails">
<span itemprop="name">Spanish Seafood Paella Recipe</span>
<span itemprop="author">GourmetFoodStore.com</span>
<time datetime="11/3/2014 11:13:10 AM" itemprop="published"></time>
<div itemtype="http://schema.org/AggregateRating" itemscope="" itemprop="aggregateRating" class="ratings_line">
<span itemprop="ratingValue">5.00</span>) # of Ratings:
<span itemprop="reviewCount">1</span> <b>Log in to rate this item.</b></div>
<div itemprop="summary" class="recipe_intro">This classic Spanish seafood paella is prepared in two stages: the seafood cooked first to preserve the texture and reserved, then the rice is cooked al dente and all the ingredients mixed.<br><br><strong>Prep Time: </strong>
<time itemprop="prepTime" datetime="PT30M">30 minutes</time><br><strong>Cook Time: </strong><time itemprop="cookTime" datetime="PT25M">25 minutes</time><br><strong>Total Time: </strong><time itemprop="totalTime" datetime="PT55M">55 minutes</time><br><strong>Yield: </strong><span itemprop="yield">6 servings</span></div>
1.) Мне кажется, что это смешение схем - оно начинается с объявления data-vocabular.org Схема, но в середине расширенного формата она переключается на Schema.org, При кодировании в богатых данных есть является определенным форматом относительно того, что ВЛОЖЕНО в какое-либо данное свойство, например, формат МИКРОДАННЫХ указывает, что (приготовление, подготовка, общее время) должно быть вложено в свойство "<span itemprop="review" itemscope itemtype="http://data-vocabulary.org/Review-aggregate">", но в этом случае - было объявлено об изменении схемы, и поэтому то, что ожидалось, не было замечено.
Я не думаю, что вы можете смешивать схемы подобным образом, по крайней мере, вы не можете находиться внутри свойств одной схемы и объявлять в ней другую схему. Пожалуйста, поправьте меня, если я ошибаюсь.
Если у вас есть домен в src изображения, который недоступен для общественности, Google выдаст ошибку. Пример: локальный хост (.test)
Вот подробности:
В моем случае я использовал itemprop="image", но инструмент тестирования Google выдавал ошибки.
Код изображения был:
<img itemprop="image" src="http://boilerplate.test/wp-content/uploads/2018/04/test.jpg" alt="test recipe" class="recipe-img" />
Обратите внимание на boilerplate.test в src.
Когда я удалил boilerplate.test из src, ошибки не было.
И, наконец, следующий код не дал ошибки:
<img itemprop="image" src="/wp-content/uploads/2018/04/test.jpg" alt="test recipe" class="recipe-img" />
Здесь вы идете с правильным кодом схемы:
<div itemscope itemtype="http://schema.org/Recipe">
<span itemprop="name">Spanish Seafood Paella Recipe
By <span itemprop="author">GourmetFood,
<meta itemprop="datePublished" content="2014-03-11">March 11, 2014
<img itemprop="image" src="https://www.example.com/images/Product/medium/xspanish-seafood-paella-recipe-1S-3422.jpg.pagespeed.ic.GtxjaJwlho.jpg"
alt="Seafood Paella Recipe" />
<span itemprop="description">This classic Spanish seafood paella is prepared in two stages: the seafood cooked first to preserve the texture and reserved, then the rice is cooked al dente and all the ingredients mixed.
Prep Time: <meta itemprop="prepTime" content="PT15M">PT30M
Cook time: <meta itemprop="cookTime" content="PT1H">PT25M
Total time: <time datetime="PT1H30M" itemprop="totalTime">PT55M</time>
Yield: <span itemprop="recipeYield">6 servings
Ingredients:
- <span itemprop="ingredients">18 mussels (cleaned and scrubbed)
- <span itemprop="ingredients">12 clams (cleaned and scrubbed)
- <span itemprop="ingredients">3/4 cup of sugar
...
Spanish Seafood Paella Recipe Instructions
<span itemprop="recipeInstructions">
Please add instructions here!
</div>
Дайте нам знать, если это сработает.
Примечание: Пожалуйста, добавьте инструкции в раздел itemprop="Инструкции по рецепту