Google form surveys are a great way to collect customer feedback data. However, if you use them “straight out of the box” the link provided by Google gives you a stand-alone survey that doesn’t look very nice.
What would be really nice would be to be able to drop the survey into your website and have it take on the same look and feel. It’s easier than you might think.
There are three different ways you can embed the form on your site. Progressing from simple but still looking like a Google form to more complex but fitting in completely with your website.
The most simple and easy way to embed the form into your website is to just use the Google embed feature.
Starting at the editing page of the form simply select from the top right hand side of the page. Then use the Embed button. You will be presented with a line of HTML code that you can copy and paste into your website.
Where ever you place this code on the form will then be presented on your web page with the rest of your website frame around it. This is better but it is still not great because it still has the Google default look and feel as well as the Google disclaimers.
If you have WordPress
The options are considerably better if you have a WordPress based website as there are a number of plugins that enhance the look and feel of the Google form and help to embed it into your site.
The most popular (by number of downloads) plugin for this task is WordPress Google Form. With this plugin you can not only embed the form into your website but also alter the default look and feel and change several of the characteristics of the form.
You can for instance turn off the Google legal disclaimer, track form submissions in WordPress, easily redirect the user to a page of your choosing when they submit the form.
In short you can make the form do pretty much all you need to make it blend in perfectly with your site.
You may still have to do a little bit of work with CSS to get some of the form elements to behave exactly how you’d like. But in general the form will be up and running in just a few minutes.
Here is how the same form looks like using the standard features of the Google Forms plugin. Because it uses the same CSS as the rest of the site it fits in perfectly.
Users will not even know that it is a Google form and will think it is just part of your normal website, which it is.
If you don’t have WordPress and you want to have the form look and feel the same as the rest of your website you will need to know a lot more about CSS to really make it fit in.
It is however, very doable. You simply need to use the simple embedding approach noted above and then create a series of CSS rules to force the Google Form to look the same as the rest of your site.
Setting up those rules is beyond the scope of this post but if you search for “CSS tutorial” or ask your friendly web designer, they should be able to sort it out for you.
So there you have it – one simple step to dropping your Google Survey Form into your website. Do you have any questions about this approach? Just ask below.