googlespreadsheets

Published on September 30th, 2009 | by Formstack

0

Using Google Spreadsheets to Embed Form Data on Your Website

A common request we get here at Formstack is for a way to embed form data on another website for anyone to see.  While we give you a Share URL that you can link to, embedding this URL doesn’t always work and it doesn’t give you the freedom to pick and choose which fields from your data you want to share with your site visitors.  This is where one of our integrations may come in handy.

Using our Google Spreadsheets integration, you can populate a Google Spreadsheet with data submitted via a Formstack form.  You can then share this spreadsheet by embedding it on your website.

googlespreadsheets

To embed a Google Spreadsheet on your website, browse to that spreadsheet and click on the Share button in the top left corner of the screen.  Choose “Publish to the web” and then “Start publishing”.  This will give you a link to your data that looks like this:

http://spreadsheets.google.com/pub?key=t3V7Z-Lu3KLQyRvtBUZOtpg&single=true&gid=0&output=html

To embed that page on your site, you would want to use an iframe.  Your iframe code would look something like this:

<iframe src =”http://spreadsheets.google.com/pub?key=t3V7Z-Lu3KLQyRvtBUZOtpg&single=true&gid=0&output=html” width=”300″ height=”150″></iframe>

And the spreadsheet on your site would look something like this:

This is just a basic example using an anonymous comment form, but this would definitely work with more complicated forms as well, allowing you to embed Formstack form data on your websites, blogs, Tumblr pages, etc.

Tags:

About the Author

These posts come from a collaboration of multiple team members! Everyone from marketing to development pitches in to share some insight on small business, online forms, data collection, and all things awesome.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Back to Top ↑