Help / How to embed your quiz

Embedding a quiz to enhance the experience for your learners

Show your quizzes on your website or blog using our simple embed code. You can also style the quiz to make it appear integrated and part of your site's design.

With FlexiQuiz, you can embed a quiz using a quiz link, a Respondent portal login, or with access codes.


Using a quiz link to embed your learning materials - new 2025 publish screen

By embedding a quiz with a unique link, anyone with access to the page on your site can view the test. You can add a registration page at the start of your quiz to capture learner data.

  1. To start, create a quiz or select one you want to embed on your site.
  2. Next, click on the Publish tab.
  3. Then click Publish to open your quiz. By opening your quiz you can check how it looks on your website.
  4. Publish quiz page with all ways to share your quiz. There is a box for embedding the quiz.
  5. Click on the Embed box to access your embed code options.
  6. Embed quiz code and formatting options
  7. Now choose how you want the quiz to look on your site. Your options are:
  8. Incline

    Full screen

    Popup centre

    Popup right

  9. Choose a size for the quiz to appear on your site.
  10. Click on the copy code button and paste the code on your website.
  11. Check how the quiz appears on your site. You can adjust the FlexiQuiz settings to ensure a professional look.


How to embed your test using a quiz link

  1. From your main dashboard, select the quiz you want to embed. Click on the quiz and go to the Publish screen.
  2. Make sure your quiz is Open.
  3. From the Distribution list, tick Quiz Link Flexiquiz publish page
  4. Copy and save your unique link that shows in the white box.

    You will use this URL in the src property of the following code so that people can view your quiz.

  5. Next, copy the following embed code:
        
    <iframe src="YOUR QUIZ URL HERE?i=t" style="min-width:100%;border-width:0;height:500px;overflow:scroll;"></iframe>
        
    
  6. Replace the YOUR QUIZ HERE with the URL for your quiz
  7. 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.

  8. Open the HTML code editor of your website and paste the embed code with your quiz link.

Your embedded quiz will now appear on your website. Learners will see the first page set for your quiz, such as

registration, selling, text/media or the first question on your quiz.


How to embed Respondent portals

A Respondent portal allows your learners to manage all of their training in one place.

You can embed an unbranded Respondent log-in screen on your website or blog.

This image shows what an unbranded log-in screen looks like:

Unbranded FlexiQuiz log in screen

If you have an Enterprise plan, you can customize the Respondent portal by removing the FlexiQuiz logo and adding your own logo.

To embed the portal on your website, follow these steps:

  1. To start, copy the following HTML code.
  2.     
    <iframe src="https://www.flexiquiz.com/account/si?i=t" style="width:100%;min-height:1000px;border-width:0;"></iframe>
        
    
  3. Open the HTML code editor of your website and paste the Respondent portal embed code in the relevant place.

Other embed options

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

FlexiQuiz log in screen with virtual keyboard

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

    
<iframe src="https://www.flexiquiz.com/account/si?i=t&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?i=t&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?i=t&k=t&rp=t" style="width:100%;min-height:1000px;border-width:0;"></iframe>
    

Relevant help guides

Ways to style your quiz

How remove FlexiQuiz branding



Back