Como ocultar e remover facilmente os campos de checkout do WooCommerce (Plugins e PHP)

Publicados: 2019-10-14

O checkout é uma das etapas mais importantes em qualquer loja de comércio eletrônico. Se você deseja ter sucesso e aumentar suas vendas, precisa mantê-lo enxuto. É por isso que hoje mostraremos como ocultar e remover os campos de checkout do WooCommerce .

Há alguns dias, demos algumas dicas de como otimizar seu site. No entanto, a última etapa do funil de vendas é crucial para fechar a venda, por isso precisa de atenção especial.

Por que desabilitar os campos de checkout do WooCommerce?

Você sabia que mais de 75% dos usuários adicionam um produto ao carrinho, mas saem do site sem comprar nada? Uma das principais razões para o abandono do carrinho de compras é que o checkout é muito longo ou complicado .

Para evitar isso, a página de checkout deve ser simples e conter apenas os campos necessários. Isso é especialmente importante se você vende produtos digitais ou virtuais , como software, música, e-books e assim por diante. Como esse tipo de produto não precisa ser enviado, eles devem ter uma página de checkout específica onde você não pede detalhes como endereço ou CEP por exemplo.

Para saber mais sobre como melhorar o checkout de produtos digitais, você pode conferir este artigo. Portanto, para aumentar as conversões, você deve ocultar os campos que simplesmente adicionam distrações e atritos à página de checkout.

Vamos dar uma olhada em como excluir campos de checkout no WooCommerce e acelerar o processo de checkout.

Como remover campos de checkout no WooCommerce?

Como não é possível excluir os campos de checkout padrão do WooCommerce do painel do WordPress, neste tutorial, mostraremos como ocultar e remover campos de checkout de duas maneiras diferentes:

  1. Usando um plug-in
  2. Com um script PHP

Usar um plugin é a maneira mais fácil se você não for um desenvolvedor. O script PHP, por outro lado, permite ocultar quaisquer campos de checkout existentes e personalizar sua loja WooCommerce com um pouco de codificação. Não existe método melhor ou pior. Você obterá o mesmo resultado com ambos, então, dependendo de suas habilidades, você pode escolher o que melhor combina com você.

1) Remova os campos de checkout do WooCommerce usando um plugin

Existem muitas ferramentas para desativar e ocultar campos na página de checkout. Aqui vamos mostrar como fazer isso usando dois plugins gratuitos:

  1. Gerenciador de checkout WooCommerce
  2. Checkout direto para WooCommerce

Essas ferramentas funcionam de forma semelhante, mas têm algumas diferenças. Vamos dar uma olhada em como esses plugins podem ajudá-lo a excluir alguns campos de checkout.

1.1 – Excluir campos de checkout com o WooCommerce Checkout Manager

O WooCommerce Checkout Manager é uma das melhores ferramentas para remover campos de checkout. Este plugin freemium tem uma versão gratuita e 3 planos premium que começam em 19 USD (pagamento único).

Para desabilitar qualquer um dos campos de checkout do WooCommerce, basta seguir estas etapas:

    1. Instale e ative o WooCommerce Checkout Manager. Você pode ir para Plugins > Adicionar novo e procurar por “ WooCommerce Checkout Manager ” ou baixá-lo gratuitamente neste link. A ferramenta possui uma versão pro com recursos mais avançados, mas para essa tarefa, a versão gratuita é suficiente.
    2. Vá para a guia WooCommerce no seu painel do WordPress
    3. Clique em Checkout e depois na guia Faturamento .
    4. Você verá uma lista de todos os campos que você pode ocultar, então ative a opção de desativação no campo que deseja remover.
    5. Depois disso, você pode acessar as guias Frete e Adicionais e desativar os campos que deseja excluir.
    6. Depois de ocultar todos os campos que você não deseja na página de checkout do WooCommerce, lembre-se de salvar as alterações e pronto!

Curto e doce, não foi? Além de remover campos, este plug-in também permite adicionar novos campos, tornar campos opcionais ou obrigatórios, alterar a ordem em que você exibe os campos, aplicar lógica condicional e muito mais. Portanto, se você deseja uma ferramenta para personalizar o checkout, o WooCommerce Checkout Manager é uma excelente opção.

1.2 – Remova os campos de checkout com o Direct Checkout para WooCommerce

O WooCommerce Direct Checkout é um excelente plugin projetado para simplificar o processo de checkout e a página de checkout. Essa ferramenta visa agilizar o checkout para proporcionar aos usuários uma melhor experiência de compra. Ao contrário do WooCommerce Checkout Manager, que permite ativar e desativar campos, o Direct Checkout ajuda a remover campos desnecessários e aumentar as taxas de conversão .

