Personalizar o checkout: o que dá para mudar e onde

A página de pagamento é configurada num lugar só: Checkout, no menu lateral. O que você define ali vale para os produtos da loja, e a mudança só chega ao comprador depois de salvar.

As cinco abas

Aparência responde "que cara tem a página?".

• Formato do checkout: Página única (duas colunas, identificação e pagamento à esquerda, resumo à direita) ou Duas etapas (uma coluna, o pagamento só aparece depois da identificação, com resumo fixo no rodapé).
• Modo de cor: Claro, Escuro ou Azul escuro. Formato e modo são independentes: qualquer combinação funciona.
• Cores da loja: a Cor principal é a de avançar (botão de finalizar, forma de pagamento escolhida, "leve também" selecionado) e a Cor secundária é a dos detalhes que orientam (ícones, borda do campo em foco, links, cupom e quantidade). As duas nascem iguais.
• Tipografia e forma: Fonte do checkout (Inter, Roboto, Roboto Mono, Oswald, Merriweather ou Comfortaa) e Cantos (Retos, Padrão ou Arredondados).
• Banner do topo: uma arte para computador e outra para telefone, mais a chave Cabeçalho com logo e nome, que ocupa o topo quando não há banner.

Blocos responde "o que aparece na página?": Campo de cupom, Seletor de quantidade, Barra de urgência (com tempo em minutos, posição e cor própria), Selos de garantia e credibilidade (você marca quais, entre garantia, pagamento seguro, site criptografado, checkout protegido, dados protegidos e aprovação imediata) e o estilo do "Leve também" (lista ou carrossel, e o texto da chamada).

Imagens responde "que arte entra, e onde?". São três posições: acima do resumo do pedido, acima das formas de pagamento e no fim da página. Para cada uma você escolhe a orientação (faixa larga 3:1, paisagem 16:9, quadrada 1:1 ou retrato 2:3) e sobe a arte para computador, para telefone ou para os dois.

Depoimentos liga a prova social e organiza os grupos de depoimentos. Os depoimentos em si são cadastrados a partir dessa mesma aba.

Ajustes finos é o retoque por cima de tudo: cor de fundo, cor do texto, cor da borda, arredondamento, espaçamento e sombra, conjunto por conjunto. Campo em branco significa "segue o tema", então mexa aqui só quando quiser fugir do padrão do modo.

Como salvar

Ao mexer em qualquer campo, a barra Alterações não salvas aparece no rodapé, com Descartar e Salvar alterações. Enquanto não salvar, o comprador continua vendo a versão anterior. Descartar volta ao último salvo.

Se quiser trocar de aba com alterações pendentes, a tela pergunta antes e, se você salvar, ela abre a aba para onde você estava indo.

No painel Prévia, ao lado dos controles, você acompanha o resultado. Cor, fonte e cantos aparecem na hora; blocos, textos e imagens aparecem na prévia depois de salvar.

O botão Restaurar padrão do modo

No fim da aba Aparência existe Restaurar padrão do modo, com a contagem de ajustes de estilo ao lado. Ele limpa as duas cores, a fonte, os cantos e os Ajustes finos, e não toca em imagem, texto, selo, cronômetro nem "leve também". Como qualquer outro campo, só vira gravação quando você aperta Salvar.

O que não fica aqui

Logo e favicon da loja não são deste editor: eles ficam em Configurações da loja, na identidade. Quais produtos aparecem como "Leve também" é definido em cada produto, na aba Order bumps; aqui você decide só como eles aparecem.