customizing facebook like-box

Question

I would like to customize the design of my facebook like-box. ive already search the net and follow all the instructions, here's the link ive tried but its seems obsolete:

http://www.daddydesign.com/wordpress/how-to-customize-your-facebook-fan-box/

there are lots of tutorial in web, but have the same solution.

been stuck for almost 2 hours in this. can anyone knows how to customize the like-box?

your help is greatly appreciated.

Answer 1

Weltkind got it right. The trick is that, when you change <fb:like-box> to <fb:fan> you must then include the profile_id attribute as well, or it won't show anything! If you renamed your fan page URL like I have, the original number can be taken from the insights page. I'd upvote Weltkind, but I don't have enough reputation to yet. Doh. :)

Answer 2

You can customize the facebook like box by using html code. The simplest way, follow this step.

<div id="facebooklikebox-3" class="widget widget_FacebookLikeBox"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="https://www.facebook.com/607728429342897" width="290" show_faces="true" border_color="AAAAAA" stream="false" header="true" class=" fb_iframe_widget" fb-xfbml-state="rendered" ><span style="vertical-align: bottom; width: 290px; height: 400px;"><iframe name="f25883e0a8" width="290px" height="1000px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="yes" title="fb:like_box Facebook Social Plugin" style="border: none; visibility: visible; height: 400px;" class=""></iframe></span></fb:like-box></div>

Put this code in your html code and replace iframe's url to your facebook page url.

You can get reference here

Answer 3

1. Get XFBML code from here: http://developers.facebook.com/docs/reference/plugins/like-box/#
2. Rename fb:like-box to fb:fan
3. Upload your css file on your web-site
4. Add this params to fb tag: profile_id="ID OF YOUR PAGE" css="http://example.com/css/your-cutom-style.css?1"

Enjoy :)

Answer 4

what exactly is your problem? the instructions on the link provided do work pretty good. be sure to update the "?1" parameter of your css file everytime you make changes and upload it.

if you have a link i could help you some more.

Answer 5

You can't customize the iframe method. However, you can customize the xfbml method via your own css. See this page: How to Customize your Facebook Fan Box

Answer 6

Facebook has a "wizard" that pretty much gives you all the options and styling that is allowed.

http://developers.facebook.com/docs/reference/plugins/like

http://developers.facebook.com/docs/reference/plugins/like-box