Replace the bulky contact forms on your blog by Google Docs Form

contact_form_temp Most of us prefer to include a contact form in our blog to get the communication from the visitors or advertisers. Functioning of the form is to deliver the message into our mailbox, but the JavaScript used for this purpose takes so much time to get loaded. Reduce this time by using Google Docs Forms.

As we had already talked about Google Docs or other online documentation tools features, here we will learn the function called Forms in Google Docs. You can create a form (same as contact form) in Google Docs and include that in your blog.

Why should you go for Google Docs Form:

  1. No JavaScript required, even WordPress Plugins for Contact form also have JavaScript which gets invoked at the time of page loading.
  2. You can share the Google Docs spreadsheet where the comments or query asked thru the contact form will reside. From that you can distribute the work load of query resolutions.
  3. Reduce the page size by a good amount.

The process for attaching a Google Docs Form into a blog is very simple and will optimize your blog and reduce the load time as well. Below are the steps to be followed for the same,Google_docs_form1

  • Open a new form by clicking on “New” button on Google Docs Dashboard, Shown below
  • A new form will get open where you can add the fields as per your requirement. In below screenshot, I added two fields (Name and Email)

 

 

Below is the detailed image from the Google Docs form which will let you know everything about the same.

 

Google_Docs_form2

  • Once you complete the creation process for a form, Save the form. Now You can view the look of your form from the link provided at the bottom of the Google Docs (on the same page ).
  • Once you save the form, a new spreadsheet with the same name as your form will appear on the dashboard for your Google Docs. When viewers will fill the form, the spreadsheet will get updated with the details provided by the visitors.
  • I created the contact form in Google Docs for Internet Techies (this blog) and  got the request or comment from my visitor into the spreadsheet. Take a look on the contact form of Internet Techies which is in Google Docs, the spreadsheet will look like as below:

Google_Docs_form3

  • Now use <iframe> to embed the form in your blog or page. Get the code from the Google Docs Form itself. There is tab in the form document named “More Option” at the right side of the form. Get the option “Embed”, it will show you the piece of code which you need to put into your blog or page where you want the Contact Form to appear.

That’s it. No JavaScript, No bulky CSS. This will reduce the page load time and size by a good amount. I checked for my blog where initially I was using “Contact Form 7” for this purpose and now replaced that with Google Docs Form. After testing the page with “Pingdom”, I jumped from my place.  The changes in load time and size are mentioned below:

Load time and Size with Contact Form 7 (or alike forms) and with Google Docs Form are provided below,

pingdom_before_001

pingdom_after

It happened because this blog is now free of bulky JavaScript for Contact Form purpose. I hope you liked the above post and I encourage you to use Google Docs forms for your blog as well.

Sanjeev Mishra is a professional blogger and an Internet Marketing Consultant based in India. He has built the Internet Techies to provide you updates in technology and web application area.

4 Comments

  1. Pingback: Track the downtime of Google services thru Google Apps Status Dashboard | Internet Techies

  2. Pingback: Create dynamic forms using Zoho Creator Web Form Builder | Internet Techies

  3. Focokssom

    April 9, 2009 at 12:39 pm

    hmm… strange.

  4. Cloulfuct

    April 16, 2009 at 1:18 pm

    hmm. interesting..

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>