New: Auto-Resizing iframe Makes for Seamless Survey Embeds

Posted by

Krista Stevens

When you embed a survey directly into your website, you want it to look and act as though you hand-coded it from scratch, with love. With Polldaddy’s new auto-resizing iframe embed for surveys and quizzes, you can embed a survey into your website for a seamless user experience for your survey participants—even if the iframe’s height needs to change to account for varying page lengths and error messages. All you need to do is copy the code we supply and paste it into your website.

Let’s say you’ve already created a survey.

Now, you’re ready to embed the survey directly into your webpage. Hover over the title of your survey in your dashboard, and click on Share. On the Share pop-up, select Website Inline. Copy the auto-resizing iframe code and paste it into your site:

Look, Ma, no Scrollbars!

Typical iframe implementations are set at a fixed height. If, for example, an error message appears when a participant misses a question, the iframe’s contents become suddenly taller than the iframe, causing unsightly scrollbars to sprout, ruining your lovely design. Through the magic of JavaScript, our auto-resizing iframe embed takes error messages and the varying height of survey and quiz pages into account, presenting a survey free of scrollbars. Here’s a survey embedded via iframe:

In this second screenshot, the user forgot to answer the mandatory question, producing an error message. The auto-resizing iframe accounts for the error message’s added height, re-sizes the height of the iframe automatically and presents a seamless, scrollbar-free experience to your survey participants:

Nifty, no?

This post is over a year old and the content may be outdated.
Please visit our support docs for the most up to the date information.

One comment on “New: Auto-Resizing iframe Makes for Seamless Survey Embeds

  1. rejoice! - it's like the joy of aircon, you never appreciate it in a hot climate until it's off.
    Paul Gailey
%d bloggers like this: