LogoLogo
  • Introduction
    • Quiz Kit - AI Powered Quizzes for Shopify Stores
    • What's new
      • Release notes
        • V9.2024 - September
        • V7.2024 - July 2024
        • V6.2024 - June 2024
        • V5.2024 - May 2024
  • Getting started
    • Installation
    • Pricing and plans
    • Onboarding guide
  • Navigating the Interface
  • Build and configure
    • Building a quiz
      • Collecting customer contact information
    • Styling and customizing your quiz
      • Applying custom CSS and JavaScript to your quizzes
    • Setting up quiz results
      • Results logic
        • Basic logic (default)
        • Single logic
        • Points logic
        • Product weight logic
        • Result weight logic
        • Combination logic
        • Creating logic jumps
      • Results template
    • Publishing your quiz
      • Publishing on page builder apps or headless setups
    • Integrations
      • Shopify
        • Shopify Subscriptions
        • Shopify Flow
        • Shopify Customers List
        • Shopify Checkout UI
        • Shopify Markets
      • Email and SMS
        • Klaviyo
        • Mailchimp
        • Omnisend
        • Attentive
        • ActiveCampaign
        • Sendlane
      • Subscriptions
        • Recharge
        • Smartrr
        • Skio
      • Marketing automation
        • Yotpo
        • PageFly
        • Zapier
  • Advanced Settings
    • Personalizing your quiz
      • Personalizing with user responses
    • Making your quiz full-width
  • Analytics and optimization
    • Email campaigns
      • Sending quiz results to customers by email
      • Sending quiz results to customers via Klaviyo
    • Quiz submission data
    • Analytics and tracking
      • Tracking setup
        • Facebook Pixel (Meta Pixel)
        • Google Analytics
        • Additional marketing data
      • Quiz analytics
        • URL redirect analytics
      • Dashboard and reporting
    • A/B testing your quiz
  • Account and settings
    • Quiz Kit interface
      • My Quizzes
      • A/B testing
      • Analytics
      • Submissions
      • Integrations
      • Billing
      • Support
    • Quiz Builder
      • Quiz
        • Introduction
        • Questions
        • Additional page types
      • Results
        • AI Auto Results
        • Results template
      • Publish
      • Styles
      • Settings
  • FAQs and support
    • Frequently asked questions
  • Contact us
Powered by GitBook
On this page
  • In this section:
  • Styling in the initial AI quiz setup
  • Styling in the quiz builder interface
  • Advanced settings
  • Custom CSS/JavaScript

Was this helpful?

  1. Build and configure

Styling and customizing your quiz

Style and customize your quiz's appearance and elements.

PreviousCollecting customer contact informationNextApplying custom CSS and JavaScript to your quizzes

Last updated 1 month ago

Was this helpful?

You can change the style and options of your quiz in Quiz Kit minimally, or in detail. You have different options for how you'd like to style and customize, from in-app presets to custom code.

In this section:

Styling in the initial AI quiz setup

If you build your quiz with the Quiz Kit AI tool, in the initial quiz setup flow you can choose from a selection of preset theme styles and options without any extra effort. Learn more about .

Styling in the quiz builder interface

If you want to adjust the look and feel of your quiz in more detail, then you can also use the Styles menu in the quiz builder. You can change typography, buttons, input fields, tool tips, and the progress bar.

You can also make customizations to the questions, answers, and results that you set up for your quiz. Learn more about


Advanced settings

In any quiz, you can adjust advanced settings. Advanced settings can help you customize certain features, such as , or . You can learn more about advanced settings in the , and in the Advanced settings section of the Help Center.


Custom CSS/JavaScript

Additionally, if you're knowledgeable about code, then you can also add your own custom JavaScript and CSS from within the quiz builder or in your theme editor. Learn more about

customizations in the initial quiz setup
styles in the quiz builder.
personalizing your quiz for customers
Frequently asked questions section
Styling in the initial AI quiz setup
Styling in the quiz builder interface
Advanced settings
Custom CSS/Javascript
adding a discount code to your quiz
applying custom CSS and JavaScript to your quizzes.