Demonstration: Using Google Docs Form as your WordPress Contact Form

Demonstration: Using a Google Doc Form as your WordPress Contact Form

After having some recent trouble with wordpress contact form plug-ins and having to switch which plug-in I was using I became curious to know how other bloggers were handling their “contact” me information. I also run multiple blogs and would like to have the same “contact me” form if possible on all blogs for simplicity sake.

Chris Brogan who is a mega successful social media expert is a guy I often turn to find idea’s and I figure why not emulate someone who has great success. I noticed his blog used a Google Docs form for the contact me page and I really liked the idea, so decided to try it out.

I developed a full training video demonstration you can watch on how to create a form in Google Docs, set the form to send you email notifications, embed it in your wordpress page or post, and then test it and view it.

For those who don’t want to watch the video, here are the manual steps.

• Go to Google Docs and sign in with your Google account.
• Select “Create New” and choose Form
• Fill out your form fields (watch video demo if you need help)
• Set your form background/theme if you want to fancy it up a bit
• Set your form “response” showing the notification the user see’s when submitting
• Save the form
• Edit the form in spreadsheet mode (click on “Owned by Me” and then just left click on the form)
• Click on the Tools Menu (Notification Rules)
• Add a rule and check mark “A user submits a form” and “Email right away”
• Then save the rule.
• Now your gmail account will get an email whenever anyone fills out and submits the form so you can go check it out.
• Click on “Form (Embed form in a webpage)”
• Cut and paste the <iframe> code that looks like this:

<iframe src=”<FORM URL HERE>” width=”760″ height=”932″ frameborder=”0″ marginheight=”0″ marginwidth=”0″>Loading…</iframe>

• Put it inside a blog post or page, but you must be on the HTML Editor Tab (the Visual Editor Tab in wordpress will break the <iframe> so you must remain on the HTML Editor tab at all times when working with the iframe tag.
• Save the page or post.
• View in browser and test your form.

Hints, I recommend chopping the wording so that the form verbiage fits within your post, then add scrolling=”no” to the <iframe> tag so that you can remove the horizontal and vertical scroll bars. This makes the appearance a little more pleasing to the eye and you can easily size the “height” to cut out users from seeing the “Created with Google Docs” on the bottom.

---

Summary:

Google Docs is a great way to create a contact form inside your blog, this will easily tabulate everyone who ever contacts you for easy reference. You won’t have to keep track of emails anymore and you can update the form as needed and it will immediately reflect in your blogs. This also allows you to create a “template” form and easily put it in as many blogs as you want instead of having to create all the form fields and entries and settings manually on each blog plug-in.

If you enjoyed this demo and article, feel free to comment and let me know.

Update:

You can’t embed IFRAME code if your blog is hosted on wordpress.com according to a few users who have tested this.

-Dragon Blogger