Customizing Your Facebook Widget

I put my Facebook Fan Box widget on my blog a couple of days ago (see right hand column and scroll down), and I love how it looks! Rather than the text link to my Facebook fan page that I have under the "Important Links" section, I now have an attractive Fan Box that shows my fans on facebook, and hopefully entices others to click and join! Have you gotten yours yet?


Of course, as I did with the Etsy Minis on my blog, the code for the Facebook Fan Box had to be modified a little to make it fit correctly. If you have a blog on blogspot, the Fan Box may be too big initially.

Here is how I got the code for my Fan Box from Facebook, and how I implemented it to fit correctly in my blog:

1) Go to your fan page in facebook.

2) Click on Add Fan Box to your site

3) This will take you to a page where you can set up your widget. I chose to check "Include Fans" only. The streaming version takes up too much room in my opinion, but you can check it if you like.

4) Copy the code generated and add it to your blog layout (this would be a gadget in blogspot).

Now take a close look at the default widget that is produced in Step 3 (sorry for the bad resolution). Do you see how it is wider and has more fans listed than the widget that is in my blog? There are a couple of parameters that you can change in the code to get the same results as mine. Or you can play around with the numbers and see what suits your blog best.

In the code that is generated, the default number of fans listed is 10, and the width of the box is 300 pixels. I changed these two parameters to make my widget fit better:

- To change the number of fans, look for the text in the code that says connections="10" Simply change the number 10 to the number of fans you want to display. In my case, I changed it from 10 to 6.

- To change the width of the widget, find the text in the code that says width="300" (which should be right next to the "connections" text) and change the 300 to a smaller number to make the box narrower, or a larger number to make the box wider. In my case, I changed the number to 200. Depending on your blog layout, this number can vary.

And there you go! I hope this helps you all put a nice Facebook Fan Box on your blog!! Good luck, and convo me if you need help!