Esta é uma ferramenta freemium. Possui uma versão gratuita com recursos básicos e 3 planos premium a partir de 19 USD (pagamento único). Para excluir campos da página de checkout do WooCommerce com o Direct Checkout, você precisa:

  1. Instale e ative o WooCommerce Direct Checkout. No seu painel do WP, você pode acessar Plugins > Adicionar Novo e pesquisar por “ WooCommerce Direct Checkout ” ou fazer o download gratuitamente neste link.
  2. Vá para a guia WooCommerce no seu painel do WordPress.
  3. Pressione Checkout direto e vá para a guia Checkout .
  4. Aqui, você verá uma lista de todos os campos que podem ser removidos, como país, estado, comentários do pedido, texto da política, colunas e muito mais. Na guia Geral , você também pode direcionar os usuários da página do produto diretamente para o checkout da opção Adicionado ao carrinho de redirecionamento para .
  5. Depois de excluir os campos que você não deseja na página de checkout, basta salvar as alterações.

Em conclusão, se você deseja uma solução rápida e direta, esses dois plugins são uma excelente escolha. Eles permitem que você remova os campos de checkout do WooCommerce em apenas alguns cliques e otimize sua loja.

Além de serem muito fáceis de usar, essas ferramentas têm excelente desempenho e são dois dos melhores plugins de checkout para WooCommerce. A principal desvantagem desse método é que, ao instalar um plug-in, você está modificando o código do seu site. Isso aumenta sua complexidade e as chances de quebrar alguma coisa. Como resultado, um script personalizado pode ser um bom método se você se sentir à vontade para escrever algumas linhas de código.

2) Remova os campos de checkout do WooCommerce com script PHP

NOTA : Antes de começarmos, recomendamos que você crie um tema filho. Dessa forma, em vez de personalizar os arquivos do tema pai, você modificará o tema filho para que suas personalizações não sejam substituídas quando você atualizar o tema pai. Caso não queira criar um tema filho, você pode gerar um backup completo do seu site caso algo dê errado.

Nesta seção, mostraremos como você pode excluir campos de checkout do checkout WooCommerce codificando sua própria solução. Se você verificou nosso tutorial sobre como editar campos de checkout, estará familiarizado com os ganchos do WooCommerce. Nesse caso, usaremos o gancho woocommerce_checkout_fields e o chamaremos de quadlayers_remove_checkout_fields da seguinte forma:

 add_filter( 'woocommerce_checkout_fields' , 'quadlayers_remove_checkout_fields' );

Este é um tipo de hook de filtro, o que significa que ele deve retornar algo quando você o executa. E o que vai retornar? Os dados com os campos que você deseja remover.

Remover o sobrenome

Por exemplo, se você deseja excluir o campo de sobrenome, pode usar o seguinte:

 unset($fields['billing']['billing_last_name']);

Depois disso, você precisa inseri-lo em uma função com o mesmo nome que você usou no gancho do filtro na primeira etapa ( quadlayers_remove_checkout_fields ):

 function quadlayers_remove_checkout_fields( $fields ) {

unset($fields['billing']['billing_last_name']); 

retornar $ campos; 

}

Por fim, insira o script completo para remover o sobrenome do campo WooCommerce no arquivo functions.php de um tema filho conforme mostrado abaixo:

 add_filter( 'woocommerce_checkout_fields' , 'quadlayers_remove_checkout_fields' ); 

function quadlayers_remove_checkout_fields( $fields ) { 

unset($fields['billing']['billing_last_name']); 

retornar $ campos; 

}

Excluir quaisquer outros campos

Portanto, se você quiser excluir qualquer outro campo, precisará adicionar a linha correspondente. Abaixo, você encontra os nomes disponíveis dos campos que podem ser removidos:

 unset($fields['billing']['billing_first_name']);
unset($fields['billing']['billing_last_name']);
unset($fields['billing']['billing_company']);
unset($fields['billing']['billing_address_1']);
unset($fields['billing']['billing_address_2']);
unset($fields['billing']['billing_city']);
unset($fields['billing']['billing_postcode']);
unset($fields['billing']['billing_country']);
unset($fields['billing']['billing_state']);
unset($fields['billing']['billing_phone']);
unset($fields['order']['order_comments']);
unset($fields['billing']['billing_email']);
unset($fields['account']['account_username']);
unset($fields['account']['account_password']);
unset($fields['account']['account_password-2']);

Como mostrar os campos de checkout que você removeu anteriormente?

