User Guide
Everything you need to know to create beautiful, high-converting quizzes.
Getting Started
The St. Cupertino Quiz Generator lets you create beautiful, branded quizzes in minutes. Here's a quick overview of the 7-step process:
- Mode — Choose your quiz type and how results are calculated
- Content — Set your quiz title, description, and welcome screen
- Design — Customize colors, fonts, and styling
- Questions — Add your questions and answer options
- Results — Create result pages for each outcome
- Lead Capture — Optionally collect emails before showing results
- Generate — Get your embed code or host your quiz
Quiz Modes Explained
Simple Scoring
Each answer is assigned to a result. The result with the most matching answers wins. Perfect for personality quizzes like "What Type of Entrepreneur Are You?" or "Which Coffee Drink Matches Your Personality?"
Branching Paths
Each answer leads directly to a specific result, regardless of other answers. Great for recommendation quizzes, assessments, or diagnostic tools where the path matters more than accumulating points.
Results Display
- Built-in Results — Results display inside the quiz. Simpler setup. Required for Wix and some platforms.
- Redirect to Pages — Quiz takers are sent to your own result pages. You control the full experience and can track conversions.
Building Your Quiz
Questions
Add as many questions as you need. For each question:
- Write clear, engaging question text
- Add 2-6 answer options
- Assign each answer to a result (Simple Scoring) or set where it leads (Branching)
Results
Create compelling result pages that:
- Have a catchy title that makes people want to share
- Include a description that resonates with that personality type
- Optionally add a call-to-action button linking to your offer
Styling & Design
Style Presets
Choose from 24 professionally designed presets across categories:
- Modern & Clean — Minimal, sophisticated designs
- Get Weird With It — Fun, playful themes (changes monthly!)
Custom Styling
Fine-tune every aspect:
- Background, text, and accent colors
- Button styles and border radius
- Font families for headings and body text
- Progress indicator style (bar, dots, or numbers)
- Answer selection style (highlight, checkboxes, or buttons)
Theme Modes
The builder includes three visual themes. Click the theme toggle in the sidebar to switch:
- Light Mode — Clean, professional look
- Dark Mode — Easy on the eyes for night owls
- Get Weird — A rotating fun theme (currently Lisa Frank 90s!)
AI Quiz Generation
Let AI create your entire quiz in seconds:
- Click AI Generate in the sidebar
- Describe your quiz topic and audience
- Choose the number of questions and results
- Click Generate and watch the magic happen
Lead Capture Setup
Collect emails before showing results to build your list:
- Go to Step 6: Lead Capture
- Toggle "Require Form Submission" on
- Choose your form type:
- Built-in Form — Simple name/email capture
- Embed Code — Paste your Mailchimp, ConvertKit, or other form embed
- Customize the form page title and subtitle
Embedding Your Quiz
Standard Embed
Works on most platforms (Squarespace, WordPress, Showit, etc.):
- Go to Step 7: Generate
- Copy the HTML code
- Paste into your website's HTML/embed block
Wix & Restricted Platforms
Some platforms block JavaScript. Use our hosted solution instead:
- Click "Host My Quiz" in the Generate step
- Publish your quiz to get a hosted URL
- Use an iframe embed or link directly to the hosted quiz
<iframe src="https://quizgenerator.marymilagros.com/q/YOUR-QUIZ-ID"
width="100%" height="600" frameborder="0"></iframe>
Quiz Hosting
Host up to 10 quizzes on our servers (paid accounts only):
- Build your quiz
- Click "Host My Quiz" in Step 7
- Give it a name and click Publish
- Get your shareable link and embed codes
Managing Hosted Quizzes
Click "Hosted Quizzes" in the sidebar to:
- View all your hosted quizzes
- Copy embed codes
- Update or unpublish quizzes
Troubleshooting
Quiz not displaying?
- Check that JavaScript is enabled on your site
- For Wix, use the hosted/iframe method instead
- Make sure the embed code is in an HTML block, not a text block
Styling looks different on my site?
Your site's CSS might be conflicting. Try:
- Using the iframe embed method for isolation
- Adding the quiz to a page with minimal custom CSS
Lost your work?
Quizzes auto-save to your browser. If you cleared your browser data, check "My Quizzes" in the sidebar — previously saved quizzes appear there.
Need more help?
Email us at contact@marymilagros.com and we'll get back to you within 24 hours.