Overview
This guide will let you know how you can publish your quiz in a Shopify webpage.
This method can be generally applied to most methods that can accept and read HTML code.
What you'll learn
The different methods of adding a quiz to a Shopify page.
Prerequisites
A fresh Shopify page is recommended for the method in this guide.
The embed code can be used in any environment that accepts HTML code however.
Finding the quiz embed code
Open your quiz in the quiz editor.
Click on Save & publish in the top right.
Click on Shopify page.
Copy the text code provided for the "Page body" embed option.
The page body embed will be used for this guide, but a fullscreen option is available as well. The fullscreen quiz will cover the entire page that it's embedded in, so avoid using this option for any page with content besides the quiz.
Creating the page for a quiz
In Shopify's admin dashboard, go to Sales channels > Online Store > Pages.
Click on Add page.
Add a title for the page.
In the "Content" box, click on the "< >" icon to show an HTML content box instead.
Paste your quiz embed code in the HTML box.
Save your page.
Many Shopify themes will display the page title by default. Removing this will require editing the theme's page template.
The exact methods differ from theme to theme, but this guide provides a few examples of how to do this.
The page that contains your embedded quiz now doubles as the link to your quiz. Use this page to:
Link the quiz in your website navigation.
Link the quiz in ad traffic.
Present the quiz page in an on-brand way, such as linking a "shade finder" on a cosmetics store.
Frequently asked questions (FAQ)
What are the quiz height settings in a page embed used for? |
By default, the content area of a quiz flexes with any changes in the customer's browser window or device screen size.
You have the option of choosing between two modes:
|
Can I add the quiz somewhere besides a new Shopify page? |
Yes, the quiz can be embedded in most input areas that will accept and read HTML code.
This enables a lot of flexibility in where exactly a quiz can be added. |
How do I get rid of the page title? |
Many Shopify themes will display the page title by default. Removing this will require editing the theme's page template.
Typically, this involves deleting just a small block of code.
The exact methods differ from theme to theme, but this guide provides a few examples of how to do this. |