I am trying to enhance our old html site (webstore) with schema and am having some difficulties getting started. We have over 1,500 individual html product pages that I would like to start adding Schema to, so getting this correct to begin with is a must.
The biggest issue thus far is how to add the product image code as our site layout is table based with the main product image inserted as a background element. Most of the research examples I have found so far show different implementations, is this possible?
Here is a code example:
<TR>
<TD COLSPAN=2><IMG SRC="images/spacer.gif" WIDTH=122 HEIGHT=10 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=2><IMG SRC="images/spacer.gif" WIDTH=122 HEIGHT=18 ALT=""></TD>
</TR>
</TABLE>
</td>
<td valign="top">
<table width="599" border="0" cellpadding="0" cellspacing="0" background="images/LOTR/BKG_Hobbit-Sting-UC2892.jpg" style="background-repeat: no-repeat;">
<tr>
<td width="259" valign="top"><span class="style2 "><IMG SRC="images/spacer.gif" alt="" WIDTH=259 HEIGHT=150 border="0"><br></span>
<table width="238" border="0" align="right" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2"><span class="style109 style31">The HOBBIT<br> BILBO'S STING SWORD</span><span class="style117"><br> <span class="style33">UC2892 United Cutlery</span></span></td>
</tr>
From this code, I would like to highlight images/LOTR/BKG_Hobbit-Sting-UC2892.jpg as the product image via Schema.org.
I first tried adding the info to the <HEAD> section, but it does not check out correctly on Google's structured data testing tool:
<div itemscope itemtype="schema.org/Product">; <meta itemprop="image" content="images/LOTR/BKG_Hobbit-Sting-UC2892.jpg"></meta>
Also, testing in Bing Markup tester gives me the result:
We are not seeing any markup on this page. Please ensure the markup has been implemented correctly.
Is it not okay to add the Schema data via <div> to the head area?
Also, should the image link be a complete URL www.example.com/images/LOTR/BKG_Hobbit-Sting-UC2892.jpg?