Tuesday, April 22, 2008

Embedding Google Forms in Wikispaces

OK, this is a pretty specific topic, but I may not be the only one who's wanted to figure this out.

(I wish Google would make their cool logo for Google Docs available, as it would have spiced up this post. Oh well. See it here: http://googledocs.blogspot.com/.)

Here's the scenario: I'm helping Vicki Davis and Julie Lindsay set up a workshop this summer to teach their "Flat Classrooms" program to other educators. I'd set up the website as a Wikispaces wiki, with a custom domain. I wanted to use Google Spreadsheets new form capability (very sweet) for registrations--that way Julie and Vicki and I could all see the registrations as they came in. The trouble was, even though you can easily find good information on how to set up a form and collect information, and then even how to embed a form using the HTML "inline" function into another webpage--it wasn't working in Wikispaces. Using the aforementioned methods to add code in the "Other HTML" option from the "Embed Widget" button, I was getting a "404 Page not found" error.

So I read around and something clued me into the fact that when you set up a form in Google Spreadsheets, you can have the form emailed to you. In Gmail I went to the "show original" option while in the actual email that I received, and I could see the web-page code that had been generated to show the form in the email--which was regular code for an HTML submit form, and not an inline link to the form page. Well, that may be Greek to you or not, but all you need to know is that if you go down to the part of the original email that starts with the left triangle bracket before "form action="http://spreadsheets.google.com/formResponse?key=..." and you highlight through "/form" finishing with the right triangle bracket (which is almost at the end). You can now paste that code into "Other HTML" from the "Embed Widget" function, and your form will appear (and work!) on Wikispaces.

What I actually did after I discovered this would work is that I pasted the code into a text document, and then added additional "breaks" to make it look a little nicer before pasting into Wikispaces. But that's for nit-pickers... :)

8 comments:

Jeanne said...

Great info, Steve. Will try this at work tomorrow. Will the same steps allow one to include a form in iWeb? I'll try and see.

Jason Levy said...

Hi Steve,
Thanks for the tip. I'm also experimenting with Google forms. Wondering if you might be able to post or email a screen shot of the form embedded in the wiki? Not quite sure I can picture what it looks like.

Thanks
Jason

Steve Hargadon said...

Jason:

You can just go to the registration page at http://www.flatclassrooms.com/Registration

Don't register, though! :)

Steve

Jason Levy said...

Thanks Steve! My school will definitely use this function.
Jason

Mark Wagner said...

Thanks for the post, Steve. I figured it might work for other services, too, so I tried it out and discovered it also works well for Google Maps and Google Earth. Cool.

-Mark

Mark Wagner said...

Actually, it seems it doesn't work in Earth... only in Maps. Bummer.

Susant said...

Thanks Steve,
Played about with the html and added the form to a Ning sidebar.

MoleMoli said...

Is there a way to not end up in that "thank you" page & leave the user the opportunity to let's say...load another entry?...I know I might be asking too much...but hey...it's google...