QuizzBuilder Markup Language

Selo pequeno (emoji + texto curto), geralmente logo acima de um [heading]. Sem {cor} definida, usa a cor de destaque do tema automaticamente.

[badge] 📦 Fralda parada é só um dos sinais
{alinhamento: centro}
+[heading] Seu estoque pode estar travando o lucro
{tamanho: h1, alinhamento: centro}

Texto de destaque: título, subtítulo ou parágrafo.

[heading] Bem-vindo ao quiz!
{tamanho: h1, alinhamento: centro}

Tela de entrada ou resultado com título, subtítulo e botão. O botão pode avançar para o próximo step, abrir WhatsApp ou redirecionar para uma URL.

[cta]
titulo: Descubra seu perfil!
subtitulo: Responda 5 perguntas rápidas
botao: Começar agora

// CTA com WhatsApp:
[cta]
titulo: Quer falar com um especialista?
subtitulo: Clique abaixo para entrar em contato
botao: Falar no WhatsApp
{acao: whatsapp, numero: 5511999999999, mensagem: Olá! Vim do quiz.}

// CTA com URL:
[cta]
titulo: Oferta exclusiva para você!
botao: Ver oferta
{acao: url, url: https://seusite.com/oferta}

Pergunta de múltipla escolha. Suporta seleção múltipla, imagens por opção (pipe |) e ramificações (-> #id).

// Escolha simples (múltipla seleção):
[escolha] Quais são seus maiores desafios?
- Falta de tempo
- Falta de dinheiro
- Falta de conhecimento
{multi: 3, layout: grade}

// Escolha COM IMAGEM por opção:
// Adicione | URL após o texto de cada opção
[escolha] Qual perfil é o seu?
{imagens: sim}
- Iniciante | https://url.com/iniciante.jpg
- Intermediário | https://url.com/inter.jpg
- Avançado | https://url.com/avancado.jpg

Cada opção pode levar a um step diferente usando -> #id.

[escolha] Qual seu nível?
- Iniciante -> #nivel-basico
- Avançado -> #nivel-avancado

#nivel-basico
[heading] Ótimo começo!

#nivel-avancado
[heading] Você já é expert!

Pilha de botões onde cada um só abre uma URL em nova aba — sem avançar step, sem coletar resposta. Diferente de [escolha], que sempre serve pra ramificar/coletar uma resposta. Ideal pra usar o quiz inteiro como página de links.

[links] Meus links
- Meu site | https://meusite.com
- Instagram | https://instagram.com/meuperfil
- Meu canal no YouTube | https://youtube.com/@meucanal
{layout: grade, seta: nao}

Campo de resposta curta (uma linha) por padrão. Com {tipo: longa}, vira uma área de texto (múltiplas linhas). Com {obrigatorio: sim}, o botão Continuar fica bloqueado até a pergunta ser respondida.

[pergunta] Qual é o nome da sua empresa?
{placeholder: Ex: Minha Empresa Ltda}

// resposta longa e obrigatória:
[pergunta] Descreva seu maior desafio hoje
{tipo: longa, placeholder: Escreva com detalhes, obrigatorio: sim}

Texto livre — parágrafo de apoio, sem pergunta e sem coletar resposta. Diferente de [heading] (pensado para títulos grandes), pensado para corpo de texto com mais controle de tamanho, peso e cor.

[paragrafo] Este é um texto de apoio para dar mais contexto antes da próxima pergunta.
{tamanho: grande, peso: semi}

Escala de Net Promoter Score de 0 a 10.

[nps] De 0 a 10, como você avalia seu negócio?
{min: Péssimo, max: Excelente}

Escala de avaliação com estrelas, corações ou números.

[avaliacao] Como você avalia este produto?
{escala: 5, icone: estrelas, min: Ruim, max: Ótimo}

Formulário de captura de dados. Campos aceitos: nome, email, whatsapp, cpf, cnpj, estado, cidade, personalizado.

[lead] Preencha seus dados:
- nome: Seu nome completo {obrigatorio}
- email: Seu melhor e-mail {obrigatorio}
- whatsapp: WhatsApp com DDD
{botao: Quero meu resultado}

Tela animada de loading com mensagens sequenciais.

[carregamento] Analisando suas respostas...
- Processando seu perfil
- Calculando resultados
- Preparando diagnóstico
{duracao: 3s}

Cards de diagnóstico com emoji, título e descrição.

[insights] Seu diagnóstico:
- 🎯 | Foco | Você tem clareza de onde quer chegar
- 💡 | Oportunidade | Há margem para crescer em vendas

Lista de depoimentos de clientes.

[depoimentos]
- Maria Silva | CEO da Empresa | Esse quiz mudou minha visão!
- João Costa | Consultor | Resultado incrível e preciso.

Sequência de imagens com título e subtítulo opcionais. Com {estilo: marquee}, {autoplay: nao} pausa o movimento e vira navegação manual (arrastar ou clicar nas bolinhas); {direcao} controla o sentido do movimento contínuo. {ajuste: conter} mostra a imagem inteira em vez de cortar as bordas — use pra logos de marca. {estilo: banner} quebra a coluna do quiz e ocupa a tela inteira de ponta a ponta, como um banner de e-commerce; combine com {proporcao: 21/9} pra um banner baixo e largo.

[carrossel]
{proporcao: 16/9, autoplay: sim}
- https://url.com/img1.jpg | Título | Subtítulo
- https://url.com/img2.jpg

// faixa de logos, sem cortar as bordas:
[carrossel]
{estilo: marquee, proporcao: 1/1, ajuste: conter}
- https://url.com/logo1.png
- https://url.com/logo2.png

// banner cheio, de ponta a ponta da tela:
[carrossel]
{estilo: banner, proporcao: 21/9}
- https://url.com/banner1.jpg
- https://url.com/banner2.jpg

Exibe uma imagem com controle de tamanho e formato.

[imagem] https://url.com/foto.jpg
{tamanho: medio, formato: arredondado, alinhamento: centro}

Incorpora um vídeo do YouTube ou Vimeo.

[video] https://youtube.com/embed/SEU_ID
{proporcao: 16/9, controles: sim, autoplay: nao}

Card de preço com badge, nome do plano, preço (com riscado opcional), lista de itens incluídos/excluídos e botão de ação. Com {acao: stripe} ou {acao: upay-pix}, cobra direto dentro do quiz (cartão ou PIX) — exige a respectiva integração conectada em Conta → Integrações, e para o PIX, um bloco [lead] com CPF/CNPJ já respondido antes deste step.

[preco]
titulo: Plano Pro
subtitulo: Tudo que você precisa para crescer
preco: R$ 97
original: R$ 197
label: /mês
botao: Quero agora
badge: Mais popular
{acao: whatsapp, numero: 5511999999999, mensagem: Quero o plano!}
- ✅ Acesso completo ao conteúdo
- ✅ Suporte prioritário
- ✅ Certificado de conclusão
- ❌ Mentoria individual

// cobrando direto no quiz:
[preco]
titulo: Acesso Imediato
preco: R$ 197
botao: Comprar agora
{acao: stripe, valor: 197.00}

[preco]
titulo: Acesso Imediato via PIX
preco: R$ 97
botao: Pagar com PIX
{acao: upay-pix, valor: 97.00}

Lista de argumentos de venda com emoji, título e descrição. Ideal antes de um CTA ou checkout para reforçar benefícios.

[argumentos] Por que nos escolher?
{layout: lado-a-lado}
- ✅ | Resultado comprovado | Centenas de clientes transformados
- ⚡ | Rápido e simples | Veja resultados em dias
- 🔒 | Garantia total | 7 dias ou reembolso

Accordion de perguntas e respostas. Quebra objeções antes do checkout. O respondente clica para expandir cada resposta.

[faq] Perguntas frequentes
- Como funciona? | Você responde e recebe um diagnóstico personalizado.
- Quanto tempo leva? | Apenas alguns minutos pelo celular.
- É gratuito? | Sim, completamente gratuito.

Gráfico de barras horizontais ou rosca (donut) com legenda colorida. Ideal para exibir resultados, pontuações ou distribuição de respostas ao final do quiz.

// Barras:
[grafico]
titulo: Resultado por área
{tipo: barras, unidade: %}
- Marketing | 85
- Vendas | 72
- Operações | 58
- Financeiro | 91

// Rosca com cores:
[grafico]
titulo: Distribuição
{tipo: rosca, unidade: %}
- Iniciante | 35 | #10b981
- Intermediário | 45 | #f59e0b
- Avançado | 20 | #6366f1

Contagem regressiva fixa no topo ou rodapé da tela, personalizável em cor. Diferente dos outros blocos, não empilha no fluxo do step — fica grudada na tela. A contagem começa quando a pessoa entra no quiz (não é um horário fixo) e não reinicia ao trocar de step.

[timer] Oferta expira em:
{minutos: 10, posicao: topo, escopo: funil}

// com dias, pra ofertas mais longas:
[timer] Promoção acaba em:
{dias: 3, minutos: 0, posicao: topo, escopo: funil}

Faixa fixa no topo ou rodapé, no mesmo estilo do [timer] — cicla por uma lista de ofertas curtas, cada uma opcionalmente clicável (abre uma URL em nova aba). Não empilha no fluxo do step.

[faixa]
- Compre via PIX e tenha 5% de desconto!
- Frete grátis para todo o Brasil
{posicao: topo, intervalo: 4, escopo: funil}

Popup fixo simulando 'X pessoas fazendo algo agora' — aparece, some e reaparece com um número novo em intervalos. Não empilha no fluxo do step. Com {usar-nomes: sim}, cicla por uma lista de nomes reais em vez de uma contagem — formato tipo '{nome} acabou de comprar {produto}'.

[prova-social] {n} pessoas estão respondendo esse quiz agora
{min: 8, max: 34, posicao: inferior-esquerda, intervalo: 6}

// formato com nomes reais:
[prova-social] {nome} acabou de comprar {produto}
{usar-nomes: sim, nomes: João Neto | Ana Paula | Carlos Eduardo, produto: Bio Extratus}

Slider interativo de comparação entre duas imagens. O respondente arrasta para revelar antes e depois. Ideal para mostrar transformações, resultados ou comparativos visuais.

[antes-depois]
titulo: Veja a transformação
antes: https://url.com/before.jpg
depois: https://url.com/after.jpg
label-antes: Antes
label-depois: Depois

Botão que redireciona para o checkout de uma plataforma externa (Hotmart, Kiwify, Eduzz, Monetizze) — nunca cobra dentro do próprio quiz. Para cobrar aqui dentro (cartão ou PIX), use [preco] com {acao: stripe} ou {acao: upay-pix}.

[checkout]
titulo: Oferta especial para você
subtitulo: Apenas hoje
botao: Garantir minha vaga
{plataforma: hotmart, url: https://checkout.hotmart.com/...}