How do I get Facebook and Pinterest to recognize specific images on a page

Question

I am working on a client site that contains hundreds of pictures. The would like to show these pictures on Facebook and Pinterest. My problem is: when they try to put a post on Facebook or Pinterest, these sites only allow them to select the site logo (or another irrelevant image) for the post. How do I get these sites to recognize meaningful images on a page? Do I need to use a special class or meta tag?

Answer 1

Facebook and Pinterest.com both use The Open Graph protocol which will look something like:

<meta property="og:type" content="article" />
<meta property="og:url" content="http://www.example.com/" />
<meta property="og:site_name" content="Example" />
<meta property="og:image" content="http://www.example.com/images/001.jpg" />
<meta property="og:image" content="http://www.example.com/images/002.jpg" />

You can also find a lot of information on Facebook Developers, Pinterest Developers, Linkedin Developers, Twitter Developers and Google Plus Developers.