Today I would like to share that how to add a Facebook fan list to your blog or website (like I have added here at right sidebar). This is the best way for your blog/website readers to connect with you on Facebook.
The Facebook Fan Box is a social widget that allows you to attract and gain Facebook fans from your own blog/website. Before you add a Fan Box to your website, you need the following:
a) A website, and the ability to modify files on your website.
b) A Facebook Page that promotes your website (you must be an admin of the Page).
c) A basic understanding of HTML, so you can edit the pages on your website where you want to place the Fan Box.
Now lets add fan box to your blog/website
The Fan Box is based on the fb:fan tag. The easiest way to add the Fan Box to your site is to use the Add a Connect Widget wizard, which you reach in one of three ways:
» Under your Page's profile picture, click the Add Fan Box to your site link.
» Under your Page's profile picture, click the Edit Page link, then click the Add Fan Box to your site link under Promote Your Page.
» Following this URL to the wizard: http://www.facebook.com/developers/wizard.php then selecting the Page from the Make a Fan Box for this page list at the top of the wizard.
The Fan Box wizard appears.
Use the check boxes on the wizard to specify which elements of the Fan Box you want to show.
» Checking the Include stream check box displays your Page's stream on your site. The stream updates each time the Page loads.
» Checking the Include fans check box displays a certain number of your Page's fans. You can change this setting, as described below.
The wizard automatically generates the JavaScript code you need to easily add the Fan Box to your site. The wizard creates a Facebook application and corresponding API key. If you already have an API key from your Facebook Connect site or another Facebook social widget like the Comments Box or the Live Stream Box), you must replace the auto-generated key with that API key.
The JavaScript code the wizard generates looks similar to this:
<script src="http://www.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript">FB.init("API_KEY", "");</script>
<fb:fan profile_id="YOUR_PAGE_ID" stream="1" connections="10" width="300"></fb:fan>
<div style="font-size:8px; padding-left:10px"><a href="VANITY_URL">PAGE_NAME</a> on Facebook</div>Copy above code to any page on your site where you want to display a Fan Box.
Important: If you want to place a Fan Box on a page on your site that already references Facebook Connect (that is, the page contains one script that calls FeatureLoader.js.php and another that calls FB.init), then you must not reference these scripts again. You simply can just put in the
fb:fan tag where you want the Fan Box to appear. As in:<fb:fan profile_id="YOUR_PAGE_ID" stream="1" connections="10" width="300"></fb:fan>Adding Facebook fan box to blogger
» Get the code for your Facebook Fan Box like above. This can be done in a few ways, see the image above, or visit the fb Fan Box Wizard.
» Sign in to Blogger and go to Layout > Page Elements.
» Click Add a Gadget.
» Choose Basics > HTML/Javascript
» Add a Title and paste the code for your Facebook Fan Box under Content.
» Click Save.
» Preview and edit again if necessary.
» Don't forget to Save the changes once you are finished.
You can edit this part according your choice:
fb:fan connections="6"
width="200"
height="554"I request you all please become a fan of Tutorialfeed on Facebook by clicking here or by clicking at right side bar fan box. Exchange and share your ideas, tips, tutorials, resources etc. at TutorialFeed on Facebook.
Do you have any opinion, leave a comment.
Subscribe to TutorialFeed via RSS
27 comments :
Integrating Facebook with websites is something more and more people want. Thanks for this information.
Very useful and clear information. Thank's. I will try to implement a Facebook Fan list on my website.
very helpful for me. Thanks for this blog.
Nice I will try this
Blogging Tips
more download http://sanatdj.blogspot.com/
Hey, it is a very nice and easy tutorial for adding facebook fans on a blog.
thanks for information,,,,, nice way to advertise something.
I will try it soon.
I have spent the day trying to figure this out. After giving up, and having a strong drink. I decided to try again and found your site. Amazingly, I got it fixed and working. THANK YOU!
how to place the 'iframe' code , which is given by FB wizard these days.
Very thanks for providing the information.
What great blog. I really like the template you used and I found your post extremely informative. Keep it up.
Twitter and Facebook allow you to share your news or information with the world.
Well i would just like to say that thank you so much facbook fans for all your help its very nice work you done there
I definitely enjoying every little bit of it.It is a very nice and easy tutorial for adding facebook fans on a blog. I have bookmarked to check out new stuff you post.
Thanks, I was looking for this. It works like a charm and very simple to implement.
This sought of information is quite useful and get the basic concept and i will try it definately
Thanks.I like this work.
Thanks for the share
Thanks for sharing this great information. I really enjoyed reading about this,and I'm going to let other people know about this as well.
Very helpful tutorial. I'll love to try it. Thanks!
Nice tips share. I will try to connect my fanpage to my blog.
Useful tips.. going try this.. thanks
excellent tips and i must be the one is going to try it asap so thanks for sharing the nice stuff.
I am implementing this as we speak. Awesome screenshots and very helpful script. Thank you!
Yes, the picture, screenshot described everything .....
Pretty insightful post. Never thought that it was this simple after all. I had spent a good deal of my time looking for someone to explain this subject clearly and you’re the only one that ever did that.Keep it up.
Although she asserted that she believes she was hypnotized, she remembered the incident.
After many years of professional hypnotists struggling
to to educate the public about the nature and benefits of hypnosis there is little
good to say about this disappointing exploitation of their profession.
Linear thinking falls apart when one is unknowingly missing a
piece of the puzzle.
Feel free to surf to my web site ... how to hypnotize someone
Post a Comment