Facebook "Like" Button Next to Blogger Post Titles

Just a few days ago Facebook released the "Like" button onto the rest of the web. Since I enjoy the idea of disseminating my content on Facebook, I wanted to add this button to my posts.

This proved a bit challenging for two reasons. First, the placement of the code proved tricky because I wanted it to be on the same line as my post's title. Second, the vanilla code from Facebook's generator only applies to the URL you input, and if you're like me will assume that this needs to be your blog's address.

Because a global "Like" button for your blog is a bit useless, it needs to apply to each individual post. A search for further instructions turned up nothing on account of this feature being so new.  Fortunately, I was able to get this question answered after posting it on LinkedIn's Q&A, and was directed to a great post on how to accomplish this over at Devfuel.

If you would also like to add this new feature to your Blogger site or blog, head on over to the post and grab the modified code. It manages to properly incorporate the "data:post.url" variable instead of what is provided by the generator. If you are also wondering how to place it right after your post's title such as you can see above, then simply look for the "b:includable id='post' var='post'" section and place the code immediately before "/a" closing tag.

*Would have posted the full code to look for and insert, but can't seem to change Blogger's behavior of interpreting the code (even with /code tags).

blog comments powered by Disqus