Last week I was playing around with some FBML and discovered that it’s really easy to add comments to a custom tab on your Facebook fan page. All you need is the page id and a little block of code.
The most difficult part of this is finding the page ID. It used to be in the page URL but ever since custom names for pages became available it’s a little harder to find. Of course, if you don’t have 25 fans yet or haven’t made a custom URL for your fan page, it will be easier to find the page ID.
The code to add comments to a custom tab on your fan page is the following:
<fb:comments xid=”84300445447″></fb:comments>
Please note that the ID number is the one for my fan page. You will want that to change that to the ID for your own page.
The best way to find the ID number is to:
- Go to your fan page and click on the logo
- Once in the album for the profile pictures the ID should be at the end of the page URL. If not, click on one of the images or logos and the ID number will be there. &id=84300445447 is at the end of mine so 84300445447 is the number I need to set up comments on my custom tab.
You can see a working example of this on the demo tab on my (Anti) Social Development fan page.
photo credit: violscraper
vered - blogger for hire says
This IS easy! Thanks Kim.
.-= vered – blogger for hire´s last blog ..Be Kind To Your Behind =-.
Kim Woodbridge says
Hi Vered – I know, right? I thought it would be much more complicated.
Danny Brown says
Ooooh, nice little tip here, Kim. Now you have me wondering how best to utilize something like this – is it a “generic” comments area, or could it tie into something else on your page too? Maybe a post question, or something like that?
Cheers for the great stuff as always!
.-= Danny Brown´s last blog ..Community, Loyalty and the Power of Give =-.
Kim Woodbridge says
Hi Danny – It’s generic. Sort of like the discussions tab but you can put it on a custom tab. To tie comments to an event or video the Live Stream application would probably be the one to use.
http://developers.facebook.com/docs/reference/plugins/live-stream
Ari Herzog says
The wall area is not sufficient for you? I don’t grasp why you’d use it.
.-= Ari Herzog´s last blog ..Being First is Not Always Best =-.
Kim Woodbridge says
Hi Ari – It could be used with content that you wanted people to comment on – perhaps photos, videos, etc … I haven’t found a use for it either.
Dennis Edell | Direct Sales Marketing says
Kim, seriously, FB blog; wus up?? ;) lol
.-= Dennis Edell | Direct Sales Marketing´s last blog ..6 Blogs – 6 Blog Themes. All the Same or All Different? It’s a Branding Issue… =-.
Kim Woodbridge says
Hi Dennis – I know ;-) I just can’t seem to get ahead with the everyday things I need to do.
Casey B says
I’m trying to add a comments stream to the “Chain Stories” tab on the following facebook page: http://www.facebook.com/CharlotteViewPoint. I put the code in but nothing is showing up. Is there something else I need to know?
thanks!
.-= Casey B´s last blog .."She shimmers pink—pink satin pajamas and robe flat against her chest, pink flip-flop bedroom slippers, pink face smeared with night grease, and a pink foam wrap around her hair-do. She looks at me with Yoda’s watery eyes, but her expression is sweet and blank."- "Weather Report." By Sue Friday. =-.
Kim Woodbridge says
Hi Casey – Are you using the correct ID number? Something else in the code could be interfering or Facebook is having a bad day.
Josh says
Hi there,
I’m trying to ad the fb:comments tag to my page, but when i do its not the right size. How can i make the comments block the same width as the rest of my page.
Regards,
Josh
Kim Woodbridge says
Hi Josh – The documentation says that width=”300px” can be added but in my tests the size of the box isn’t changing.
http://developers.facebook.com/docs/reference/fbml/comments_%28XFBML%29
james says
Hi , I just want to know that , how to add like button on the comment box we have created by using the above code????
Regards,
James
Kim Woodbridge says
Hi James – As far as I know, the Like hasn’t been integrated with this method. Perhaps the iframe method has this functionality but I am still learning it.
http://developers.facebook.com/docs/guides/canvas/
Keith Edwards says
Does not work on my page
Kim Woodbridge says
Hi Keith – Do you have any additional information such as the web browser you are using? Did you double check the page ID that you are using?
shrawan says
Hello,
this is my fanpage
http://www.facebook.com/pages/Fanpage-design/132917013435616?v=app_4949752878
I have put comment box but it’s not showing correct size. I have linked css in fbml. when I remove that link it shows perfectly normail and fixed. Can anyone help me why I’m not able to put correct sized comment box? And new problem I found that nomatter whatever I changed in my css file in my server it won’t affect my fanpage. why is this happening?
Thanks,
Shrawan
Kim Woodbridge says
Hi Shrawan – The linked stylesheet might be the problem – I’ve found that inline styling usually works best.
http://www.tizag.com/cssT/inline.php
Ed Bailey says
Thanks, very useful. I spent 3 hrs looking for this answer. However, the reason it’s not working for some of these people is they are cutting and pasting and you used closed quotes on both sides of the i.d. If they type it in or change the quotes after pasting, it should work.
Kim Woodbridge says
Hi Ed – Maybe. I have quotes in the example on my demo Facebook page and it’s works fine.
Ed Bailey says
Kim,
What I mean is that quotation marks come in pairs; the first quote “opens” the quote and the second one “closes” the quote. In certain fonts, they look identical. Your second quotation mark below is of the generic type. The first one however is distinguishable because its font is different (you need to magnify your code below to see what I’m talking about). That first mark is the type used to close a quotation. If someone simply copies and pastes the code straight off your page above, it won’t work. But, if they type the code in, they will put in the proper quotation marks and it will work.
Ed Bailey says
Sorry I meant to paste the code at the bottom of my last reply. It comes right off your page above by copying and pasting:
You can’t hardly see the first quotation mark, but it is not the proper one. It is a close quote.
Kim Woodbridge says
Aaah … yes, I’m aware of the problem. I’ve set up a new system for displaying code but haven’t fixed all of the articles. I’ll make a point to fix the more popular articles first.
David Eades says
I have tried to add the comments box to my custom iframe pages to limited success. I cannot control the width and they do not work in IE. I have also removed the scroll bars. Any thoughts?
Thank you in advance.
Kim Woodbridge says
Hi David – I’m sure it’s set up differently on iframes than on fbml. It isn’t, however, something I have tested yet so I don’t have any answers for you.