How to embed your quiz

With FlexiQuiz, you can embed your quiz into your website so that participants can take the test, purchase a quiz, and view results without ever leaving your website.

There is also the option to change color themes, text, and remove FlexiQuiz branding so that the quiz looks like it's part of your site. The customization options depend on your FlexiQuiz plan.

FlexiQuiz will provide some basic HTML code so that an iframe can be added to your website. If you have a Premium or Enterprise plan, we can also provide you with some embed code that is designed to be responsive to screen size.

This guide shows you how to add the iframe to the HTML code on your site when sharing a test using a quiz link or Respondent account.

How to embed your test using a quiz link

1. Log into your FlexiQuiz account and select the quiz that you would like to embed on your site.
2. Go to the Publish screen
3. Open the quiz quiz
4. From the Distribution list, tick Use Quiz Link
5. Copy and save the URL shown in the white box

   This URL will be used in the src property of the following code to link people directly to your quiz.

6. Copy and paste the following code into your site:

       
   <iframe src="YOUR QUIZ URL HERE?i=t" style="min-width:100%;border-width:0;height:500px;overflow:scroll;"></iframe>
       
   

7. Replace the src attribute with the URL for your quiz

Important! In the iframe src attribute keep the ?i=t code. This code will resize the test as the respondent navigates pages within the quiz.

Your quiz will now be embedded in your site.

Top tip! If you make changes to your test on flexiquiz.com, the updates will be automatically reflected on the quiz shown on your site.

How to embed your Respondent portal

If you've set up your respondents with individual accounts, you can embed an unbranded log in screen with a Respondent portal within your site. Respondents log in with a unique username and password to access their dashboard with assigned quizzes.

This is an example of the unbranded log in screen:

Enterprise members can remove the FlexiQuiz logo and add a custom logo using the customize Respondent portal options.

To embed an unbranded log in screen to use with Respondent portals, use this HTML code:

    
<iframe src="https://www.flexiquiz.com/Account/SI" style="width:100%;min-height:1000px;border-width:0;"></iframe>
    

You can add a virtual keyboard to the log in screen that looks like this:

The following parameters can be added to the src URL to add a virtual keyboard.

    
<iframe src="https://www.flexiquiz.com/Account/SI?k=t" style="width:100%;min-height:1000px;border-width:0;"></iframe>
    

To include a password reset, the following parameters can be added to the src URL.

    
<iframe src="https://www.flexiquiz.com/Account/SI?rp=t" style="width:100%;min-height:1000px;border-width:0;"></iframe>
    

To include a virtual keyboard and password reset, the following parameters can be added.

    
<iframe src="https://www.flexiquiz.com/Account/SI?k=t&rp=t" style="width:100%;min-height:1000px;border-width:0;"></iframe>
    

The Embed quiz option is available for Premium and Enterprise members only. If you have any further queries, please contact us.

Relevant help guides

Share a test with a quiz link

How to share quizzes with Respondent accounts

Customize Respondent portals

Back