Como adicionar uma página de checkout no estilo Shopify no WordPress

Aero Checkout por WooFunnels

Então você conseguiu criar um site de e-commerce para vender seus produtos e serviços. Parabéns!

Nesta fase, apostamos que você criou uma página inicial, uma página de produto e outras páginas da web necessárias. Provavelmente, a única coisa de que você precisa é uma página de checkout conectada a opções de pagamento populares para começar a vender e ganhar dinheiro.

A boa notícia é que criar uma página de checkout no estilo Shopify é muito mais fácil do que você imagina. Neste post, vou compartilhar como você pode criar um checkout de uma página para sua loja WooCommmerce usando o plugin de checkout Aero.

O que é o plugin Aero Checkout?

Aero Checkout é um plugin que permite aos usuários criar uma página de checkout no estilo Shopify.

Você não precisa criar uma página de checkout do zero. Por padrão, o plug-in tem modelos de checkout prontos para uso, checkouts de uma página e formulários integrados que você pode adicionar facilmente ao seu site.

Aqui está um exemplo de uma página de pagamento que você pode criar com esta ferramenta.

modelo de pagamento aero

O Aero Checkout está disponível no WooFunnels Funnel Builder. Você pode simplificar facilmente seu fluxo de checkout escolhendo planos pagos, como o pacote Starter e Growth.

Aero Checkout - preços da página de pagamento

Iniciando

Neste estágio, presumiremos que você já possui sua própria loja WooCommerce.

Feito isso, veja como você pode criar sua própria página de checkout.

  • Criar uma Conta do WooFunnels Funnel Builder.
  • Obtenha o plugin Aero Checkout como um plugin adicional
  • Selecione um plano de assinatura (eles têm garantia de devolução do dinheiro de 14 dias e um período de devolução do dinheiro). Lembre-se de usar nosso desconto de 10% usando o código do cupom: WPMAYOR.
  • Instale o Construtor de funil plugin no WordPress.org.
  • Ative o plugin através do menu ‘Plugins’ no WordPress.

Como criar um funil de página de checkout

Em primeiro lugar, temos que adicionar uma página de checkout em nosso funil de vendas.

1. Vá para WooFunnels > Funis

Aero Checkout: funis da página de pagamento

2. Clique no Adicionar novo para acessar o construtor de página de checkout.

Aero Checkout: funis da página de pagamento

3. No Projeto guia, você encontrará vários modelos para páginas de vendas em sua loja de comércio eletrônico. Como queremos adicionar uma página de checkout em nosso funil, selecione Crie seu funil.

funil de criação de checkout simplificado

4. Escolha o + Adicionar nova etapa opção no meio da página. Você verá uma janela pop-up com uma série de etapas relacionadas ao funil, como uma página de vendas, upsell com um clique e uma página de agradecimento.

Para este exemplo, vamos escolher o Pagina de pagamento opção.

página de pagamento aero

5. Adicione um nome para a página de pagamento.

Leia Também:  Shortcodes WooCommerce - Saiba como personalizar sua loja virtual no Wordpress

Iremos com o nome Pague 1 para este tutorial.

etapas de checkout simplificadas

Isso é tudo para criar um funil de página de checkout, agora vamos nos concentrar na construção e no design da página.

Como criar um checkout de uma página com Aero

Vamos começar a trabalhar e criar uma página de pagamento.

1. Selecione o funil da página de pagamento que você criou anteriormente.

funis de checkout simplificados

2. Sob o Projeto guia, você encontrará vários modelos de página de pagamento.

Existem três maneiras de criar uma página de checkout por meio de Customizador, Elementor, Divi, ou você pode personalizar sua própria página de checkout. Enquanto isso, os modelos variam de Uma etapa, duas etapas, ou Três etapas Formato.

Aero Checkout - modelos de página de checkout 1

3. O Customizador é um recurso integrado com modelos pré-fabricados para você escolher. Basta clicar no Botão de importação e você pode literalmente criar uma página de checkout em 30 segundos.

Aero Checkout - modelos de página de checkout

