Tag Archives: Fan

Designing a Like Box for a Facebook Fan Page

Creating a Like box for your Fan Page is a little different than a Like button. In order to boost your Fan Page prevalence you need to keep increasing your fan base.

Getting people to click the “like” box for your site can help generate positive word-of-mouth and spread your name more quickly among their friends. It is a wonderful way to get free advertising, simple to use and only takes one click!

First you will need to go to your Fan page. Copy the URL.

Then go to http://developers.facebook.com/docs/reference/plugins/like-boxand paste the URL in the field below Facebook Page URL.


From here you can style the Like Box. When finished click Get Code and copy and paste the code to your website in the html source code.  Besides adding it to the homepage of your website it might be beneficial to have it on every page since not all visitors go directly to the homepage.

What makes up the number shown on my Like button?

The number shown is the sum of:

  • The number of likes of this URL
  • The number of shares of this URL (this includes copy/pasting a link back to Facebook)
  • The number of likes and comments on stories on Facebook about this URL
  • The number of inbox messages containing this URL as an attachment.

When I click the Like button, the popup window (or “flyout”) doesn’t show. Why?

If the Like button is placed near the edge of an HTML element with the overflow property set to hidden, the flyout may be clipped or completely hidden when the button is clicked. This can be remedied by setting setting the overflowproperty to a value other than hidden, such as visiblescroll, or auto.

Creating a Facebook Like Button

I talk to people everyday about Facebook. During these conversations I am always amazed that people don’t know much about Facebook. Sure, everyone can find friends and create a profile. However, there is so much more that people can do with Facebook.

With that in mind I am going to write a series of blog posts that explore some Facebook features in detail.

Back in May Facebook launched the Like button and Like box. That has been replaced with the Like box and Facebook has added another twist to it… besides liking Facebook Fan Pages visitors can like specific blog articles, video, images; and when they like them they will be shared with their friends. Here is an example along with a quick tutorial on creating a like button and box for your website.

Let’s talk about the Like button…

The Facebook Like button is fairly simple. It includes a little thumbs up icon along with a short phrase “Be the first of your friends to like this”. Facebook allows for some minor customization such as width, height, different fonts, and few other tweaks. Truly, there isn’t much to it. Then again, it’s not meant to overshadow your website. It’s meant to share your content with the Facebook community (700+ million users).

Create your own Like buttons…

Searching through the developer section on Facebook you will run into the Like Button page. Here you can create Like buttons for your site. It’s pretty straightforward. First enter the url or web address of the webpage that you want others to like. Choose from a few design elements and grab the code. Bingo, you have a Like button! From there you can paste the code into a blog article (in the HTML source).


Below is some interesting information about the Like Button.

How do I know when a user clicks a Like button?

If you are using the XFBML version of the button, you can subscribe to the ‘edge.create’ event through FB.Event.subscribe.

When will users have the option to add a comment to the like?

If you are using the XFBML version of the Like button, users will always have the option to add a comment. If you are using the Iframe version of the button, users will have the option to comments if you are using the ‘standard’ layout with a width of at least 400 pixels. If users do add a comment, the story published back to Facebook is given more prominence.

What analytics are available about the Like button?

If you visit facebook.com/insights and register your domain, you can see the number of likes on your domain each day and the demographics of who is clicking the Like button.


%d bloggers like this: