I’m trying to figure out how to add a Facebook “like” button on a product page that when clicked displays a post on the user’s Wall saying something like “John Smith liked a product” instead of “John Smith liked a link”?
I thought this would be a feature of the Facebook og:type tag. For a product page on my website http://www.luhsetea.com, I have the following tags:
<html lang="en" class="no-js" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#">
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# luhsetea: http://ogp.me/ns/fb/luhsetea#">
<meta property="og:title" content="Spice of Your Life" />
<meta property="og:type" content="luhsetea:product" />
<meta property="og:url" content="http://www.luhsetea.com/products/spice-of-your-life" />
<meta property="og:site_name" content="Luhse Tea" />
<meta property="fb:app_id" content=" APP_ID " />
<meta property="og:description" content="Honey, milk, and tea blend with our spices perfectly! See what you can make, with these spi..." />
<meta property="og:image" content="http://cdn.shopify.com/s/files/1/0077/8972/products/spice-of-your-life_medium.jpg?101788" />
I’ve included the JS SDK and code required for the like button:
<fb:like href="http://www.luhsetea.com/products/spice-of-your-life" send="false" layout="button_count" width="180" show_faces="false"></fb:like>
I’ve added an App in my Facebook Developer account, plus an Action called “Like” to an Object called “Product” in the Open Graph settings on the App configuration page. After doing this facebook gave me the code for the <meta property="og:type" content="luhsetea:product" /> tag.
Am I doing something wrong?
Thanks for your help.
You’re getting confused about the difference between the Like button and Open Graph verbs and actions – they’re two separate things, and any verbs you add to your applications Open Graph settings won’t affect a Like button.
If you really want to use an Open Graph ‘like’ verb (and I’d recommend against it as it’s confusing with a normal FB ‘like’, and probably won’t be approved by FB) then you’ll have to integrate with the Open Graph directly, as per https://developers.facebook.com/docs/beta/opengraph/tutorial/#publish
Note: If you do use an Open Graph ‘like’ verb, you wont get the benefit of a user liking your product with a Like button – that is, the ability to connect with those users when you publish content to your products Page.
If you just want a Like button and to remove the ‘a link’ part from the News Feed, set your
og:typeto simplyproduct