Adding a Quiz to Your Homepage

Placing a quiz on your homepage lets you engage visitors immediately and guide them toward the right products from the start of their shopping journey. It works well as a prominent section below the hero banner, or triggered as a popup from a call-to-action button.

Method 1: App Block (Recommended)

The app block is the easiest way to add a quiz inline on the homepage. No embed code or HTML editing required.

1. Go to Shopify Admin → Online Store → Themes

2. Click Customise next to your active theme

3. The theme editor opens on your homepage by default

4. In the left-hand panel, click Add section

5. Find and select the Quizify app block

6. In the block settings, enter your Quiz ID (found on the Publish page of your quiz editor — open the quiz editor and click the Publish tab)

7. Use the drag handle to move the section to the position on the homepage where you want the quiz to appear

8. Click Save

Method 2: Direct Link (Open as Popup from a Button)

If you want customers to trigger the quiz by clicking a homepage button — for example, a hero banner call-to-action — rather than seeing it inline, use the direct link method.

Set the button URL to:

#quizify-pop-YOUR_QUIZ_ID&size=fullsize

Replace YOUR_QUIZ_ID with the quiz ID from the Publish page of your quiz editor. You can also use medium or small instead of fullsize to change the popup size.

In the Shopify Theme Editor, find the button or call-to-action element on the homepage and set its link to the direct link above.

See: Opening a Quiz via a Link or Button

Positioning the Quiz Section on the Homepage

You can place the quiz section anywhere on the homepage — before or after any existing section. Common placements include:

• Below the hero banner — High visibility for all visitors who scroll past the main image

• As the hero section itself — If the quiz is the primary call to action for your store

• Mid-page — Between a featured collection and a promotional banner, for visitors who need more guidance before browsing

Drag the section in the theme editor to find the position that works best with your existing homepage layout.