As a publisher, you might not want to annoy the visitors of your site with that. So I hacked together an alternative like button, that only connects to Facebook if you click it. Once you have clicked it, it looks and behaves the same as the original button (actually, it’s replaced by the original button when you click it). This way users can decide if they want to let Facebook know that they have visited your site. Try it here:

Here is how you can put this button on your website:

1. Copy the code snippet from here and put it in the HTML code of your page where you want the button to appear.
2. Go to this code-generator on Facebook and configure the button (usually you only need to enter your URL).
3. When you’re done, click “Get Code” on the Facebook-page.
4. From the iframe-field, copy only the characters from the first to the second quotation mark. Make sure you don’t miss the quotation marks, as shown here:
5. Paste this text into the code you’ve inserted in your page in step 1: just replace the string “PASTE_FACEBOOK_URL_HERE”. Keep the trailing semicolon after the end of the string.

That’s it! You should see the button expand when you click it and load the real like button.

If you want to change the text of the button: it’s located in the next to last line of the code. Just change it to whatever you like. The button will resize to the length of the text.

This code basically just displays a button and applies a stylesheet from Facebook to it, so it looks exactly like the real like button. Of course you can replace it with your own customized button. Just make sure that the ids of the button and its container stay the same (“flb” and “flbCont”) and that it calls insertLikeButton() when clicked. This function replaces your button with an iframe that sends your parameters and the user’s cookie to facebook and loads the actual like button and friends info.

If you have problems with the width and height of the expanded button, you should give the container div named “flbCont” a size that fits your needs. The loaded iframe will be resized to these dimensions.

This button actually allows Facebook to track all visitors of the external site, no matter if they click it or not (as long as they are Facebook users – but who isn’t?). Facebook can do that because they use an iframe to display the button. An iframe is something like an embedded browser window within a page. The difference between using an iframe and a simple image for the button is that the iframe contains a complete web page – from Facebook. There is not much going on on this page, except for the button and the information about how many people have liked the current page. Click here to open a like button page in a new window.

So when you see a like button on cnn.com, you are actually visiting a Facebook page at the same time. That allows Facebook to read a cookie on your computer, which it has created the last time you’ve logged in to Facebook. The cookie remains on your computer for months, even when you didn’t check the “keep me logged in”-option in the login form. It contains your Facebook user-id. A fundamental security rule in every browser is that only the website that has created a cookie can read it later on. And that is the advantage of the iframe: it allows Facebook to read your Facebook-cookie even when you are visiting a different website. That’s how they recognize you on cnn.com and display your friends there.

What I don’t like about this is that it is not opt-in. You’re not asked to be tracked on external sites by Facebook, and there is also no opt-out in the Facebook privacy settings. Honestly, you can’t blame Facebook for that, because there is no way they could check your privacy settings before they know who you are. The only way you can avoid being tracked by Facebook on other sites is to logout of Facebook before visiting any other site. That will delete the cookie.

(If you have a website or blog and want to include the like button, but do not want it to track the users without their consent, have a look at this post where you can see how to make a like button with opt-in)