Google can't recognize Schema.org image property from Product

Question

How can I use itemprop="image" from http://schema.org/Product so Google can recognize it in this case?

<a href="#" itemprop="image" data-remote="images/portfolio/image.jpg" class="portfolio-box" data-toggle="lightbox" data-gallery="multiimages" data-title="image"></a>

Answer 1

According to Schema.org:

1. The image property expects a URL or an ImageObject item.

2. In Microdata, URLs must be specified with one of the HTML elements that take a URL as value. Among them is a (with its href attribute).

3. So it should be possible to use:

   <a itemprop="image" href="http://example.com/my-product-image.png">…</a>
   

Using custom data-* will most likely not work. Per HTML5 definition they should only be used for custom data private to the site (and not as some kind of shared vocabulary); and anway, how should consumers like Google now what your custom attributes mean/contain?

Also, it’s clearly defined to which content an itemprop applies. In case of a it’s the href attribute content, not the element content, not some other attribute content.

According to Google:

Google doesn’t indicate how exactly their Products Rich Snippet works. Of course do they show in their examples the element that is typically used for images (<img itemprop="image" src="anvil_executive.jpg" />), but their examples don’t mean that it’s the only supported way to specify an image.