Inline Quiz Section Block

The Gyde Section block embeds a quiz inline on any page of your Shopify 2.0 store — the quiz renders as part of the page content, not an overlay. Use it on homepages, collection pages, or dedicated quiz landing pages.

Requirements

Your theme must support Online Store 2.0 app blocks. Most themes released after 2021 do. If the block doesn't appear in the Theme Editor, see Theme Compatibility.

Add the block

1. In your Shopify admin, go to Online Store → Themes → Customize.
2. Navigate to the page where you want to add the quiz.
3. Click Add section in the left panel and search for Gyde Section.
4. Configure the settings (below) and click Save.

In the Theme Editor, a placeholder is shown while Quiz Handle is empty — the live quiz loads once a handle is saved.

Settings reference

Quiz Handle

The handle of the quiz to embed (e.g. skin-type-quiz). Required. Find it in the Gyde app at Quiz → Settings → Widget → Quiz handle.

Full width

When enabled, the embed stretches to fill the entire browser width — breaking out of the theme's content container. Useful for full-bleed quiz sections on the homepage.

Minimum width

Sets a minimum width in pixels. Set to 0 (default) to fill the container.

Full height

When enabled, the embed stretches to fill the full viewport height (100vh).

Minimum height

Sets the minimum height of the embed in pixels when Full height is off. Default: 600 px. Increase for longer quizzes so the iframe doesn't scroll internally.

Corner radius

Rounds the corners of the iframe (0–24 px). Default: 0 (square corners).

Positioning

Drag the Gyde Section card in the Theme Editor's left panel to reorder it between other sections. The block works on any page template — homepage, collection, product, or a custom /pages/ page.