Selecione a opção “Visualizar”.

visualização simplificada de checkout

Como você pode ver, o template tem tudo que você precisa em uma página de checkout. Existem campos para informações de contato, detalhamento do pedido e um botão para clicar no pagamento.

Aero Checkout: página de amostra de pagamento

Os proprietários de lojas de comércio eletrônico que desejam mais opções podem escolher um modelo Elementor ou Divi, ou criar sua própria página de checkout personalizada.

Como adicionar um logotipo à sua página de checkout do WooCommerce

O nome da empresa e o logotipo garantem que a página de finalização da compra esteja alinhada com a identidade da sua marca. Isso também tornará a página verossímil e confiável, especialmente para novos clientes.

Depois de importar o modelo na etapa anterior, clique no botão “Editar” no painel.

editar woofunnels

Um novo painel aparecerá com a opção de menu e no lado esquerdo e o modelo de checkout no lado direito. Em seguida, clique no ícone de lápis ao lado do logotipo.

Aero Checkout - página de pagamento

No Cabeçalho > Logotipo, você tem a opção de remover o logotipo padrão do Aero Checkout e substituí-lo pelo logotipo específico da marca.

Aero Checkout - logotipo da página de checkout

Role para baixo para opções adicionais para editar o texto do cabeçalho e informações de helpdesk.

aero checkout informações do cliente

Aqui está um exemplo de um cabeçalho personalizado.

exemplo de logotipo aero checkout

Como fazer mais personalizações na página de checkout

Além do cabeçalho, o Aero Checkout permite que você faça alterações no formulário, na lista de produtos e em outras partes relevantes da página de destino.

Semelhante à edição do título, clique no ícone de lápis para editar a seção desejada.

Vamos tentar editar os campos na seção de informações do cliente.

Aero Checkout - informações do cliente da página de pagamento

Você verá que o menu à esquerda possui opções para editar a tipografia, botões e campos na página de checkout. Você não precisa aprender o básico de codificação para fazer as mudanças que deseja.

Aero Checkout - informações do cliente da página de pagamento

Se houver outros elementos na página que você gostaria de personalizar, selecione o ícone de lápis na página. Você também pode navegar por outras opções no menu principal para fazer modificações específicas.

Leia Também:  5 maneiras de fortalecer a jornada do cliente

Essas outras opções incluem a capacidade de personalizar:

  • Testemunhos
  • Suporte ao cliente
  • Lucros
  • Lista de produtos
  • Formulário de pagamento
  • Visibilidade do widget
  • … Entre muitos outros.
campo de formulário menu editar

Aqui está um exemplo de uma página com um campo de formulário totalmente personalizado.

personalizar campos de formulário

Como habilitar checkout rápido

Obviamente, os clientes desejam pagar rapidamente com base no método de pagamento de sua preferência.

É exatamente por isso que você ficará feliz em saber que o WooFunnels Funnel Builder oferece opções de pagamento expresso para Amazon Pay, Paypal Express, Google Pay e Apple Pay.

O primeiro passo é certificar-se de que a forma de pagamento desejada já esteja ativada em sua loja WooCommerce. Você pode fazer isso indo para o WooCommerce > Definições > Pagamentos e habilitando seu método preferido.

pagamentos aero checkout

Depois de configurar as opções de pagamento para sua loja de comércio eletrônico, eis o que fazer:

Volte para o funil da página de checkout que você criou por meio de WooFunnels e selecione Otimizações.

otimizações de pagamento simplificadas

Vamos para Botões inteligentes para pagamento rápido > Permitir > sim para um processo de checkout rápido e conveniente.

botões de pagamento inteligentes simplificados

Como adicionar cupons à página de checkout

Muitas lojas de comércio eletrônico usam cupons que os clientes podem usar durante as vendas especiais. Os códigos de cupom também podem ser concedidos como recompensas de um programa de fidelidade ou programa de referência.

Uma caixa de texto para um código de cupom pode ser colocada voltando ao Otimizações menu na seção anterior. Por favor selecione Aplicar cupons automaticamente > sim e insira seu código de cupom. Certifique-se de que Desativar campo de cupom a seção está definida para Não para adicionar o campo de cupom.

