How To Add A Facebook Fanbox or Badge To Your Website
ByUpdated Post on Facebook Fan/Like Badges Available Here (7-9-10)
Do you have a Facebook Fan or Business page and want to get the word out that it’s there so more people will find you? Maybe you want to promote someone else’s fan page on your website or blog.
Facebook has made it so easy with code to copy and paste into your website or blog.
First, you’ll need to be an administrator of the Fan Page you want to promote. So log in and look on the left for editing options and you’ll see the ‘Add Fan Box to your site’.
Click on Fan Box and it’ll take you to the next page where you’ll select either to add a Fan Box or a Fan Badge to your site.
You’ll see choices of Blogger, TypePad or ‘Other’, so choose the appropriate one and then you’ll be taken to another page where you’ll either sign into Blogger or TypePad, or you’ll be taken to the ‘Other’ page where you’ll see a box with instructions. Just put your cursor in the box and it automatically will select all the text. Click Ctrl+ C to copy and then you’ll need to paste it into your website or blogsite.
If you have a hosted WordPress account (you have wordpress in your url), this won’t work for you. I found it only works in the self-hosted wordpress.
Since I don’t have a Business Page, I tried this with the Technology Innovations Fan Page I administer and it worked great. I added a text widget and pasted the code in it, added a heading and it was finished. I did have to tweak the width settings a bit as the default of 300 was a bit too wide for my current theme. I set the width to 200 and it fit. When you paste the code in, you’ll see it says ‘width=300’, just change the number if you need to. The length will automatically adjust for you. If you prefer a Facebook badge, follow the same instructions except for selecting the badge part.
The code can be added to a traditional website as well. Here’s a short video by Rich Brooks that explains the process for you.
Try implementing this simple, but powerful marketing tool from Facebook.
Very interesting! Thanks for the read. -Tom
Very interesting! Thanks for the read. -Tom
Hi – I don't comment on many sites but had to on yours. It's really nice! Thanks for having this site. I'll bookmark it and visit regularly. Please check out my site at http://www.ArtRL.com when you have a few minutes and please let me know how you like it. Keep up the fine work!
I'm glad you like my site. I try to find things that would be interesting to a wide area of interests. I did go to your site. I'm especially enjoying discussion about Google Voice and how the telcoms will adjust to it.
Lynn Dye
Just Googled and read the whole article and i must have to say that me and my husband loved reading your post. I liked your site because of the easy language you used to explain things here. Now i can stop my research having found my answer in this awesome article. We bookmarked and will regularly check more quality tips to come from your website. Thanks alot.
Thank you for your kind words. My goal is to make things easy to understand for my readers.
Lynn
Thanks, bookmarked this blog.
I'm having trouble with this. I've tried several times to add the Facebook badge to my wordpress blog. But when I click on the badge it takes me to an error message on Facebook rather than the fan page. Any suggestions?
Hello,
I looked at your url and since you have the hosted wordpress blog, you aren't able to put a badge on your page. Hosted means that WordPress is keeping your posts, etc. on THEIR server. If you had a NON-hosted WordPress, you would pay for hosting somewhere, like Hostgator.
What you can do is put a widget on your site. I know that words for the hosted WordPress because I've done it for a client. Here is a link to networked blogs on facebook with the code you'll need along with instructions. http://apps.facebook.com/blognetworks/promotepage…
Hope this works for you. If the link isn't working, just go to Facebook and go to the networked blogs section and look for the networkedblogs widget.
Lynn
I'm the admin, why I don't see the ‘Add Fan Box to your site’ option?
I just found your webpage from Google. It has lots of very interesting information. I will definitely be bookmarking your site. Anyhow, pop over to my blog if you want to give up smoking.
I love Google Voice. There SMS feature actually got me into it. I can send free text messages to Bangladesh, India, and USA. It saves me good money on my texting plan from Verizon Wireless because I can use that to send now. I think Google always does a wonderful job of giving customers what they require and need. I have found in the future they are incorporating Voice with the Android. Plus they purchased a new VoIP company which they will incorporate with the other two to give some outstanding features. I need to get myself an Androind now haha.
Everyone should use social bookmarks as a part of internet marketing strategy because it is a advantageous way to increase the exposure of your site. But having a automatic bookmarking software is crucial, because this way you will save an average of 3-4 hours a day, or possibly an average of $200 per month in bookmarking services while you develop the greatest results in terms of traffic and Page Rank increase.
howdy, I like all your posts, keep them coming.
I clicked on this site by searching Google. I have found it quite interesting. Thanks for writing about this. I will have to come back here again!
Thanks for the sharing really usefull. I would like to bookmark this site.
I am the admin for http://www.facebook.com/pages/Sleeping-OUT/357363… but do not have a "Add Fan Box to your site" option when logged in. Are you abe to assist?
Thanks for visiting my blog and for writing.
Since I wrote the article, FB changed the way to do this. Now when you're logged into your page and have clicked the 'edit page' link, then you'll see a bunch of choices starting with 'Settings' along the left hand side. BUT what you what is WAY down on the right hand side where it says, 'Promote with Facebook Badge' and a link under that says 'Get Your Badge'. Click that and then you'll be instructed how to put a widget on your website.
Hope that answers your question and good luck with your business.
p.s. I also sent an email directly to you with these instructions along with an illustration.
[...] Last October, I wrote about how to add a Facebook Fan Page to your website. Since then, many things have changed and been updated, so I thought I’d update my post to show what Facebook has available in July of 2010. [...]
Keep it up the good job
Hello, your instruction for the fan badge are quite clear, but I feel like I'm losing my mind! Why don't I see these side options (in your image) listed on the left side of my page? All I see are:
Edit Page
Promote with and Ad
Suggest to Friends
I've looked all over for Add Fan Box to your site as I'd like to put this on my website. What am I doing wrong?
Duh…… sorry, did not read all the posts. I see the one above mine has the answer I was looking for. Thank you!
Hi Susan, You found the updated post before I could point it out – great! Since FB is always changing things, menu items move around too. Someone else had written about it and when I went to look at my instructions, I found the new way to do it. Take care.
Lynn
Thank you for this post!
Guys, if you can't find it in your facebook page, simply click this link:
http://www.facebook.com/badges
and
http://developers.facebook.com/plugins
If you are looking to add Facebook Fan Box to Board3 Portal/phpBB see http://www.expertcore.org/viewtopic.php?f=74&… for a quick guide.
I tried to add a fb badge to my site and it just made a scroll box with the code in it. I know how to get the code from fb but it just says "paste this into your website" I guess I don't know how to do that. I put it in my website (I use rapidweaver and pay to host it) as code but it is not working do you have any suggestions?
Thanks for writing. First, make sure you're getting the code for the type of site and software you're running. To make sure you get all the code. put your cursor in the box and hit ctrl+A (on a PC), that will select all the code, then you can do your ctrl+C to copy and then take it to your site and paste it in (ctrl+V). Also make sure you're putting it in the right kind of web 'container' specified by Facebook. Good luck!
I have a wordpress blog hosted elsewhere. I get till the Ctrl C part. Where do I post it it in my website? Which file? I tried the style.css. Ddin't work.
Just so you know, it looks like the location has been changed yet again. It is now (as of November 2011) part of the Facebook Like Box plugin.
I found it at this location:
http://developers.facebook.com/docs/reference/plu…
Basically, you can either show or hide faces, as well as show or hide your stream (whatever that is) as well as the header.
It says that the minimum supported width is 292 pixels wide, but we set ours to 185 and that seemed to work. At least I *THINK* it works ok. You can kindly let us know if it ISN'T working correctly by going to this page:
http://www.siamese-dream.com
One crazy thing though was that we tried to adjust the height while on the facebook page and it get giving us the wrong height (we are using the iframe version), so once we put the code on our site, we re-did the height by hand. It ain't rocket surgery, and if I can do it, then ANYBODY can do it.
Hope this helps. Keep up the good work.
Pat on the back…
Thanks a great deal, you have given me a grin….
Asking questions are truly fastidious thing if you are not understanding anything entirely, except this piece of writing offers nice understanding even.
Hi pals. .
Awesome tutorial. . yet here is another tutorial on adding facebook pop up box for blogger (http://www.bloggertricks.biz/2012/02/add-facebook-pop-up-box-for-blogger.html) and adding 4 in 1 social widget sliders for blogger (http://www.bloggertricks.biz/2012/03/add-4-in-1-social-sharing-slider-widget.html)
nice info.