Skip to main content

Add a Quiz Popup to an Unbounce site

This article describes how to add a quiz as a pop-up to your Unbounce site.

Written by Damaris Pacheco

This guide walks you through embedding an Interact quiz as a pop-up on an Unbounce page.

You’ll be able to:

  • Add your quiz as a pop-up on a page

  • Control how and when the pop-up appears

  • Confirm the pop-up loads correctly on your live site

Before you start

Make sure you have the following:

  • An active Interact account

  • At least one created quiz in Interact

  • Your quiz is published in Interact

  • Access to edit your Unbounce page

💡 Note: If you don’t see the pop-up immediately after adding the code, publish your changes and check the live page URL (some custom scripts won’t run in the builder/preview).

Step 1. Get your Interact quiz pop-up code

  1. Log in to Interact.

  2. Locate the quiz you want to add as a pop-up.

  3. Click the Share & Embed tab.

  4. Click Pop-up on the left sidebar.

  5. Click the JavaScript tab.

  6. Toggle on Activate the quiz to promote.

❗ Important: You can have 1 quiz pop-up running at a time. If another quiz pop-up is already active, activating this one will replace it.

  1. (Optional) Configure your pop-up settings and any page rules if you want to limit where the pop-up appears.

  2. Click Copy Code.

❗ Important: Always copy the embed code from the quiz’s Share & Embed tab (not from the browser address bar URL).

Step 2. Add the Pop-Up code to Unbounce

You’ll paste your Interact pop-up code into Unbounce so it loads on the page(s) you want to display the quiz pop-up.

❗ Important: For pop-up embeds, place the script in the footer area (end of the page body) so it can load reliably after the page content.

Embedding the quiz as a pop-up on your Unbounce Landing page

  1. Log in to Unbounce.

  2. Open the landing page you want to add the quiz pop-up to, then click Edit to open the Classic Builder.

  3. In the builder, click Javascripts (bottom-left).

  4. Click Add New JavaScript.

  5. Set the placement to Before Body End Tag.

  6. Paste your Interact pop-up code into the script/code box.

  7. Click Done.

  8. Click Save in the Classic Builder.

💡 Note: Unbounce custom JavaScript may not run in the Classic Builder or Preview mode—check the published page to confirm the pop-up is loading.

Step 3. View the pop-up on your live page

  1. Save your changes in Unbounce.

  2. Publish your Unbounce page, then load the live page URL and confirm the pop-up is loading as expected.

💡 Tip: If you don’t see the pop-up while editing (or in preview), this is expected in many cases. Check the published/live version of the page.

Step 4. Test the embed

Confirm the pop-up works end-to-end on your Unbounce page.

  1. Load the page where you added the pop-up.

  2. Wait for the pop-up to appear (based on your timing settings), or trigger it using your configured rules.

  3. Take the quiz as a visitor would.

  4. If your quiz includes an opt-in form, submit the form to confirm it appears and can be completed.

⚠️ Warning: If you’re testing an opt-in form, use a real email you can access so you can verify follow-up emails (if you have them enabled).

Step 5. Publish your Unbounce changes

Unbounce changes won’t be visible to visitors until the page is published and publicly accessible.

  1. In Unbounce, click Publish for the page you updated.

  2. Confirm the page you embedded the pop-up on is accessible to visitors (not hidden, password-protected, or restricted).

❗ Important: If you add the pop-up code but don’t publish, the pop-up won’t appear for visitors.

FAQs

Why can’t I see the pop-up in the Unbounce editor?

  • Some embeds may not render while you’re editing (or in preview). Publish your changes and check the live page to confirm the pop-up is loading.

Do I need to update the pop-up code when I edit my quiz?

  • Usually, no. In most cases you can keep the same code, but you must publish your quiz in Interact for changes to appear on your embedded version.

How can I replace what quiz is shown in the pop-up?

  • If you want a different quiz to appear, swap the pop-up code (and activate the new quiz pop-up).

    1. In Interact, open the new quiz you want to promote.

    2. Go to Share & Embed → Pop-up → JavaScript and click Copy Code.

    3. In Unbounce, replace the existing code where you pasted it:

      • Classic Builder: Javascripts → update the script set to Before Body End Tag.

      • Smart Builder: Script Manager → open your custom script → replace the code → save.

Make a quiz in 2 minutes with AI

Try it free

Related Articles
Did this answer your question?