aplicar cupom automaticamente

Desde que as opções corretas sejam selecionadas, um campo de cupom aparecerá no modelo por padrão.

campo de cupom editado

Como ativar a visualização em várias etapas

Uma visualização em várias etapas permite que os clientes insiram suas informações em etapas. Ao longo do processo, eles podem acessar e editar facilmente as informações inseridas nas etapas anteriores. Isso é ideal para lojas de comércio eletrônico que optam por um processo de checkout de duas ou três etapas.

Tal como acontece com o check-out expresso, você pode ativá-lo no Otimizações seção. Sob a Visualização do campo multi-etapas, marque a caixa para os campos específicos que você gostaria de exibir durante o processo de checkout.

Leia Também:  Como conduzir o funil por meio do marketing de conteúdo e do link building

Neste caso, eu marquei a caixa para Correio eletrônico Y Endereço para envio.

pré-visualização do campo de verificação aerodinâmica multi-passagem

Em uma etapa anterior, discutimos que os modelos variam de Uma etapa, duas etapas, ou Três etapas Formato.

Aero Checkout - modelos de página de checkout 1

Se você optar pelo formato de três etapas, esta é a aparência do primeiro modelo.

A primeira etapa contém a seção de informações do cliente, como e-mail, nome e endereço do cliente.

página de checkout simplificada com várias etapas

A segunda etapa é o envio e os detalhes do produto. Como ativamos o envio em várias etapas, o e-mail e o endereço também aparecem na segunda etapa.

aero checkout página multi-passo 2

Na etapa final ou fase de pagamento, você encontrará o resumo do pedido e as informações de pagamento. Como a opção de pagamento em várias etapas está ativada, você encontrará informações das etapas anteriores, como e-mail, endereço de entrega e método de entrega.

página de checkout simplificada multi-etapa 3

Como visualizar a página de pagamento em dispositivos móveis, tablets ou computadores desktop

Um dos principais benefícios do Aero Checkout é que os modelos são otimizados automaticamente para dispositivos móveis.

Você pode acessar a visualização do celular ou tablet clicando nos ícones na parte inferior do menu à esquerda.

página de checkout simplificada para celular

Uma olhada em sua visualização móvel revela que os campos de texto e formulário são grandes o suficiente para usuários de dispositivos móveis. Eles também têm um botão clicável “aplicar cupom”:

visualização de pagamento móvel

Mais importante ainda, há também um botão de finalização da compra clicável ou “fazer pedido”:

botão clicável de fazer pedido

Considerações finais sobre a página de checkout estilo Shopify do Aero Checkout

Aero Checkout é um plug-in conveniente que permite criar páginas de checkout em um instante. Pessoalmente, adoro os modelos predefinidos que você pode importar e personalizar facilmente com base em suas preferências. Além disso, você pode ativar a verificação rápida e a visualização de várias etapas com o clique de um botão.

Por US $ 99 / ano, parece um plugin um pouco caro para o seu site WooCommerce. No entanto, lembre-se de que a página de checkout é um dos aspectos mais cruciais do processo de aquisição de clientes. Dito isso, seu plano inicial parece um bom negócio para empreendedores do WooCommerce que desejam as vantagens de uma página de checkout no estilo Shopify.

10% DE DESCONTO
WooFunnels

Desconto exclusivo de 10% em WooFunnels – O criador de funis mais poderoso para WordPress.

Desconto exclusivo de 10% em WooFunnels – O criador de funis mais poderoso para WordPress. Mostre menos

Em geral, você deve experimentar se quiser ter um processo de checkout tranquilo.

Compartilhe este Link:

Compartilhar no facebook
Compartilhar no twitter
Compartilhar no linkedin
Compartilhar no pinterest
Compartilhar no email
Compartilhar no whatsapp
Compartilhar no telegram

Deixe um comentário

Receba nossos preços
e condções direto no seu email

Por favor, preencha os campos abaixo:

Preferência de contato: