Facebook like button using XFBML in Blogger - cannot make individual like buttons for each post
I'm trying to put the Facebook Like button using XFBML in my Blogger blog. I want it to display a different button for each post, not the same for all the blog.
I've followed the guidelines in this link, among others: http://hitech-tips.blogspot.com/2010/05/facebook-like-button-xfbml-tutorial.html
What's happening is that the like button is displayed, but it's exactly the same one for all the posts. I've read that using expr:href='data:post.url' should fix this particular problem, but for some reason this is not working. This is all the relevant code, I hope you guys can tell me what I'm doing wrong.
<code>
// XFBML declaration
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml' xmlns:og='http://opengraphprotocol.org/schema/'>
// Opengraph tags (in head)
< b:if cond='data:blog.pageType == "item"'>
< meta expr:content='data:blog.pageTitle' property='og:title'/>
< meta expr:content='data:blog.url' property='og:url'/>
< b:else/>
< meta expr:content='data:blog.title' property='og:title'开发者_高级运维/>
< meta expr:content='data:blog.homepageUrl' property='og:url'/>
< /b:if>
< meta content='blog' property='og:type'/>
< meta content='http://lh5.ggpht.com/_4b9fZK142hk/TFHpg-2YeBI/AAAAAAAAEVM/MXLyeL6dvmk/TV%20512x512.jpg' property='og:image'/>
< meta content='La guía de cine y series' property='og:site_name'/>
< meta content='MY PROFILE ID IS HERE' property='fb:admins'/>
< meta content='MY APP ID IS HERE' property='fb:app_id'/>
< meta content='La guía de cine y series es un blog en español sobre series de TV y películas. Podés encontrar todo tipo de información sobre series de TV y películas: noticias, reviews, previews, trailers, posters y etc.' property='og:description'/>
< meta content='Ciudad Autónoma de Buenos Aires' property='og:locality'/>
< meta content='Ciudad Autónoma de Buenos Aires' property='og:region'/>
< meta content='Argentina' property='og:country-name'/>
< meta content='MY EMAIL' property='og:email'/>
// FB Init (in body)
< div id='fb-root'/>
< script>
window.fbAsyncInit = function() {
FB.init({appId: 'MY_APP_ID', status: true, cookie: true, xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
< /script>
// And finally the like button, in the post footer.
< div class='post-footer-line post-footer-line-3'>
< div style="margin-top:10px; margin-left:5px;">
< fb:like action='like' colorscheme='light' expr:href='data:post.url' layout='standard' show_faces='true'/>
< /div>
< /div>
</code>
I've also set the base domain as blogspot.com
in the Facebook Application Settings, and the Connect URL is the blog URL ending with a slash.
Ok, now it's working, I'm not sure exactly what fixed it, but it must be one of these options or all of them together:
I've changed the OpenGraph type from url to article.
I've set the base domain in the Applications Settings page in Facebook to blogspot.com
The other posibility is that it was working all along, but it didn't refreshed the buttons that I've already clicked, of the ones that were already there after the change that actually worked, because when I posted a new post I've realized that for the new one it was working.
Anyway, following this tutorial should help:
http://forum.developers.facebook.com/viewtopic.php?id=58903
精彩评论