10

I've been experimenting with Microdata and thought I would try it on my blog. It turns out the template I was using already added some markup. It wasn't great and so I fixed up what I could.

To try and push my luck I have added more markup to my latest post but Google's Structured Data Testing Tool (SDTT) is unhappy about the itemprop='image' attributes and I'm not sure why.

Structured Testing Tool errors

Results page.

It is my understanding, ignoring all the code in between, that I have structured the data thus:

<div itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
  <div itemprop='articleBody'>
    <a href="1.png" itemprop="url"><img itemprop="image sharedContent" src="1.png" /></a>
    <a href="2.png" itemprop="url"><img itemprop="image sharedContent" src="2.png" /></a>
    <a href="3.png" itemprop="url"><img itemprop="image sharedContent" src="3.png" /></a>
  </div>
</div>

And this looks correct to me. BlogPosting can have the properties articleBody and image according to https://schema.org/BlogPosting, but according to the SDTT:

The attribute itemtype has an invalid value.

Indeed, I have just tried the SDTT with the above example code and it is failing to validate.

Example code in the SDTT

So I'm obviously missing something. What am I doing wrong?

2
  • Some of the links in this questions were removed as they are not necessary for the question to be answered.
    – John Conde
    Commented Feb 20, 2016 at 23:01
  • Why were the widely-used tags removed then?
    – Ken Sharp
    Commented Feb 20, 2016 at 23:05

2 Answers 2

16

schema.org/BlogPosting image permits ImageObject and URL, however Google only permits ImageObject, hence the error. The intended markup is:

<!-- my code -->
<div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
  <img src="image.jpg" itemprop="url">
</div>

               

Another discrepancy is schema.org/ImageObject recommends contentUrl, but Google recommends url, hence my usage above.


In response to your comment's code, your structure is still incorrect. I'll take it line by line:

<!-- your code -->
<div itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

Minor point, but unless you're going for XHTML, itemscope='itemscope' is wrong. Use itemscope (as you did later on).

<!-- your code -->
  <div itemprop='articleBody'>
    <div itemscope itemtype="http://schema.org/ImageObject"/>

Your ImageObject is a child of the articleBody property, but you haven't associated it in this way. Like this, you have an articleBody with no associated properties and an unassociated ImageObject. You should use

<!-- my code -->
    <div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">

Also, /> is incorrect, even if you are trying for XHTML as this element does have children and a closing </div>. Just use > as I included in the above snippet.

<!-- your code -->
      <a href="1.png" itemprop="url"><img itemprop="image sharedContent" src="1.png" /></a>

What is sharedContent doing here? sharedContent expects a CreativeWork when used as a property of SocialMediaPosting — never as a property of ImageObject and never on an img.

Your other code snippet which places the sharedContent property as below is also wrong.

<!-- your code -->
<div itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
  <div itemprop='articleBody'>
    <div itemprop='sharedContent'>
      <div itemscope itemtype="http://schema.org/ImageObject"/>
        …

Whilst sharedContent is now in the right place, it still needs to be a CreativeWork. Your ImageObjects are still not associated with the BlogPosting, as shown by the Structured Data Testing Tool.

                                          

The following is the correct code.

<!-- my code -->
<div itemscope itemtype="http://schema.org/BlogPosting">
  <div itemprop="articleBody">
    <div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
      <a href="1.png" itemprop="url"><img itemprop="image" src="1.png"></a>
    </div>
    <div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
      <a href="2.png" itemprop="url"><img itemprop="image" src="2.png"></a>
    </div>
    <div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
      <a href="3.png" itemprop="url"><img itemprop="image" src="3.png"></a>
    </div>
  </div>
</div>
9
  • I see. Adding ImageObject fails with sharedContent as a child of it: pastebin.com/cSgVZNyE . Removing sharedContent makes it happy: pastebin.com/rieWwSM6 . Wrapping each image in a parent sharedContent (pastebin.com/AmpBDqJs) validates happily, but is this because Google's STDD just ignores it? The STDD is quite happy if contentURL is used as well: pastebin.com/23wBvx8F . So it looks like I did it correct and Google did it incorrect? That's got to be a first. 😉 I guess I can appease them all by adding all the relevant tags. Thanks! 😀
    – Ken Sharp
    Commented Feb 20, 2016 at 22:44
  • 1
    @Ken See my edit for my feedback on your code.
    – grg
    Commented Feb 21, 2016 at 14:12
  • TS uses a type of basic Blogger template, so he will be not able to use your code without to revamp the whole template. The changes must be done on the template level, not on the level of structured data.
    – Evgeniy
    Commented Feb 21, 2016 at 14:26
  • Thanks again @grgarside. You're certainly correct about sharedContent - I've used that all wrong. I've removed it for now. Having another looking at the schema I see I don't think I need to use it in a CreativeWork. Just ignore the />, it was typed in a hurry 😉, and the original code is XHTML. I just mixed the two in my example (hence the two versions of itemscope). The final code is correct, honest! 😁
    – Ken Sharp
    Commented Feb 21, 2016 at 18:00
  • @Evgeniy The template is being edited or it wouldn't work at all. My original question contained links that anyone could have easily checked on, but two wallies now have edited away the links and I'm sick of editing it. So here I am explaining myself yet again, as I predicted I would have to.
    – Ken Sharp
    Commented Feb 21, 2016 at 18:02
2

I had a similar problem with Google Structured Data Tester marking my images as invalid. Apparently it doesn't accept images where the source is a localhost domain. As soon as I deployed to the staging server the structured markup passed validation.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.