As a creative entrepreneur, you know how important it is to grow your email list. About a year ago, I decided to take the whole growing-my-list-thing seriously, and I’m so glad I did. My list continues to grow every day, and the biggest reason why is because I have Interact Quizzes in place that engage with my website viewers.
If you would like to know more about Interact Quizzes and how it can grow your email list, then head over to my previously written blog post: How to Skyrocket Your Email List With An Interact Quiz.
There are two ways to host your Interact Quiz on a Showit website. The first way is the easier, less fancy option. Simply create a button, select the text/button background/etc. and create a link using the ‘Click Actions’ tab in the right panel of your Showit dashboard. By pasting in your Quiz’s URL, users who select this button will be directed to a webpage (hosted through Interact) to start your Quiz.
However, there is a fun, easy way to embed your Interact Quiz and use it as an interactive option (pun absolutely intended) on your website. Embedding your Quiz will make your website look more high-end and user-friendly and will allow users to stay on your website longer (and who doesn’t like that for SEO purposes?!).
There isn’t a right or wrong way to do this. I personally use it both ways, and I think it’s just dependant on how you would like your quiz to functionally work or look on your website.
First, create your Interact Quiz. If you want to understand the importance of creating a Quiz to grow your email list or need help creating your Quiz, refer to this blog post.
Once you’ve created and published your Quiz, it’s time to share it with the world! Simply select the ‘Share & Embed’ button.
There are many ways to share your Quiz, but to embed your Quiz on your Showit Website, you need to select the ‘Embed’ option.
You may have to play around with the embed options to get the sizing and look of your quiz the way that you would prefer it. I tend to keep the options as-is except I prefer to have the Quiz open on a new tab on mobile devices for user-friendliness.
You can create a page dedicated to your Quiz and have it act as a landing page. You could also use it on any page and have a canvas dedicated specifically to your quiz and embed it there. But first, design the canvas to your specifications.
After your canvas has been created and designed to your liking, select the ‘Embed Code’ option in the bottom panel of your Showit dashboard. A black placeholder box will appear. Just like a photo, you can alter the sizing of this box to best fit your canvas’ design.
Of course, I encourage you to preview your website with the Quiz to make sure everything is functioning properly, and then hit the ‘Publish’ button and start sharing your Quiz with your website viewers!
Sometimes it’s necessary to have your quiz hidden until a user is ready to take the quiz. Doing this can help with page clutter and provide a more streamlined, clean design to your website’s page. And in this case, you will need to create a button that directs to your quiz and have your Quiz act as a pop-up. Follow these steps to create a pop-up for your Quiz.
Follow the above directions, and create a canvas with your Quiz that will act as your pop-up. I have created my canvas to be located at the very bottom of the page so it doesn’t distract me while I view or design the page. While designing, don’t forget to create some type of “close” option so users can exit out of the pop-up (I typically use the X icon from Showit). Once you have finished creating this canvas, you want to set the “close” click action. You do this by selecting the “close” element and going to your right panel. Under the ‘Click Actions’ tab, select the ‘+’ icon. Then make sure the following functions are Type: Hide Canvas and Canvas: This Canvas.
While designing, don’t forget to create some type of “close” option so users can exit out of the pop-up (I typically use the X icon from Showit). Once you have finished creating this canvas, you want to set the “close” click action. You do this by selecting the “close” element (i.e. X icon) and going to your right panel. Under the ‘Click Actions’ tab, select the ‘+’ icon. Then make sure the following functions are Type: Hide Canvas and Canvas: This Canvas.
Next, make sure this canvas is selected and head over to your right panel again. Under the ‘Canvas’ tab, make sure the ‘Hidden To Start’ box is checked. Doing this will hide your canvas until it has been triggered to pop-up.
You will want to create some kind of link option that will direct viewers to your Interact Quiz. I have personally created a button with text and an arrow icon, but you could use just text or a photo. Just make it clear that the element(s) can be selected, and that it will lead them to your quiz. To better understand, I have done this to my own website, as seen here.
Once your button or photo has been created, you want to set its click action. You can do this by selecting the element(s) (i.e. text/button background/etc.) and go to the right panel. Under the ‘Click Actions’ tab, select the ‘+’ icon, and make sure the following functions are Type: Show Canvas and Canvas: [Your Quiz’s Canvas Name].
And that’s it…everything is set for your Quiz to act as a pop-up! Again, I encourage you to preview your site to make sure all of the functions are working correctly. But once everything is perfect, hit publish on your website and start sharing your Quiz!
For further details or troubleshooting about pop-ups, refer to this helpful Showit Tutorial.
Do you have a Interact Quiz hosted on your website? Please paste the link below so I can see your quiz in action on your website and participate in the fun!
I’d love for you to take one of my Interact Quizzes and tell me what you learned from them!
I'm Abigail – designer, educator, encourager, and lover of grilled cheese sandwiches. Most days you can find me behind a computer serving creative women through refined, artful branding and website design. Pour a glass of your fav and grab your pretty notebook – here you'll find a wealth of valuable education intentionally crafted to serve you and your business. Cheers!