Articles on: Embedding and Sharing

How to Embed Your Quiz in Shopify Using Custom Liquid

Introduction


Embedding your Quizell quiz using Custom Liquid in Shopify gives you full flexibility to integrate your quiz seamlessly into your store. This method allows you to:


  • Add scripts and custom HTML
  • Edit Liquid code for advanced control
  • Apply custom CSS for a perfect visual match


Follow this guide to embed and customize your Quizell quiz in Shopify using the Custom Liquid method.


Step-by-Step Guide


Step 1: Access Your Shopify Theme Settings


  1. Log in to your Shopify account.
  2. In the left-hand menu, go to Online Store → Themes.



  1. Select the theme where you want to embed your quiz and click Customize.



  1. In the theme editor, use the dropdown at the top to select the page where you’d like the quiz to appear.



  1. From the left-side panel, click Add section, then search for Custom Liquid.



  1. Click to add the Custom Liquid section.
  • You’ll see two boxes on the right — one for your Liquid/HTML code and another for Custom CSS.



Step 2: Get Your Quiz Embed Code from Quizell


  1. In your Quizell dashboard, open the quiz you want to embed.



  1. At the top-right of your screen, click Share.



  1. Under the Embed on a Webpage tab, choose your preferred display type:


  • Full Page – The quiz takes over the entire page (best for dedicated quiz pages).
  • In Page – Embeds the quiz directly within an existing page section.
  • Popup – Opens the quiz in a modal when triggered by user action.
  • Greet Bar – A small banner at the top or bottom of your site with a CTA to open the quiz.
  • Floating Button – A clickable button that launches the quiz anytime.


  1. Customize the display settings if needed.
  2. Click Copy Code to copy the generated HTML embed snippet.



Step 3: Embed the Quiz Code in Shopify


  1. Go back to your Shopify theme editor.
  2. In the Custom Liquid section, paste the Quizell embed code you copied.



  1. (Optional) Add Custom CSS in the second box to adjust styling and layout so the quiz matches your store’s branding.
  2. Click Save to apply your changes.



🎉 That’s it!


Your Quizell quiz is now embedded in your Shopify store using Custom Liquid. You now have complete control to style, position, and integrate the quiz in a way that enhances your store’s user experience.


What’s Next?


Explore more ways to customize and promote your quiz:



Updated on: 09/10/2025

Was this article helpful?

Share your feedback

Cancel

Thank you!