How to embed a survey in a website
Organisations often want to embed a survey in a website. Embedding a survey can provide a less intrusive experience for respondents and also creates an overall impression of a professional and trustworthy service, increasing response rates. Here at Spark Chart we want our users to do what’s best for their situation. We’ve provided our users a quick tutorial on how to embed their surveys directly into their websites and applications.
Step 1: Create the survey to embed
Before you can embed a survey into your website you need to create it! Spark Chart provides many resources on how to make quality surveys, get the best response rates and avoid these common survey pitfalls in survey design. You can also download one of our survey templates from our Survey Template Library.
For the fully bespoke solution you will want to create your own survey. Either create your own survey from a blank canvas or edit one of the survey templates you downloaded from our template library. Fortunately Spark Chart provides some great tutorials on Creating Your Own Survey Templates and Tweaking Survey Templates To Your Save Time and Effort. We also provide consulting services to design and manage survey projects.
Step 2: Create A Group Link (a shareable survey link)
In Spark Chart a Group Link is a link that can be used to allow many people to complete a survey. To create your link, navigate to the Group Links menu in Project and select the “+ New Group Link” button. This is what we will use to get a link to embed into your website. Make sure that there is no limit to the number of times the link can be opened unless your specific case only warrants a certain number of responses. Decide if you would like to ask the user to register their name and email address or simply leave it open.
Step 3: Add the code to the website to embed survey
Generally what you will want to use is either an iframe, a container for a “website within a website”, or a pop-up to embed the survey into your website. This process is relatively simple for Content Management Systems such as WordPress. The process is slightly more involved for bespoke websites created without a CMS. The HTML Iframe code you will need to embed your survey in your website is relatively simple and short:
<iframe src='http://YOUR_SURVEY_URL'width='100%' height='900px' frameborder=1></iframe>
This code opens the Group Link on your page for others to sit. You can alter the width and height parameters to whatever values you wish. I have also added a border around the Iframe: you can turn it off by changing the frameborder value from a 1 to a 0. You will need to replace the URL with the Satellite Link that you copied to your clipboard earlier. Do this by pasting from your clipboard (CTRL+V or Command+V).
If you aren’t using a CMS then you need to access your source code for your website to insert the embed code. Most web hosting services have ample documentation on how to do that. For CMS users (such as Wix) there is usually a tab to change from a visual editor to a HTML editor. While editing the content of your page, switch from “Visual” to “Text” and insert the HTML code wherever you would like the survey to be located.
Alternatively, you can use the Satellite link in a website popup.
You can see examples of embeded surveys in the Use Cases page on the Spark Chart website.
Step 4: Review the embedded survey
Voilà! You have a professional looking survey embedded directly into your website.