Se você já perdeu uma venda porque sua página de checkout era lenta, confusa ou não tinha a opção de pagamento correta, você sabe como isso é frustrante. Uma página de checkout personalizada no WordPress corrige isso e oferece aos compradores uma forma de pagamento tranquila e confiável.
Neste guia, eu o orientarei a criar um do zero sem tocar no código. Adicionaremos elementos que de fato levam as pessoas a concluir o pedido, como chamadas para ação claras, design compatível com dispositivos móveis e avaliações reais de clientes.
Faremos isso usando o SeedProd, um construtor de arrastar e soltar que funciona perfeitamente com o WooCommerce para que você possa lançar uma página de checkout de alta conversão hoje mesmo.
Etapas rápidas para criar uma página de checkout personalizada no WordPress:
Por que você precisa de uma página de checkout personalizada no WordPress?
A página de checkout padrão do WooCommerce funciona, mas não foi projetada para maximizar as vendas. Uma página de checkout personalizada do WordPress permite que você remova as distrações, oriente os compradores durante o processo e dê a eles mais motivos para concluir o pedido.
O WooCommerce facilita a adição de um checkout básico com gateways de pagamento, páginas de produtos e suporte a cartões de crédito. Mas sem personalização, você está perdendo recursos que podem reduzir o abandono do carrinho, que, segundo estudos, afeta de 70 a 85% de todos os carrinhos de compras on-line.
Ao criar uma página de checkout personalizada, você pode:
- Adicione depoimentos e provas sociais para criar confiança
- Mostrar produtos relacionados para aumentar o valor do pedido
- Use formulários personalizados para coletar apenas os detalhes de que você precisa
- Oferecer mais opções de pagamento para atender a diferentes clientes
- Personalize os campos para uma experiência de checkout mais rápida e amigável
Com o layout e os elementos corretos, uma página de checkout personalizada não só tem uma aparência melhor, como também pode melhorar diretamente suas taxas de conversão e transformar mais compradores ocasionais em clientes recorrentes.
Como criar uma página de checkout no WordPress (sem código)
Para este tutorial, usaremos o SeedProd para criar uma página de checkout no WordPress. O SeedProd é o melhor construtor de páginas do WordPress do tipo arrastar e soltar, usado por mais de 1 milhão de sites.
Com o SeedProd, você pode criar facilmente qualquer página de destino do WordPress sem escrever uma única linha de código. E, devido à sua poderosa integração com o WooCommerce, você pode criar páginas de checkout personalizadas e outras páginas do WooCommerce e vinculá-las à sua loja do WooCommerce.
Isso significa que, em vez de usar o checkout padrão de uma página do WooCommerce, você pode criar uma página totalmente personalizada e otimizada para conversões. E, antes do lançamento, você pode criar uma página de lançamento em breve do WooCommerce para gerar leads.
Portanto, se você quiser criar uma página de checkout no WordPress para iniciantes, veja como fazer isso com o SeedProd.
Tutorial em vídeo
Etapa 1: Instalar e ativar o SeedProd
A primeira etapa é instalar e ativar o plug-in SeedProd.
Observação: há uma versão gratuita do SeedProd disponível. No entanto, usaremos o SeedProd Pro para os blocos avançados do WooCommerce.
Se você precisar de ajuda com essa etapa, siga este guia passo a passo sobre como instalar um plug-in do WordPress.
Após ativar o SeedProd, acesse SeedProd " Settings e insira sua chave de licença.
Essas informações são fáceis de encontrar na seção Downloads da sua conta no site da SeedProd.
Etapa 2: Criar uma nova página
Depois de ativar sua chave de licença, navegue até SeedProd " Pages em seu painel do WordPress. Nessa página, você verá uma visão geral dos diferentes modos de página do SeedProd e uma área para adicionar novas páginas de destino.
Com os modos de página, você pode instantaneamente:
- Crie e ative uma página de "Em breve
- Ativar o modo de manutenção
- Criar uma página 404 personalizada
- Configurar uma página de login personalizada do WordPress
- Crie uma página de destino autônoma no WordPress
O melhor de tudo é que isso proporciona funcionalidade extra ao seu site sem a necessidade de instalar vários plug-ins do WordPress.
Para este guia, queremos criar uma página de checkout autônoma do WordPress. Para fazer isso, clique no botão Add New Landing Page (Adicionar nova página de destino ).
Na próxima tela, você pode escolher entre centenas de modelos de páginas de destino responsivas.
Você pode filtrar os designs clicando nos espaços reservados para as guias na parte superior:
- Todos
- Em breve
- Modo de manutenção
- 404 Página
- Vendas
- Webinar
- Aperto de chumbo
- Webinar
- Login
A melhor abordagem é procurar um modelo que se aproxime do design que você deseja. E se ele não for perfeito, você poderá personalizá-lo facilmente na próxima etapa sem PHP, CSS ou códigos de acesso.
Para este tutorial, usaremos o modelo Blank para mostrar como é fácil criar uma página de checkout no WordPress sem contratar um desenvolvedor.
Para escolher o modelo, passe o mouse sobre a miniatura e clique no ícone de marca de seleção laranja.
Em seguida, será exibida uma janela pop-up solicitando que você insira um nome e um URL para sua página.
Em seguida, você pode clicar no botão Save and Start Editing the Page (Salvar e começar a editar a página ).
Etapa 3: Adicione conteúdo à sua página de checkout
Depois de importar seu modelo, ele será aberto no construtor de páginas visuais do SeedProd e terá uma aparência semelhante à do exemplo abaixo. É aqui que você pode criar sua página de checkout do WordPress e otimizá-la para conversões.
Você verá uma visualização ao vivo da sua página à direita. E, à esquerda, há um painel de opções em que é possível escolher diferentes blocos e seções e personalizar o design.
Cabeçalho da página de checkout
Primeiro, adicionaremos um cabeçalho à sua página de checkout para que você possa manter a marca consistente em todo o site.
Para isso, clique na guia Sections (Seções ) no painel esquerdo e clique na categoria Header (Cabeçalho). A partir daí, passe o mouse sobre qualquer seção de cabeçalho e clique no ícone de adição para adicioná-la à sua página.
Em seguida, clique na área de imagem da sua nova seção de cabeçalho. Aqui você pode carregar uma imagem do seu computador ou da biblioteca de mídia do WordPress para usar como logotipo do seu site.
Também recomendamos remover o menu de navegação da página de checkout. Isso reduzirá o número de pessoas que abandonam a página e incentivará os usuários a concluir o processo de checkout.
Para excluir o menu de navegação, passe o mouse sobre o bloco de navegação e clique no ícone da lixeira.
Agora vamos personalizar o botão de chamada para ação (CTA). Em vez de enviar os usuários para fora da página, você pode usar esse botão para lembrá-los do conteúdo do carrinho de compras.
Portanto, clique no botão CTA para abrir as configurações à esquerda e substituir o texto padrão. No nosso caso, alteramos para "View Cart" (Exibir carrinho).
Em seguida, você pode adicionar o URL da página do carrinho do WooCommerce no campo Link. Se desejar, você pode tornar o link nofollow ou abri-lo em uma nova guia, marcando a caixa de seleção.
Bloco de checkout do WooCommerce
Com a marca do seu site definida, vamos adicionar a funcionalidade de checkout com campos de formulário à sua página. Primeiro, arraste um novo bloco de coluna para sua página.
Em seguida, escolha o layout de sua preferência.
Em seguida, role o painel esquerdo para baixo até a área WooCommerce, que oferece os melhores blocos do WooCommerce. A partir daí, escolha o bloco Checkout e arraste-o para sua página.
Clique em qualquer lugar do bloco Checkout para personalizar as configurações, inclusive:
- Layout de checkout de 1 ou 2 colunas
- Fontes e cores do cabeçalho do checkout
- Estilo de campo personalizado
- Estilos de botões
- Cores de destaque do alerta
- Bordas, planos de fundo e estilo do carrinho
- Personalizações da seção de pagamento
Lembre-se de clicar em Save (Salvar) para armazenar as configurações do editor de campos de checkout.
Produtos populares do WooCommerce
Se quiser aumentar as vendas, você pode adicionar produtos populares à sua página de checkout do WordPress em seguida. Isso pode incentivar os compradores a adicionar mais itens ao carrinho antes de pagar.
Para adicionar produtos populares, escolha o bloco Best Selling Products na seção WooCommerce e arraste-o para a sua página.
A partir daí, você pode editar o número de colunas, adicionar paginação e ajustar outras configurações nos menus suspensos.
Nesse ponto, é uma boa ideia arrastar o bloco do título e alterá-lo para algo como "Popular Products" (Produtos populares). Dessa forma, as pessoas saberão exatamente o que estão vendo.
Avaliações e depoimentos
Quando se trata de prova social, avaliações e depoimentos, todos eles contribuem para aumentar as chances de os clientes comprarem seus produtos do WooCommerce. A razão para isso é que isso garante às pessoas que outras pessoas confiam em seus produtos e que elas estão tomando a decisão certa.
Então, por que não incluir algumas avaliações, depoimentos e classificações por estrelas em sua página de checkout?
Você pode fazer isso facilmente com o SeedProd. Basta acessar os blocos Advanced e arrastar o bloco Testimonials para sua página de checkout.
Nas configurações, você pode personalizar completamente o bloco. Por exemplo, você pode adicionar uma foto de depoimento ou um título de trabalho e até mesmo transformá-lo em um carrossel de rolagem com vários depoimentos.
Além disso, você pode adicionar ainda mais provas sociais usando o bloco de classificação por estrelas abaixo do depoimento.
Etapa 4: publique sua página de checkout do WordPress
Quando estiver satisfeito com sua página, vamos ver como ela fica no celular. Afinal, muitas pessoas fazem compras em seus dispositivos móveis hoje em dia, portanto, garantir que tudo esteja otimizado para usuários móveis é fundamental para aumentar as vendas.
Felizmente, o SeedProd tem um recurso que permite que você visualize facilmente o checkout do WordPress no celular. Basta clicar no ícone de celular na barra de navegação inferior.
Em seguida, você poderá ver a configuração da sua página como qualquer usuário de celular faria. A partir daí, você pode fazer ajustes para melhorar a experiência do usuário.
Quando estiver satisfeito com a aparência de tudo, clique na seta suspensa ao lado do botão verde Save (Salvar ) e clique em Publish (Publicar ) para ativar sua página de checkout.
Em vez da página de checkout padrão do WooCommerce, agora você tem uma página de checkout do WordPress de alta conversão adaptada ao seu público.
Etapa 5: Atribua sua página de checkout ao WooCommerce
A etapa final deste guia é atribuir sua nova página de checkout do WordPress ao WooCommerce. Isso envolve alterar as configurações padrão do WooCommerce e adicionar o URL da sua nova página.
A alteração do URL faz com que seus clientes acessem automaticamente sua nova página de checkout do WordPress em vez da opção padrão.
Para definir essa configuração, vá para WooCommerce " Settings e clique na guia Advanced (Avançado ). Em seguida, ao lado do título Checkout Page (Página de checkout ), procure a página que você acabou de criar.
Ao encontrá-la na lista suspensa, clique nela para atribuí-la como sua página oficial de checkout. Certifique-se de clicar em Save Changes (Salvar alterações) na parte inferior da tela para preservar suas configurações.
Agora, quando um visitante clicar em "Prosseguir para o checkout", ele será direcionado para a nova tela de checkout de alta conversão que você acabou de criar.
Perguntas frequentes sobre a criação de uma página de checkout no WordPress
Crie seu checkout personalizado no WordPress
A criação de uma página de checkout personalizada no WordPress vai além do design. Ela torna o processo de compra claro, rápido e personalizado para sua loja, de modo que mais compradores concluam seus pedidos.
Com o SeedProd e sua integração com o WooCommerce, você pode criar uma página de checkout que combine com sua marca, remova distrações e adicione recursos que criam confiança e aumentam as vendas sem escrever código.
Configure sua página personalizada hoje mesmo e transforme mais visitantes em clientes pagantes.
Se estiver procurando mais dicas sobre o WooCommerce, confira estas publicações:
- Como habilitar o modo de manutenção para páginas de lojas do WooCommerce
- Como acelerar sua loja WooCommerce (em 7 etapas fáceis)
- Como configurar o rastreamento de conversões do WooCommerce para sua loja
Enquanto estiver aqui, não se esqueça de nos seguir no Twitter, no YouTube e no Facebook para obter mais conteúdo útil para expandir seus negócios.
