How can I embed a Google Docs collection in an Ifr

Question

I have a Google Docs collection that I would like to embed into an iframe:

https://docs.google.com/open?id=0B6yYgWS-CUJ2ZTUxZGI4MGUtMWM0Yy00YzY0LWIxOTMtMDFlN2RjNDAxNGM2

The problem here is that Google has set the X-Frame-Options header and so it seems they only allow this collection to be embedded into a Google site:

X-Frame-Options:    SAMEORIGIN

screenshot-with-shadow.png http://img580.imageshack.us/img580/4526/screenshotwithshadow.png

Now I realize Google's reasons for not allowing their content in iframes some of the time, but this is one case where I feel like it would be nice to have the ability to do this.

With documents Google also allows two methods of "sharing"

1. You can click on the "Share" button and set visibility, which will give you a link to a document
2. Or you can click on "Publish to Web" and it will give you a link or an iframe option.

The iframe url is similar to the link URL except that it has the "&embedded=true" query variable at the end. The same thing is true for Google Maps except the parameter is "&output=embed"

Who while I believe there is nothing I can do with headers or Javascript on my site to allow the content of an iframe for a Google Docs collection to load, I was hoping someone might know of a way to generate embed code for a Google Docs collection which would allow it to be loaded in an iFrame.

Answer 1

Try these:-

single – setting to true displays just one sheet in the spreadsheet. The default sheet it will display is the first one created in the spreadsheet. This can be changed using ‘gid’ below.

gid – this needs to be a numeric identifier of the sheet you want to display. The first sheet created is 0, but others will have longer identifiers. To find the ‘gid’ for the sheet you want to display, go to the spreadsheet in Google Apps itself, and click on to your desired sheet. The URL in your browser should change to something like this: https://docs.google.com/a/mycompany.com/spreadsheets/d /15B___SOYjsRmU9tiwZly318HZnFHOHeayS6UTHx7Pu2I/edit#gid=419657423

The bit at the end of the URL shows you the ‘gid’ for the sheet, and that is the number you need to bring into the shortcode in your website.

range – set this to the cell range you want to display within the sheet (or leave it out to display the whole sheet). In our example, we set this to f2:g6. Note if you’re being pedantic then you should really change the ‘:’ to ‘%3A’ since colons should be encoded in URLs – but most browsers should understand the colon, so don’t worry. If you like to be correct, you’d use range=f2%3Ag6 instead.

headers=false - Row numbers and column letters are not displayed.

widget – setting this to false removes the sheet selector bar when it’s embedded.

chrome – setting this to false removes the title bar showing the spreadsheet name, above the sheet.

So putting all together:-

<iframe> src="https://docs.google.com/spreadsheets/d/[Googlekey]/pubhtml?gid=28&range=a1:s45&single=true&widget=true&headers=false" </iframe>

Allan

Answer 2

Update: It looks like Google has allowed embedding Google Docs/Drive items via iFrame. Here are the current headers for that page (note that this URL is after the redirect):