Como personalizar o visual do checkout
Checkout — Editar visual
As abas Editar visual e Editar visual página de upsell abrem o editor visual da Wiapy, onde você personaliza com blocos:
- Editar visual → a página de pagamento (checkout);
- Editar visual página de upsell → a página de obrigado/upsell exibida após o pagamento.
Conhecendo o editor
O editor tem três áreas:
Área | O que faz |
|---|---|
Elementos (esquerda) | Blocos disponíveis para adicionar: Imagem, Texto, Banner, Vídeo (YouTube/Vimeo), Garantia, Depoimento, Botão WhatsApp, Cronômetro, Notificação (prova social), Espaçador, HTML livre e Popup Desconto |
Preview (centro) | A página como o cliente verá. Você edita o Cabeçalho (acima do formulário) e o Rodapé (abaixo); o formulário de pagamento em si é uma área não editável |
Propriedades (direita) | Ao clicar em um bloco no preview, aqui aparecem as opções dele (textos, cores, links, imagem etc.) |
E a barra superior:
- ← Voltar — retorna para a edição do checkout;
- Desfazer / Refazer — histórico de alterações (também pelos atalhos de teclado Ctrl/Cmd+Z);
- Ícones de viewport — alterna o preview entre desktop, tablet e celular;
- Preview — abre uma prévia da página montada;
- Salvar — publica as alterações.
Como usar
- Abra o checkout (Checkout → Meus checkouts → ✎) e clique em Editar visual.
- Clique em um elemento no painel esquerdo (ou no ＋ do cabeçalho/rodapé) para adicionar o bloco.
- Selecione o bloco no preview e ajuste as opções no painel Propriedades. Cada bloco também tem ações rápidas: remover, duplicar e mover para cima/baixo.
- Confira nos três tamanhos de tela e clique em Salvar.
Página de upsell/obrigado
O fluxo é o mesmo — clique em Editar visual página de upsell no menu lateral. O editor abre com o título "Página de Obrigado" e os mesmos blocos, aplicados à página exibida após o pagamento.
Atualizado em: 08/07/2026