Embedding Your Quiz Funnel

Join bluebarry's Discord Server

Free forever

Table of contents

Share this article:

Setting up your quiz funnel as a landing page is a powerful way to capture leads and engage visitors right on your website. Here’s exactly how to do it with bluebarry.

Decide Your Funnel Layout

Before embedding your quiz funnel, consider:

  • Should your quiz funnel fully take over the page, or just sit within part of it?
  • Do you want to show your standard navigation menu at the top, or hide it for fewer distractions?
  • Is a footer necessary, or would removing it focus attention on the funnel?

These choices impact both the look and effectiveness of your funnel on the landing page. The steps below guide you for either a partial or full-page embed.

Step 1: Choose the "Full Page" Display

For maximum impact and a frictionless experience, select the “Full page” layout for your quiz funnel.

1. Go to your quiz funnel in Bluebarry.
2. Navigate to the “Launch” settings.
3. Select “Full page” under display options.

full-page-display-type

Step 2: Get Your Quiz Embed Code

1. Open the “Publish” tab in your quiz funnel’s settings.
2. Click “Embedded” to reveal your code snippet.
3. Copy the provided embed code.

get-embed-code

Step 3: Embed on Your Webpage

Option A: Embed Within a Section

  • Add an HTML block (or HTML editor) wherever the quiz should appear on your page.
  • Paste the embed code.
  • The default width and height (`width=”100%” height=”100%” frameborder=”0″`) let the quiz automatically resize to fit its container.
  • You can adjust these settings if you want a fixed size or a different presentation.

Option B: Full-Page Quiz Funnel

  • Create a clean, dedicated landing page.
  • Insert only the quiz embed code into the HTML block for an uninterrupted funnel experience.
  • Hide any navigation menus or footers to focus all attention on the quiz.

Best Practices for high-converting Quiz Landing Pages

  • Use a Start Page: Don’t drop visitors straight into the quiz. Start with a brief, engaging introduction to explain the value and next steps.
  • Keep it Distraction-Free: For full-page funnels, remove navigation menus and footers unless they’re absolutely necessary.
  • Mobile Optimization: Verify the funnel is easy to use and smooth on all device types before publishing.
  • Clear Call-to-Action: Promptly guide visitors to begin the quiz and highlight what they’ll get by participating.
Need help?

If you can’t figure it out. We probably can. Just give us a headsup in Discord or email ([email protected]).