Update March 30, 2020: The coronavirus disease 2019 (Covid-19) I suspect has greatly increased interest in using remote collaborative tools such as Google Sheets, Docs, and other Suite tools offered by the company (not to mention Slack, Zenkit, FaceTime, and on and on). Given that, I have tried to increase the visibility of this post. Thank you and best of luck making it through this global crisis.
Update April 14, 2014: With the help of a Good Samaritan reaching out to me via email, a solution has been found for embedding specific ranges of the new Google Spreadsheets (they were updated in early 2014) onto your site. Here’s the new trick:
- Publish your sheet to the web by going to File > Publish to the web.
- Grab the Embed code (it uses an iframe).
- Modify the iframe code so it reads like so. You’ll need to change different pieces of the code to match your own spreadsheet:
<iframe src="https://docs.google.com/spreadsheets/d/1B56....this will change according to your spreadsheet/pubhtml/sheet?headers=false&gid=0&range=A1:C10" width="400" height="350"></iframe>
For comparison, here is what my example’s original embed code looks like:
<iframe src="https://docs.google.com/spreadsheets/d/1B56....this will change according to your spreadsheet/pubhtml?widget=true&headers=false"></iframe>
- To explain the differences, this new, working embed code differs starting with that “/” placed after the “pubhtml.” The original embed code actually has a question mark.
- This new embed code also differs in how everything follows after “pubhtml/”. You don’t use the word “widget=true.” And that “gid=0”? You get that from the URL of the spreadsheet you are editing in Google Docs.
- You’ll see that you can’t call out named ranges, but you can manually specify the range. This is the “&range=A1:C10” that follows “&gid=0”.
And here’s an example of the working embed code:
Below is an embed of the second sheet within the same test project. To embed this specific sheet, I had to click on its tab within the project to make it active, then inspect the URL that gets loaded. That URL contains the gid number. It’s not something simple or logical like “2” or “1.” In my case, it was 2106886376. So all you do is change the functioning embed code to reflect that.
So here’s what the embed code for the 2nd sheet in my project looks like:
<iframe src="https://docs.google.com/spreadsheets/d/1B56Rf_LvXx-meBDrk8Ouz18uwHCEATHpdCwLgS3qPnQ/pubhtml/sheet?headers=false&gid=2106886376&range=A1:C2" width="400" height="120"></iframe>
And below is the result: