A seção de endereço de envio e cobrança do WooCommerce é a seção mais importante no processo de checkout. Funciona bem por padrão. Às vezes você precisa de algo mais. Você não pode mudar a maneira como funciona e parece ou… ou pode? Vou te ensinar neste artigo como personalizar essas seções da maneira que você quiser!
Seus clientes devem fornecer suas informações de faturamento ao fazer um pedido. Existe a opção de definir um endereço de entrega diferente. O cliente deve marcar uma caixa de seleção na página de checkout.
Funciona muito bem por padrão. Na maioria dos casos, você não precisa alterar essa página. Acho que você está aqui porque precisa de mais alguma coisa 🙂
Você pode personalizar a página de checkout como quiser:
- definir alguns campos como não obrigatórios
- desativar qualquer campo (por exemplo, para produtos digitais)
- alterar a ordem dos campos
- e adicione seus próprios campos personalizados.
Você precisa de um plugin simples: Campos de checkout flexíveis (PRO)
Assista a este vídeo e veja você mesmo o que este plugin pode oferecer na versão gratuita:
Campos de checkout flexíveis do WooCommerce
Edite, adicione novos ou oculte campos desnecessários do formulário de pagamento. É tudo uma questão de conversões e uma melhor experiência do usuário.
Depois de instalá-lo, você pode configurar as seções de endereço de entrega e cobrança do WooCommerce. Vá para WooCommerce → Campos de pagamento . Você pode alternar entre eles usando as guias na parte superior da tela ( Cobrança e Envio ):
Campos de checkout flexíveis – Adicione um novo campo e edite seu endereço de entrega e cobrança
Como você pode ver, você pode adicione facilmente um novo campo qualquer editar uma seção . Você tem opções como:
- Habilitar campo
- Campo obrigatório
- Rótulo
- Validação
Existem muito mais funções nas guias Aparência, tela ligada e Avançado. Você pode verificá-los você mesmo. Se você quiser ler mais sobre eles, continue com este artigo.
Configuração do campo de pagamento
Vejamos as opções de configuração.
Os campos obrigatórios
Alguns campos nas seções Endereço de envio e cobrança são obrigatórios. Você pode facilmente mudar isso. Olhar:
Como você pode ver, esses campos são opcional . Você também pode criar novos campos personalizados e configurá-los conforme necessário:
Como? Basta marcar ou desmarcar a opção O campo obrigatório :
Saiba mais sobre os campos obrigatórios do WooCommerce Checkout
Validação
Você pode usar a validação padrão do WooCommerce ou a personalizada.
A validação é muito útil:
Se você deseja adicionar validação às seções de endereço de entrega e cobrança, use nosso Guia de validação de checkout WooCommerce →
Mostrar em
Você pode configurar onde exibir um campo. Por padrão, o plugin exibe o campo em todos os locais:
- Obrigado página
- Página da minha conta – seção de endereço
- Página Minha conta – seção de pedidos
- em e-mails
Você pode mudar isso. Confira nosso guia sobre campos personalizados em minha conta WooCommerce →
Aparência
Altere a aparência dos campos das seções de envio e cobrança do WooCommerce.
Defina sua própria classe personalizada para um campo:
Desta forma você pode alterar qualquer campo neste:
Neste (ou o que você quiser):
Leia mais em nosso guia sobre como estilizar campos personalizados com CSS →
Lógica Condicional
Você pode implementar lógica condicional nas seções de endereço de entrega e cobrança. Você quer um exemplo? Olhar:
Um cliente deve marcar a caixa de seleção quero uma fatura . Após esta ação, novos campos aparecem.
Existem muitos cenários em que você pode usar lógica condicional. Você pode configurar lógica condicional para campos…
…os produtos/categoria…
…ou método de envio selecionado.
Como você pode ver, você precisa ir para a guia Avançado. Lá você encontrará todas as opções.
Saiba mais sobre os campos condicionais de checkout do WooCommerce →
Outros ajustes
O plugin Flexible Checkout Fields permite adicionar campos personalizados a outras seções, como:
- pedidos
- Detalhes do cliente
- ou formulário de inscrição
Aproveite! Leia nosso artigo sobre como personalizar a página de checkout →
Editor de campo de checkout WooCommerce
Como você pode ver, o plugin Campos de checkout flexíveis é muito poderoso. Para nós (os desenvolvedores) este plugin é o melhor do mercado 🙂
Mas não acredite apenas na nossa palavra, mais de 70.000 lojas WooCommerce em todo mundo usa diariamente.
Plug-in de campos de pagamento flexíveis no repositório
Freqüentemente adicionamos novos recursos ou corrigimos bugs neste plugin. As pessoas realmente apreciam isso!
Este plugin também usa a aparência do WordPress e é muito fácil de usar devido à interface limpa.
As pessoas apreciam o que criamos:
Você pode encontrar muito mais comentários positivos como o acima! No entanto, você não precisa acreditar apenas na minha palavra. Você pode baixar este plugin gratuitamente e conferir você mesmo!
Baixe campos de pagamento flexíveis →
Personalize a seção de endereço de envio e cobrança em e-mails WooCommerce
Para personalizar a seção de envio e cobrança nos modelos de e-mail Woo, você precisará de um plugin de terceiros chamado YayMail. Você pode baixá-lo gratuitamente e criar os e-mails em um construtor de e-mail de arrastar e soltar.
A versão premium deste personalizador de e-mail WooCommerce oferece suporte a campos de checkout flexíveis. Ajuda exibir os campos personalizados adicionados aos modelos de e-mail de pedido e localizar a seção como desejar.
Opções de layout integradas para ajudá-lo a embelezar o e-mail, incluindo:
- título de cobrança
- Título de envio
- Família de fontes
- Fundo/borda da caixa/cor do texto