Dave Taylor

How To Add Surveys To Your Site

By: Dave Taylor
May 26th, 2009

Giving out a link to take a survey is pretty easy, but I think it would be much easier if I could just put a survey directly it into my website. So my questions is, how do I put a survey into my website without having to send out a link?

Dave's Answer:

[I am good friends with the folk at SurveyGizmo.com. In fact, we used to share an office suite! When I saw this question arise, I asked them if they'd be willing to answer it, and I'm glad to have received the following terrific response from Brittany Heidtke on the team.]

It's actually pretty simple to build a survey online and there are a variety of survey tools to choose from. SurveyGizmo is one of the few tools that allows you to drop a multipage survey or form directly into a web page. We call this technique embedding, and give you three ways you can embed using a JavaScript snippet, an iFrame or the static HTML.

The JavaScript is the simplest method and is similar to how YouTube embeds videos that they host, iFrames are handy if you need to avoid JavaScript and the static HTML might be appropriate for very high traffic page.

To get started, you'll want to create a free account at SurveyGizmo.com and click "Create Survey" to get started. You can use one of the pre-made templates, or start with a blank survey.

You'll start adding questions to the Question Editor page, which looks like this:

survey gizmo edit survey question editor

You can add as many questions as you need, as well as insert more advanced features like email auto-responders or conditional question logic. If you do plan on embedding the survey in your website one gotcha to look out for is under the Look & Feel tab. You'll want to set the survey theme to the "Embeddable Theme" which will strip out most of the formatting and let the survey appear more seamless in your web page.

When you're done with Look & Feel, go over to the Publish tab and Click the "Launch Your Survey Now" button:

survey gizmo publish design mode

Once you do this, you are given a variety of link options to hand out to survey takers, and if you scroll down a little bit you'll see the three embedding options.

The first, and easiest method is the JavaScript embed. It will dynamically resize your web page to fit your survey. It looks something like this:

survey gizmo advanced published embedded surveys

It also gives you two other embed options, the iFrame, as well as the HTML for the first page of the survey (this is ideal for embedding surveys into sites like MySpace).

Decide which code option you are going to use, and then copy and paste it into a page on your website. Below is what the copy and pasted JavaScript code looks like on a WordPress page. If you are using WordPress or another CMS with a rich text editor be sure to turn that off on your preferences page before attempting this. The rich text editor (even using the Source tab) just destroys the Javascript with lines breaks. If you are using your own HTML pages you can paste in the embed code and FTP your file back up.

survey gizmo example survey code

VoilĂ  you're done! It's pretty easy to embed a survey into a website, where ever you need it.

If you are using the JavaScript or iFrame methods you can edit your survey in SurveyGizmo and don't need to change anything on your web page. You will need to clear your cache or restart your browser to see new changes but that will not affect your visitors.


About the Author: Dave Taylor has been involved with the Internet since 1980 and is internationally known as an expert on both business and technology issues. Holder of an MSEd and MBA, author of twenty books and founder of four startups, he also runs a strategic marketing company and consults with firms seeking the best approach to working with weblogs and social networks. Dave is an award-winning speaker and frequent guest on radio and podcast programs. AskDaveTaylor.com http://www.intuitive.com/blog/