O que você pode fazer se tiver excluído alguns campos de checkout que deseja exibir novamente? Basta remover a linha de código que oculta o campo específico que você deseja mostrar. Por exemplo, se você desativou o campo de código postal da seção de cobrança e agora deseja adicioná-lo novamente, remova a seguinte linha do arquivo functions.php do seu tema filho:

 unset($fields['billing']['billing_postcode']);

Da mesma forma, se você quiser exibir vários campos ao mesmo tempo, poderá excluir várias linhas de uma só vez.

Bônus: Como remover a guia de informações adicionais no WooCommerce?

A guia Informações Adicionais vem por padrão no WooCommerce. Como essa aba é exibida apenas quando o produto possui peso, dimensões ou atributos, às vezes não é muito útil. Há duas maneiras de desabilitar a guia Informações Adicionais:

  1. Via PHP : Editando o arquivo functions.php .
  2. Via CSS : Editando o arquivo style.css .

Em termos de desempenho, o método PHP é melhor porque impede o carregamento da guia (em vez de carregá-la e escondê-la). Então, aqui mostraremos como remover a guia Informações Adicionais com um script PHP .

NOTA : Para evitar perder suas personalizações ao atualizar seu tema, recomendamos que você aplique essas alterações ao seu tema filho.

  1. Vá para o seu FTP e abra a pasta wp-content . Em seguida, vá para o tema e abra sua pasta child_theme .
  2. Lá, abra o arquivo functions.php .
  3. Vá até o final e insira o seguinte código:
 add_filter( 'woocommerce_product_tabs' , 'quadlayers_remove_product_tabs' );
function quadlayers_remove_product_tabs ( $tabs ) {
unset( $tabs['additional_information'] );
retornar $guias;
}

Lembre-se de salvar as alterações e atualizar a página. É isso! Você removeu a guia Informações Adicionais!

Remova a guia de descrição e comentários

Além disso, você pode se livrar da guia de descrição e da guia de comentários com o seguinte código:

 add_filter( 'woocommerce_product_tabs' , 'quadlayers_remove_product_tabs' );
function quadlayers_remove_product_tabs( $tabs) {
unset( $tabs['description'] );
unset( $tabs['reviews'] );
retornar $guias;
}

Quais campos de checkout do WooCommerce você deve remover?

Então, quais campos de checkout você deve remover? Depende se você vende produtos físicos ou digitais e quanta informação de seus clientes você deseja obter. No entanto, lembre-se de que formulários de checkout mais longos geralmente têm conversões mais baixas. Os clientes tendem a evitar checkouts longos, então aqui estão algumas dicas para manter a página de checkout curta:

  • Se você vende produtos digitais, oculte todos os campos relacionados ao envio, como endereço, CEP, cidade e assim por diante.
  • Exibe apenas campos obrigatórios. Você pode ocultar ou recolher campos opcionais, como o nome da empresa.
  • Desative a validação do código postal para reduzir o atrito na página de checkout.
  • Se você vende produtos físicos, torne os detalhes de cobrança os detalhes de envio por padrão para ocultar campos desnecessários.
  • Quando possível, use o preenchimento automático para reduzir o tempo que os usuários gastam preenchendo o formulário.
  • Use apenas um campo para nome. Em vez de exibir 3 campos (nome, nome do meio e sobrenome), você pode usar um campo de nome completo .

Outra opção para reduzir as etapas na página de checkout e aumentar as conversões é usar um botão de compra rápida para WooCommerce. A maioria dos usuários de grandes players de comércio eletrônico porque é uma maneira muito eficaz de acelerar o processo de compra e permitir que os compradores comprem em um clique.

Conclusão

Em conclusão, sua página de checkout pode ter um enorme impacto em seus negócios e oferecer uma vantagem competitiva. Portanto, é fundamental otimizá-lo e melhorá-lo o máximo que puder.

Neste tutorial, vimos duas maneiras diferentes de remover e desabilitar os campos de checkout do WooCommerce . Cada um deles tem seus prós e contras, então você deve escolher aquele que melhor se adapte às suas habilidades e necessidades.

WooCommerce Checkout Manager e Direct Checkout são ótimos plugins que permitem desabilitar campos de maneira rápida e fácil. No entanto, eles tornam o código da loja mais complexo. A função PHP, por outro lado, requer alguma codificação, mas é mais limpa e não consome nenhum recurso. Além de remover os campos de checkout, você também pode melhorar o processo de compra em seu site criando funis de vendas.

Por fim, se você deseja melhorar sua página de checkout, recomendamos que você dê uma olhada em nosso tutorial para personalizar o checkout no WooCommerce e nosso guia sobre como editar campos de checkout .

Qual método você escolheu? Você conhece alguma outra maneira de remover os campos de checkout do WooCommerce? Deixe um comentário abaixo e compartilhe suas experiências conosco.