Skip to main content
All CollectionsBuilding Your SiteThird-Party Embeds
Add a Quiz to Your Site with Interact
Add a Quiz to Your Site with Interact

Create a unique and interactive quiz or questionnaire to add to your Showit site with Interact

Jeff Willems avatar
Written by Jeff Willems
Updated over a week ago

A quiz or questionnaire can be a powerful tool to garner new leads, gather information, or just to make your site more fun and interactive. Our friends over at Interact have made it incredibly simple and even fun to create a unique quiz and add it to your Showit design!

Getting Started

To get started, log in or create an account with Interact. Once you have done this, you will be prompted to design a new quiz or questionnaire.

Note: If you have already made and published a quiz, you can click Share & Embed to the right of your quiz and move on to the next step.

Select any categories that pertain to you and browse their templates, or start from scratch to design your Interact quiz.

Redirecting Your Results

For the best quizzing experience, we recommend redirecting your quiz results. This allows your different quiz results to send your quiz takers to different pages you have built to display results.

Add a new page to your Showit design for every quiz result.

Once you have built out a results page for each of your quiz results, you can take the custom URL for each of these pages and paste it into your Interact.

To do this, click to edit your quiz and select the Results tab in the left side panel. Then click on the Redirect Results option.

From this window, choose the Redirect All option and then add a Custom URL from each of your Showit quiz results pages for each of your your quiz results to re-direct to. Then choose to Save.

Prepare Your Quiz Canvas in Showit

If you haven't already, you'll need to prepare a place for your new quiz in your Showit design. You can follow the steps below to do so.

Create Two Canvas Views

Choose the canvas that you would like to add your quiz to and click on the three dots to the right of the canvas' name. Then in the drop down choose to Add Canvas View.

Drag and drop all of the elements into this first Canvas View. You can select all of the elements by holding shift and clicking on them.

Then add a second canvas view. This is where your quiz will reside.

Add & Resize Your Embed Widget

Once you have your first and second canvas views set up, you'll want to add an embed code widget to the second canvas view. Then resize the widget and place it where you would like your quiz to display.

Create a Button

Now that your views are set up and you have a place for your quiz, you'll want to create a "Take the Quiz" button that will take you from the first canvas view to the second canvas view.

Set a click action on a button in the first canvas view of your quiz canvas like this:

Link > Canvas > This Canvas > Next

Set Canvas Type

Lastly, make sure your quiz canvas has the Grow With Content Canvas Type.

Embed Your Quiz

Once you have designed your quiz and you have a spot for it in your design, you are ready to grab your quiz's HTML code and embed it in your Showit site.

Getting Your Embed Code

If you haven't already, you'll want to publish your quiz design within Interact in order to receive your embed code.

Once you have published your quiz, Click the option to Embed Code on the left side, then select Javascript and toggle the three options in the screenshot below. Then copy your code.

Note: The bottom option will only work if you have set redirects for your quiz results.

Paste Your Embed Code in Showit

Now, jump back into the Showit Design App and select the second canvas view that you have set up to contain the quiz.

Click on the embed code box, and in the right side Properties Panel under the Embed Info tab, click on the Custom Code box and paste your code. Then choose to Save.

Note: Your quiz might not show up in the Design App. You can test it in Preview.

Once the embed code is added your quiz will appear on the page, and you are ready to publish your design. And that's it! You now have a simple and beautiful new addition to your Showit site that will add a nice touch of interactivity!

Happy quizzing!

Did this answer your question?