New Facebook “Like Button” Dorkage

FaceBook-LogoFacebook, as you may know, is attempting to own a greater share of the web by allowing you to put a facebook “like” button and other social widgets on any web page.   Think what you like about Facebook, their questionable privacy, and their evil plans, but the fact remains that it is the #4 most visited website today and growing.  I’ve just sort of accepted that if someone really wants to they can know pretty much everything I’ve ever done online.  Meanwhile, getting Likes in lots of people’s profiles could be some some potent leverage for me.

I’m not going to reiterate the details.  I’ll just link to them and/or quote them if necessary.  It boils down to this:  There are two ways to do a “Like” button, either insert an iframe in your site (with all the attendant ugliness of iframes), or actually enable your page and use the facebook SDK yourself.

For this blog, for starters, I chose the iframe way because it’s dirt simple.  You just go to the Facebook Like Button Page.  They have a handy dandy code generation form.  Enter any url in it because we’re going to tweak it.  Here’s the code it generates:

<iframe src="" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>

The problem with this easy code is that it only likes the whole site. And I would like to know what people like on an article by article basis. More importantly, if someone reads Johny’s profile I would like it to say and link to “Johny likes Hot Dorkage: New Facebook Like Button Dorkage” rather than just “Johny likes Hot Dorkage” (though I certainly wouldn’t turn up my nose at that last.) The key to that is the URL. So what I did was replace that with a little dynamic code to make the URL be the specific URL of the current blog post. In my wordpress template “single.php” I inserted the following modified code:

<iframe src="<?= urlencode('http://'.$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI']) ?>&layout=standard&show_faces=false&width=450&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:30px"></iframe>

Notice that I replaced the href with some code to calculate the URL on the fly by just appending the current request to the server name. It works just fine. Go ahead and like this post if you wish, to test it.

If you’d rather do a wordpress plugin, here’s one that will do this all for you. As far as I know, the plugins all wrap the simple iframe method of doing the like button.

8 comments to New Facebook “Like Button” Dorkage

  • […] This post was mentioned on Twitter by Colleen Dick. Colleen Dick said: blogmeat: New Facebook “Like Button” Dorkage […]

  • Diogenes

    Hello, I apologize for contacting you in this fashion, but I think you might be interested in submitting your site to my new tech directory…The Tech Directory at

    I’m assuming comments are moderated so when I click submit this post won’t automatically appear on site, if it does, I again apologize.

  • Comments are moderated automatically by akismet.
    So yes, your comment passed muster and appeared immediately. Thanks for the invitation and this is a perfectly fine way to contact me, though I might eventually delete the comment because it is not on track.

  • You really share a great information. The information about two ways to do a “Like” button,is really helpful.keep sharing kind of great post.

  • admin

    The iframe is just like any copy/paste html but the fbml way is little trickier than embedding just any old code because it has to match up with the application you set up i your facebook account.

  • Only stumbled across your blogpost now, Colleen, but it still makes sense of course. I wonder how Diaspora (the open source Facebook alternative) is going to be. Personally I’m kinda totally fed up with Facebook & its authoritative approach. They now even start claiming ‘face’ and ‘book’ are their prerogatives and anyone who dares to create a domain-name with either of those – let’s face (sic) it, seriously general words – in it, may face a letter from the FB-lawyer-department. Anyway, enough rant. Good blog.

  • On the topic of FB… this girl put up a website with the best Facebook statuses… a few of em are actually good haha

  • You must take part in a contest for the most effective blogs on the web. I will advocate this website!

A sample text widget

Etiam pulvinar consectetur dolor sed malesuada. Ut convallis euismod dolor nec pretium. Nunc ut tristique massa.

Nam sodales mi vitae dolor ullamcorper et vulputate enim accumsan. Morbi orci magna, tincidunt vitae molestie nec, molestie at mi. Nulla nulla lorem, suscipit in posuere in, interdum non magna.