Pular para o conteúdo

Como personalizar o checkout do WooCommerce sem programar

Os três caminhos para personalizar o checkout do WooCommerce sem código, o que cada um permite, a ordem em que vale mexer e o que evitar para não perder vendas.

Dona de uma loja de cerâmica no ateliê, entre prateleiras de canecas e tigelas, comparando cartelas de cor terracota, creme e verde com o formulário de checkout aberto no notebook, que tem um botão verde.
Neste artigo

Dá para personalizar o checkout do WooCommerce sem programar por três caminhos: as opções do próprio WooCommerce, um plugin de campos ou de edição do checkout, ou um checkout com personalizador próprio. O que decide o resultado não é a ferramenta, e sim o que você muda: identidade visual, textos e campos ajudam a vender; banners, menus e enfeites costumam atrapalhar.

Este artigo mostra o que cada caminho permite, uma tabela para comparar, a ordem em que vale personalizar e o que testar antes de deixar no ar.

Personalizar o checkout do WooCommerce, em resumo

Personalizar o checkout é ajustar a página de finalização para que ela pareça da sua loja, peça só o necessário e responda às dúvidas do comprador na hora de pagar. Não é transformar o checkout em mais uma vitrine.

  • Vale mexer: logo, cores, botão principal, textos, campos, selos de confiança, depoimentos reais e destaque do Pix.
  • Vale evitar: menu completo do tema, banners, carrosséis, pop-ups e qualquer coisa que leve o cliente para fora da página.
  • Vale medir: a taxa de conclusão antes e depois de cada mudança, e não só a aparência.

Por que o checkout não é vitrine

O checkout é a página com menos espaço para distração da loja inteira, porque o cliente já decidiu comprar e só precisa terminar. Segundo o Baymard Institute, a taxa média de abandono de carrinho fica em torno de 70%, e boa parte das desistências acontece por atrito no processo de compra.

Por isso, a personalização certa tem dois objetivos: dar confiança ("esta é a loja em que eu estava") e tirar atrito ("sei o que preencher e quanto vou pagar"). Um cabeçalho cheio de links ou um banner de promoção trabalham contra os dois. Se você ainda não sabe onde os clientes desistem, comece pelo funil do checkout antes de mudar o visual.

Caminho 1: o que o próprio WooCommerce permite

O WooCommerce permite ajustes básicos sem plugin, e o lugar depende do tipo de checkout que a sua loja usa. Desde a versão 8.3, as instalações novas usam o checkout em blocos; lojas mais antigas costumam continuar no checkout clássico.

  • Checkout clássico: em Aparência → Personalizar → WooCommerce → Finalizar compra, você define se campos como empresa, complemento (endereço linha 2) e telefone ficam ocultos, opcionais ou obrigatórios, e ajusta os textos de política de privacidade e termos.
  • Checkout em blocos: a página Finalizar compra é editada no editor de blocos. Dá para ligar ou desligar alguns campos, mudar textos de botões e títulos e reorganizar parte dos blocos.

O limite aparece rápido. O WooCommerce não traz CPF, CNPJ, número e bairro separados, e a aparência fica presa ao tema. Esse é o motivo de o checkout padrão perder vendas no Brasil, e não falta de cor.

Caminho 2: plugins de campos e editores de checkout

Plugins de campos e editores de checkout resolvem uma parte específica: acrescentar, remover ou reordenar campos e, em alguns casos, mudar o layout. São uma boa saída quando o problema é pontual, como pedir um dado a mais para produtos personalizados.

Antes de instalar, confira três pontos na página do plugin no WordPress.org:

  1. Compatibilidade com o checkout em blocos. Muitos plugins de campos funcionam só no checkout clássico.
  2. Data da última atualização e versão do WordPress testada. Plugin parado vira risco a cada atualização do WooCommerce.
  3. O que ele não faz. Um editor de campos não resolve CEP automático, Pix em destaque ou frete calculado cedo.

O custo escondido é a soma: um plugin para campos brasileiros, outro para o visual, outro para o order bump, outro para o carrinho abandonado. Cada um carrega os próprios scripts na página que mais precisa ser rápida. O guia de checkout brasileiro no WooCommerce mostra quantas peças esse caminho costuma exigir.

Ilustração 3D de pessoas montando um checkout no celular com blocos de logo, paleta de cores, botão, depoimento com estrelas e selo de segurança, enquanto outra pessoa empurra um bloco cheio de banners, setas e carrossel para a lixeira

Caminho 3: um checkout com personalizador próprio

Um plugin que substitui a página de finalização costuma trazer o próprio painel de aparência, o que permite mudar o visual sem mexer no tema e sem código. É o caminho para quem quer personalizar e, ao mesmo tempo, trocar a estrutura do checkout.

No Checkout Rishi, a aparência fica no Personalizador do WordPress, em Aparência → Personalizar → Checkout Inteligente, com prévia ao vivo no computador, no tablet e no celular. As seções cobrem cabeçalho (logo, cores, selo de segurança), botões, colunas, rodapé, textos, login, depoimentos e urgência, e há um campo de CSS personalizado para quem precisa de um ajuste fino. Se o plugin for desativado, o checkout padrão do WooCommerce volta.

