Almost anybody who uses the internet today has seen and clicked on a Facebook ‘Like’ button, they are on almost every website in one form or another. For a long time Facebook users have wanted to add a ‘Like’ button to their custom Static FBML tabs but until now have been unable to. I’m sure that many of you have searched all over the web looking for a solution only to find everyone telling you that it’s just not possible, well now there’s finally a solution! This tutorial will teach you in two easy steps how to add a Facebook ‘Like’ button to your Static FBML tab.

Step 1: Get the Facebook FBML Comment Code

So what does Facebook’s FBML comment code have to do with adding a ‘Like’ button to your Static FBML tab? Well, up until now Facebook had removed the ‘Like’ button from the Static FBML version of the comment plugin. Add the following code below to your Static FBML tab but remember to change the ‘xid’ # with your fan page ID number and replace the ‘returnurl’ with your fan page URL or the URL you want fans to like. Now we finally have our much sought after ‘Like’ button but along with an unneeded comment system, in Step 2 we will teach you how to get rid of everything but the ‘Like’ button.

<fb:comments xid="34572893685" returnurl="http://www.facebook.com/wordpressdesign" simple="1"></fb:comments>

Step 2: Using CSS to Get Rid of Everything but the ‘Like’ Button

Since Facebook has finally decided to add the ‘Like’ button to the Static FBML version of the comment plugin, we can use a little CSS magic to get rid of the actual comment system leaving us with only the desired ‘Like’ button. By adding the two lines of CSS code below you should now no longer see the comment system and only the ‘Like’ button should be visible. It’s that simple!

.connect_widget_sample_connections { display:none; }
.comment_body { display:none; }

Troubleshooting

If you are having problems getting this tutorial to work please reread the tutorial and try again, if you still cannot get it to work please leave us a comment below and we will respond as soon as possible.

Posted In

Tutorials