title: Image to show when users Like a product on my site - NOT og: tag
body: <p>From what I understand, the <code>og:image</code> is part of meta tags that appear in the <code>&lt;head&gt;</code> section of the page.</p>
  
  <p>Our ecommerce package can show multiple products on one page. I want the Like button on EACH product, so when a user clicks the Like button, it will post that PRODUCT on their wall, along with that individual product image. Since the meta tags are generated at the top in the <code>&lt;head&gt;</code>, before the products are pulled and displayed on the page, I have no way to set up my <code>og:image</code> meta tag to be appropriate for that product. </p>
  
  <p>I have tried using the Like button code like this:<br> </p>
  
  <pre><code>&lt;div class="fb-like"
       data-href="http://kaysbeadedjewelry.com/asccustompages/products.asp?productID=29"
       data-send="false"
       data-width="30"
       data-show-faces="false"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>but it displays the wrong image on the page. I have tried this on different sites and cannot figure out how it decides which image to grab and display. It seems to grab a random image from the page. Each client's site I've tried this on grabs different images from different locations on the page.</p>
  
  <p>I have also tried using the iframe code:<br></p>
  
  <pre><code>&lt;iframe src="http://www.facebook.com/widgets/like.php?href=http://kaysbeadedjewelry.com/asccustompages/products.asp?productID=29"
          scrolling="no"
          frameborder="0"
          style="border:none; width:450px; height:80px"&gt;&lt;/iframe&gt;
  </code></pre>
  
  <p>and it also gives me the same issue.</p>
  
  <p>How do I get Facebook to show the actual product image and not some random one?</p>