Tela do Personalizador do WordPress com a lista de seções do Checkout Rishi à esquerda (Geral, Cabeçalho, Rodapé, Colunas, Botões, Textos, Login, Order Bump, Depoimentos, Urgência e Avançado) e, à direita, a prévia ao vivo do checkout de uma loja de cafés com a etapa Perfil preenchida com dados de exemplo

A própria documentação do produto recomenda o mesmo critério deste artigo: mudar cores e logo à vontade e mudar a estrutura só com bom motivo.

Comparativo dos três caminhos

Critério WooCommerce nativo Plugin de campos ou editor Checkout com personalizador próprio
Custo Grátis Grátis ou licença por plugin Licença do plugin
Visual Depende do tema Parcial Logo, cores, botões e textos no painel
Campos brasileiros Não tem Depende do plugin Já vêm prontos (no caso do Checkout Rishi)
Checkout em blocos Sim Varia por plugin Substitui a página de finalização
Quantidade de plugins Nenhum extra Um por necessidade Um
Bom para Ajustes mínimos Necessidade pontual Quem quer refazer o checkout inteiro

O que personalizar primeiro, por ordem de impacto

A melhor ordem começa pelo que dá confiança e tira atrito, e deixa o acabamento para o fim. Uma sequência que funciona para a maioria das lojas:

  1. Logo e cores da marca no cabeçalho. O cliente precisa reconhecer a loja de onde veio. Use a mesma cor do botão de compra da página de produto.
  2. Botão principal com contraste. Um único botão de destaque por etapa, com texto de ação ("Avançar", "Finalizar pedido").
  3. Campos. Esconda o que a operação não usa e deixe obrigatório só o que a nota fiscal e a entrega exigem. O artigo sobre campos brasileiros no checkout detalha cada um.
  4. Textos de ajuda. Troque rótulos genéricos por frases da sua loja, como o prazo de postagem ou como funciona a troca.
  5. Selo e rodapé com políticas. Links para troca, privacidade e contato, sem o menu completo do site.
  6. Prova social real. Dois ou três depoimentos específicos de clientes, com permissão para usar nome e foto. Veja como isso funciona na página de depoimentos e estoque baixo.
  7. Destaque do Pix. Se a loja dá desconto no Pix, mostre o valor antes da escolha do pagamento. O cálculo está em desconto no Pix sem perder margem.

O que evitar ao personalizar o checkout

Os erros mais caros são os que deixam o checkout mais bonito e mais lento ou mais confuso. Evite:

  • Cabeçalho e rodapé completos do tema ou do Elementor. A documentação do Checkout Rishi avisa que carregar o Elementor no checkout pode aumentar o tempo de carregamento em até 50%.
  • Escassez falsa. Aviso de "últimas unidades" só com estoque real. Contagem regressiva inventada destrói a confiança quando o cliente percebe.
  • CSS demais. Cada regra personalizada pode quebrar numa atualização do plugin ou do tema. Prefira as opções do painel e anote o que foi feito por CSS.
  • Mudar tudo de uma vez. Se a conversão cair, você não saberá qual mudança causou a queda.

Como testar antes de publicar

Toda personalização precisa de um pedido de teste completo, no celular, antes de ir ao ar. A prévia do Personalizador mostra o visual, mas não substitui uma compra real.

  1. Faça um pedido com Pix e outro com cartão, do começo ao fim, num celular de verdade. As boas práticas de checkout no celular servem de roteiro.
  2. Confira se a nota fiscal, o frete e o ERP receberam os mesmos dados de antes.
  3. Anote a taxa de conclusão das duas semanas anteriores e compare com as duas seguintes.
  4. Mude uma coisa por vez quando o objetivo for conversão, e não só aparência.

Perguntas frequentes

Dá para personalizar o checkout do WooCommerce sem plugin?
Sim, mas pouco. No checkout clássico, o Personalizador do WordPress permite ocultar ou exigir campos como empresa, complemento e telefone; no checkout em blocos, a página Finalizar compra é editada no editor de blocos. Campos brasileiros e mudanças de layout pedem plugin.
Personalizar o checkout aumenta a conversão?
Depende do que muda. Logo, cores coerentes, campos enxutos e textos claros reduzem atrito; banners, menus e efeitos costumam aumentar a desistência. Meça a taxa de conclusão antes e depois de cada ajuste.
Posso usar o cabeçalho do meu tema no checkout?
Pode, mas não é recomendado: o cabeçalho completo traz links que tiram o cliente da compra e pode deixar a página mais lenta. Prefira um cabeçalho simples com logo e selo de segurança.
Como saber se o checkout da loja é clássico ou em blocos?
Edite a página Finalizar compra no WordPress. Se aparecer o bloco Finalizar compra com os campos editáveis, é o checkout em blocos; se aparecer apenas o shortcode [woocommerce_checkout], é o clássico.