This guide will contain instructions and useful information on adding quizzes to a Shopify, or non-Shopify page.

Octane AI quizzes can be displayed in any environment that allows for HTML embedding. An example of this is any webpage on your Shopify store, but would not include HTML emails (emails don't allow for this type of code to run for security purposes).

Inside of a Shopify store, there are 2 main methods you can use to display a quiz:

The 1st method involves a few more steps, but gives you more control over how the quiz is displayed in the page you add it to.

Before you can add a quiz to a webpage, make sure you know where to get your quiz's embed code.

Adding a quiz through the theme editor is done by creating a page template, which can then be easily inserted into a new Shopify page.

📕 Creating a new page template

📕 Adding a quiz into a custom liquid block

Once the page template is created, you can add it to any page created for your store by selecting your quiz template.

Quizzes can also be added into a Shopify page directly, rather than through a page template.

This method has fewer steps, but also includes these limitations:

📕 Adding a quiz directly to a Shopify page

After your quiz page is created, that page becomes the URL for your quiz. Adding a link to the quiz page on your store's navigation menu is a great way to encourage general traffic & revenue to your quiz.

Adding a quiz through the theme editor (jump to section) is the easiest method, which only adds the page title if you add it to the template.

This guide includes more direct methods of removing the page title from a template by editing your theme code.

By default, quizzes will change in size with the browser & device screen sizes. This lets the quiz fit any kind of device or screen resolution.

You can use the custom height setting if you'd like the quiz to keep to a specific size across all devices & browsers.

Yes, quizzes can be displayed anywhere that HTML embeds are allowed. This includes any Shopify page, but can also include non-Shopify webpages.

Quizzes cannot be added to emails, as most email clients don't allow code to run inside of emails (in order to prevent malicious code from running).

If the quiz is added to a non-Shopify page, revenue tracking will no longer function for the quiz as tracking depends on cookies added to your Shopify store by Octane AI. If you'd like to add a quiz to a non-Shopify page, but have concerns about how viable it may be, contact our support team with your questions!

Having page body and full screen embed codes allows for variations of quiz placements. While the best placement for a quiz is usually the nav bar with a simple and clear CTA like "Take our quiz", there are multiple ways to use embed code to present an Octane AI quiz.

Page body embed code can be added to any page of the website. This means that you can just grab your code from the Publish tab of your quiz and paste it directly into the HTML content box of your blog post.
​

Having a simple quiz that offers just the right products with only one question answered is a super effective way to drive your customers directly to checkout. You can simply paste the embed code to the collection description filed using HTML box or using a page builder to add the quiz. This can also be achieved by editing the collection template in the theme code, but it will require coding knowledge.

Usually, having a quiz on product pages helps your customers to decide on the right product variant. In most cases, the quiz is added to a text button right under the variant selector.

Extremely popular shade finder quizzes can be built for each product category separately and used for promotions. Creating a quiz section on the website is super easy and an engaging experience for customers.
​

Adding a quiz that pops up when a button is clicked is a nice touch to any page of the website. However, creating this behavior will require adding additional code. Check this guide for more details: Triggering a Quiz Pop-up on Button Click
​