Question

I’ve tied in the code for the facebook like button from the facebook dev site (I currently use the iframe version) directly into the html of a node (or content post). I want to be able to manipulate what text is sent when someone hits the like button.

you can see the site and buttons here http://www.masteringmoneybasics.org

I’ve tried both the iframe and html5 versions of the button and can’t see where to alter what is sent.

If there is no way to directly alter what is sent, does anyone know what it looks for in content to be sent so I can structure the node correctly? If you notice, when you like the page, it doesn’t get the first sentence of the content, but all content after it, and I’ve tried putting different content in between the two lines (in its own <p>) and it still grabs the latter. Also how it figures out which image to grab from the page? Most times it doesn’t take any image, however twice it’s grabbed the middle school image.

Answer 1

You need to add facebook open graph meta tags to the html head of the page being liked e.g.

<meta property="og:title" content=""/>
<meta property="og:image" content="http://davidwalsh.name/wp-content/themes/klass/img/facebooklogo.png"/>
<meta property="og:site_name" content="David Walsh Blog"/>
<meta property="og:description" content="Facebook's Open Graph protocol allows for web developers to turn their websites into Facebook "graph" objects, allowing a certain level of customization over how information is carried over from a non-Facebook website to Facebook when a page is 'recommended', 'liked', or just generally shared."/>

You don’t have to ‘send’ the code with the like, just add this information into your html pages – this gives you control of the image and text posted.

FYI you should decide if the user is liking an article or the site and change the information on each page accordingly, just as you would with standard meta tags for search engines.