H3ATHER'S HELPFUL HINTS

Blog Central Helpful Hints Running and Stuff Eats & Drinks About Me

Add Facebook Comments Box to Google Sites Pages

39 people like this. Be the first of your friends.LikeLike ShareShare

(If you're looking for how to add Facebook like boxes/buttons toyour page, click me.)

Update! I'm too lazy to elaborate, but here's a link toanother, easier and possibly more elegant solution tothis.

So this is actually helpful. It might be the only truly helpful post Iever create (and it's only helpful to some), so don't be expectingmuch more than this.

Facebook has a nice Comments plugin that, when embedded inyour site, allows people to comment on your site and post thosecomments to their Facebook walls as well. It is fairly idiot-proofexcept for the fact that Google Sites throws up all over it whenyou try and paste it into their html editor because they don'tallow JavaScript. As such, you have to embed the plugin as a"Google gadget".

You can use an already existing gadget called "Code Wrapper"for this, which allows you to embed JavaScript into your Googlesite. It is easy to use and works quite well IFF* you don't care ifit plays nicely with Safari and Chrome. The creator of CodeWrapper says that it works with some versions of Safari andChrome, but I'm running the latest versions of both and sadly itworks with neither.

(But here's a link to the creator of Code Wrapper if you'reinterested in going that route, 'cause all you have to do is "insert"a Google gadget on your page, search for and select "CodeWrapper", copy the code that Facebook provides you (link to theFacebook Comments plug-in is at the very bottom of this post)and ~BOOM~ you've got a Facebook comments box that worksin Firefox and IE, and if you don't care about Chrome or Safariusers it works just fine (Fuck those pansy-ass Apple followersanyway, right? A real man uses Windows and LIKES it,dammit!).)

But if you're not satisfied with only accommodating half of themajor browsers out there, I've found a work around that's fairlyeasy, though not incredibly elegant because I'm a pretty shittydeveloper, which is why I'm a software exec (see How to be anExecutive for more info on how to weasel yourself into that kindacushy gig).

*IFF = "if and only if" for you non-nerds out there...

1. Take the following code and save it to a text file (via a texteditor like notepad, etc.). Note that the URL highlighted inyellow below needs to be replaced with your web page's url. <?xml version="1.0" encoding="UTF-8" ?> <Module> <ModulePrefs title="__UP_title__" directory_title="Comments" scrolling="true" height="400" width="525"title_url="__UP_titleurl__"/> <UserPref name="title" display_name="title" datatype="string"required="false" default_value="Comments" /> <Content type="html"><![CDATA[ <div id="fb-root"></div><scriptsrc="http://connect.facebook.net/en_US/all.js#appId=APP_ID&amp;xfbml=1"></script><fb:comments href="http://www.h3ather.com" num_posts="4" width="500"></fb:comments> ]]> </Content>

Find us on Facebook

H3ather's Helpful Hints

1,292

Facebook social plugin

LikeLike

1,292 people like this.

Stuff I LIkeFunny Stuff

The Other White Meat27b/6PhillyDBroStories

Nerdy Stuff

LifehackerMashableWiredcnet

Running Stuff

Look Here!

Other Stuff

Facegoog | LatestFacebook, Google andtechnology newsPost Secret

Yo Look HereFeel free to contact me at:

yourule@h3ather.com or

yousuck@h3ather.comwhichever you feel is most appropriate

at the time...

About Me (sorta)

256days since

A Super-Important Event

Sitemap

Search this site

Add Facebook Comments Box to Google Sites Pages - H3ATHER'S HELPFUL HINTS 2/7/2014

http://www.h3ather.com/add-facebook-comments-box-to-google-sites-pages 1 / 8

</Module>

2. Save the above text file with the ".xml" extension.

3. Upload the file to your site (If you are editing a page, go to"More Actions" on the top right-hand side of the page and select"Manage Site".)

4. From the "Manage Site" page select "Attachments" on theleft-hand side of the page and then upload your xml file that youcreated as an attachment to your site.

5. Go to the page you want to add the comments widget to andin edit mode, go to the "Insert" menu at the top left of the pageand select "More gadgets..." at the bottom of the menu.

Add Facebook Comments Box to Google Sites Pages - H3ATHER'S HELPFUL HINTS 2/7/2014

http://www.h3ather.com/add-facebook-comments-box-to-google-sites-pages 2 / 8

6. This will open the "Add a gadget to your page" dialog. Select"Add gadget by URL".

7. This will open up a dialog asking you to enter a URL. Enterthe URL for the XML attachment you uploaded (from theAttachments page, you can right click on the attachment andselect "copy link location" to get the URL for that attachment -see second picture below)

Add Facebook Comments Box to Google Sites Pages - H3ATHER'S HELPFUL HINTS 2/7/2014

http://www.h3ather.com/add-facebook-comments-box-to-google-sites-pages 3 / 8

8. Once you've added the URL for your XML file, the "Set up yourgadget" dialog will appear. You can change the displayinformation and the title, but the widget and height should beoptimized already. You can preview the gadget first if youwant. If there are any issues you should be able to see them inthe preview. Generally it will be a URL issue in your XML file.

9. Once you are satisfied with your comments gadget, click"OK". Once you save your page you should see the commentsgadget. (You have to save your page to see how it looks.) Itshould look similar to what is shown below:

10. For more information on the Facebook comments pluginitself, go tohttp://developers.facebook.com/docs/reference/plugins/comments/

Comments

Add Facebook Comments Box to Google Sites Pages - H3ATHER'S HELPFUL HINTS 2/7/2014

http://www.h3ather.com/add-facebook-comments-box-to-google-sites-pages 4 / 8

100 comments

Rob Ficano · · Head Slacker at I've never worked a day in my life

How can I use this to make money?

Reply · Like · Follow Post · June 19, 2013 at 9:52pm

Follow

Bela Aris · Works at PT. Glabel Indosakti Ananta

Hope it works

Reply · Like · Follow Post · October 31, 2012 at 1:48am

Jon Miller Time · Top Commenter · Owner (Traveler) at BigBoyTravel.com

how can you subscribe to all posts?It looks like Facebook says you have to put in the code below but I can't get it to work: <meta property="fb:app_id" content="{YOUR_APPLICATION

Reply · Like · Follow Post · October 12, 2012 at 4:35am

Xavier Bacalla

I badly need this for my class website. Thank you very much. ^_^

Reply · Like · Follow Post · September 12, 2012 at 7:41pm

Simon Garcia · Top Commenter

I've always wanted to have a Facebook comments gadget that could auto read the current page URL, would auto adjust height, and was simple to add to a Google Site. So Icreated one at http://gadgets.joinrsite.com/get/leave-comments.

Sign in | Recent Site Activity | Report Abuse | Print Page | Remove Access | Powered By Google Sites

Add Facebook Comments Box to Google Sites Pages - H3ATHER'S HELPFUL HINTS 2/7/2014

http://www.h3ather.com/add-facebook-comments-box-to-google-sites-pages 5 / 8

Home Buzz Debris Podcasts Forums Mailbag

Add Facebook Comments to Google Sites

I figured since I had so much trouble with this aspect of Google sites, that I should create a page explaining how I eventually accomplished thecomments section below. Follow these steps to add Facebook Comments to your Google site webpage.

Here is the gadget URL:https://sites.google.com/a/hypinandhatin.com/home/add-facebook-comments-to-google-sites/FacebookComments.xml?attredirects=0&d=1

1. Make sure you are signed in and able to edit your webpage.2. Click the pencil in the upper right hand corner of the webpage

3. Click "Insert" in the upper left hand corner of your screen. In the drop down that appears, select "More Gadgets."

4. Select "Add gadget by URL" in the box that appears.

Search this site

Add Facebook Comments to Google Sites - Hypin' & Hatin' 2/7/2014

http://www.hypinandhatin.com/add-facebook-comments-to-google-sites 6 / 8

5. Paste the gadget URL into the "Enter the URL for a gadget you want to add" text box.

6. Add your website to the URL to content (required) text box. aMake sure to click "Include a scrollbar when necessary. Click OK

The results of these steps can be seen below.

Add Facebook Comments to Google Sites - Hypin' & Hatin' 2/7/2014

http://www.hypinandhatin.com/add-facebook-comments-to-google-sites 7 / 8

Report Abuse | Print Page | Remove Access | Powered By Google Sites

FacebookComments.xml Hypin Hatin, ďv.1

Add Facebook Comments to Google Sites - Hypin' & Hatin' 2/7/2014

http://www.hypinandhatin.com/add-facebook-comments-to-google-sites 8 / 8