It was just yesterday when Facebook announced their new plan of personalizing and controlling the entire Internet, by rolling out several new key-features and additions in the Facebook ecosystem. One of them, is the Like social plugin. It enables users to make connections to your pages and share content back to their friends on Facebook with one click. But, out-of-the-box it’s not the way it’s described.

I came with the idea of using the Like button as a post-to-Facebook button, something like share but renewed and with the “like” keyword in it’s description. It serves two aspects: the act of liking the post and the act of sharing the post.

In the short, I wanted to embed the Like code in my single.php file in order to appear below each post the same way Sociable plugin works and when someone clicks on it to like, share+post the specific post into Facebook.

Unfortunately, it didn’t work out of the box.

The thing is that when you try to create the Like button via iFrame or the Javascript SDK you are prompted to enter a URL that Like will prompt users to “like” and post to their Facebook’s profile. The URL itself is dummy. That means it’s not dynamical. Wherever you will put the Like button it just will like+share+post the URL you typed before (in my case, https://apas.gr/).

In fact, the workaround of this problem is very easy — and you probably thought it already by now.

The Like code looks something like this:

<iframe src="https://www.facebook.com/widgets/like.php?
        href=http://example.com">
        scrolling="no" frameborder="0"
        style="border:none; width:450px; height:80px"></iframe>

Instead of giving a statical http:// URL, why not give inside it a WordPress PHP tag called

<?php the_permalink() ?>

This PHP tag will, everytime, give the Like button the permalink URL of the specific post the visitor reads. Isn’t it cool?

So, your code have to look something like this now:

<iframe src="https://www.facebook.com/widgets/like.php?
        href=<?php the_permalink() ?>">
        scrolling="no" frameborder="0"
        style="border:none; width:450px; height:80px"></iframe>

I found it very useful and fun to workaround this little problem. Do you know or can you think of other useful ways of using the new Social Plugins? Feel free to comment below!

P.S.: You can see the custom Like button in action a few pixels below this post.