Precisa personalizar sua página de carrinho do WooCommerce?
O layout padrão do carrinho de compras do WooCommerce geralmente parece desajeitado e faz pouco para incentivar os clientes a concluir a compra. Uma página de carrinho bem projetada pode melhorar a experiência do usuário, reduzir o abandono do carrinho e aumentar suas vendas.
Neste tutorial, mostrarei passo a passo como personalizar sua página de carrinho do WooCommerce sem escrever uma única linha de código. Usaremos o SeedProd, o construtor de páginas de arrastar e soltar no qual confio para criar páginas de WooCommerce de alta conversão em minutos.
Etapas rápidas para personalizar a página do carrinho de compras do woocommerce:
Por que criar uma página de carrinho de compras personalizada do WooCommerce?
Você sabia que quase 70% dos clientes abandonam o carrinho de compras antes de concluir o checkout? O abandono do carrinho de compras custa às lojas on-line bilhões em vendas perdidas todos os anos.
Ao reservar um tempo para personalizar o layout da página do carrinho do WooCommerce, você pode corrigir muitos dos motivos pelos quais os clientes saem. Um design melhor pode criar confiança, destacar ofertas importantes e orientar os clientes para o botão de checkout em vez do botão de voltar.
Quando você edita sua página de carrinho do WooCommerce para melhorar a experiência do usuário, você está aproveitando ao máximo o tráfego que já tem. Mesmo pequenas melhorias podem reduzir drasticamente as taxas de abandono e aumentar a receita sem gastar mais em anúncios.
Aqui estão algumas maneiras de otimizar seu carrinho do WooCommerce para conversões:
- Ofereça frete grátis ou mostre o quanto os clientes estão próximos de se qualificar para ele
- Aplique descontos automáticos ou mostre claramente os campos de código de cupom
- Tornar os totais do carrinho fáceis de ler e entender
- Adicione sinais de confiança, como depoimentos, avaliações ou emblemas de segurança
- Use um botão de atualização do carrinho e garanta que ele seja fácil de encontrar no celular
Em geral, um design personalizado da página do carrinho do WooCommerce ajuda os clientes a se sentirem confiantes ao fazer o check-out e, por fim, gera mais vendas para a sua loja.
Então, como você personaliza as páginas de carrinho do WooCommerce? Vamos começar e descobrir.
Como personalizar a página do carrinho de compras do WooCommerce
Muitas pessoas usam plug-ins de carrinho de compras para otimizar as páginas do carrinho no WooCommerce. Mas achamos que a maneira mais fácil de personalizar seu carrinho é com um construtor de páginas do tipo arrastar e soltar, como o SeedProd.
O SeedProd é o melhor construtor de páginas do WordPress com suporte para sites do WooCommerce. Você pode usar esse plugin para criar uma página de carrinho de compras personalizada do WooCommerce sem escrever código.
O SeedProd oferece mais de 150 modelos de página de destino totalmente responsivos para você começar rapidamente. E com o editor visual, você pode personalizar sua página e ver as alterações em tempo real.
Além disso, com vários blocos e seções, você pode deixar a página do carrinho exatamente como deseja, sem precisar contratar um desenvolvedor.
Atualização: Agora você pode criar um tema personalizado do WooCommerce com o SeedProd, permitindo que você crie qualquer página do WooCommerce facilmente sem código.
Com isso em mente, siga estas etapas para criar uma página de carrinho de compras personalizada do WooCommerce com o SeedProd.
Etapa 1. Instalar e ativar o SeedProd
A primeira etapa é fazer o download de uma cópia do plug-in de página de destino do WordPress SeedProd.
Em seguida, instale e ative o plug-in em seu site do WordPress. Para obter ajuda com essa etapa, consulte este guia detalhado sobre a instalação de um plug-in do WordPress.
Observação: há uma versão gratuita do SeedProd que você pode usar. Mas, para este tutorial, usaremos a versão Elite para obter o suporte integrado ao WooCommerce de que precisamos.
Depois de ativar o SeedProd em seu site WordPress, acesse SeedProd " Settings e insira a chave de licença do produto.
Você pode encontrar a chave de licença do SeedProd no painel de controle da sua conta no site do SeedProd.
Etapa 2. Criar um novo modelo de página de carrinho do WooCommerce
Depois de ativar sua chave de licença, vá para SeedProd " Pages e clique no botão "Add New Landing Page" para criar sua página de carrinho.
A partir daí, você pode escolher um modelo de página de carrinho para usar como estrutura para seu design.
O SeedProd oferece centenas de modelos compatíveis com dispositivos móveis para vários setores, muitos dos quais você pode usar como modelos do WooCommerce. Portanto, quando você encontrar um modelo de que goste, passe o cursor sobre ele e clique no ícone "Checkmark" para iniciá-lo.
Para este guia, usaremos o "Modelo em branco". Esse modelo permite que você comece do zero e adicione apenas as seções e os blocos desejados.
Depois de escolher o modelo, uma janela pop-up será aberta para adicionar um nome e um URL à 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) para abrir o modelo no editor visual do SeedProd.
Etapa 3. Personalizar o layout e o design da página do carrinho
O construtor de páginas de arrastar e soltar do SeedProd tem um layout distinto de duas colunas que facilita o uso:
- À esquerda, há blocos e seções para personalizar seu design
- À direita, há uma visualização ao vivo de sua página
Adicionar conteúdo à página do carrinho é tão simples quanto arrastar um bloco da esquerda para a visualização à direita.
Vamos dar uma olhada em alguns dos elementos essenciais que você pode incluir na sua página de carrinho do WooCommerce.
Adição de um logotipo
Para adicionar um logotipo à sua página de carrinho, escolha um layout de seção que abrigue os elementos da página, como a seção padrão.
Em seguida, escolha o bloco "Image" (Imagem) e arraste-o para a nova seção à direita.
Clicar no bloco de imagens abre o painel de configurações de conteúdo, onde é possível carregar um logotipo do seu computador ou da biblioteca de mídia do WordPress.
A partir daí, você pode adicionar um link para sua página inicial, redimensionar seu logotipo e alterar o alinhamento.
Adição de um carrinho de compras do WooCommerce
Agora vamos adicionar seu carrinho de compras WooCommerce ao design. Para fazer isso, adicione uma nova seção ao design e escolha o layout da barra lateral de conteúdo.
Esse layout permite que você adicione seu carrinho na coluna maior e deixa espaço na coluna menor para avaliações, depoimentos e outras informações importantes.
Para adicionar o carrinho do WooCommerce à página, role para baixo até a seção de blocos do WooCommerce e arraste o bloco "Cart" para a nova seção.
Clicar no ícone de configurações do carrinho mostra um painel com configurações de personalização de cor, fonte e tamanho:
- Cabeçalhos
- Botões
- Campos
- Alerta
- Carrinho
Por exemplo, alteramos as cores dos botões para que se alinhassem melhor com a marca e o logotipo da nossa loja.
Adição de resenhas e depoimentos
Lembra-se da segunda coluna? Para este guia, usaremos essa coluna para mostrar depoimentos de clientes e classificações por estrelas.
Uma prova social como essa pode incentivar os compradores que estão prestes a finalizar a compra a concluir a venda. Afinal, as avaliações positivas de clientes reais são muito mais convincentes do que acreditar na palavra de uma marca.
Para adicionar depoimentos à sua página de carrinho de compras do WooCommerce, localize o bloco Testimonials (Depoimentos) no cabeçalho de blocos "Advanced" (Avançado) e arraste-o para a coluna estreita à direita.
E, como todos os blocos do SeedProd, clicar nele mostra as configurações para personalizar o conteúdo do depoimento. Por exemplo, você pode adicionar uma foto de rosto personalizada e o nome do cliente, alterar o alinhamento e até mesmo adicionar várias avaliações em um carrossel de depoimentos.
Para tornar suas avaliações ainda mais convincentes, você pode arrastar o bloco de classificação por estrelas e colocá-lo sob o carrossel de depoimentos.
Adicionando escassez e urgência
Uma das melhores maneiras de levar clientes em potencial ao checkout do WooCommerce é criar um senso de urgência. Portanto, se os compradores não agirem agora, eles podem perder uma oferta interessante.
A maneira mais fácil de adicionar escassez à sua página de carrinho do WooCommerce é com um cronômetro de escassez ou um relógio de contagem regressiva. E o SeedProd tem essa opção incorporada.
Tudo o que você precisa fazer é selecionar o bloco "Countdown Timer" na seção de blocos "Advanced" e arrastá-lo para a parte superior do carrinho. Em seguida, selecione a opção "Visitor Timer" para que o cronômetro seja atualizado para cada visitante.
Em seguida, na guia Advanced settings (Configurações avançadas), você pode personalizar as cores para combinar com o restante do carrinho.
Agora vamos adicionar um título informando às pessoas que elas têm um tempo definido até que o carrinho expire. Para fazer isso, arraste o bloco "Headline" (Título) e digite o texto.
Venda cruzada de produtos do WooCommerce
Sua página de carrinho do WooCommerce é um excelente lugar para promover e recomendar outros produtos ou serviços. Dessa forma, você pode atrair os compradores antes de finalizar a compra com produtos relevantes que eles podem gostar.
E a boa notícia é que o SeedProd oferece várias grades de produtos diferentes que permitem que você exiba os produtos em qualquer página. Para encontrá-las, vá até a seção de blocos "WooCommerce" e escolha uma delas:
- Produtos recentes
- Produtos em promoção
- Produtos mais vendidos
- Produtos em destaque
- Produtos com as melhores classificações
Por exemplo, você pode arrastar o bloco "Sale Products" e adicioná-lo logo abaixo do carrinho do WooCommerce. Dessa forma, os compradores têm a chance de adicioná-los aos seus carrinhos antes de finalizar a compra.
Etapa 4. Publique e vincule sua nova página de carrinho
Depois de fazer alterações em sua página do carrinho, é hora de publicá-la e torná-la ativa em sua loja WooCommerce. Para fazer isso, clique na seta suspensa ao lado do botão verde Save (Salvar) e selecione Publish (Publicar).
Em seguida, a tarefa final é ajustar o URL do carrinho nas configurações do plug-in WooCommerce. Portanto, navegue até WooCommerce " Settings e clique na guia Advanced (Avançado).
Em seguida, ao lado do título "Cart Page" (Página do carrinho), selecione a nova página do carrinho que você criou com o SeedProd. Lembre-se de clicar no botão Save Changes (Salvar alterações) na parte inferior da tela.
Agora, quando os compradores clicarem no link "View Cart" (Exibir carrinho) em seu site, eles verão sua nova página de carrinho personalizada do WooCommerce.
Perguntas frequentes sobre a personalização da página do carrinho de compras do WooCommerce
Personalizar sua página de carrinho do WooCommerce é uma das maneiras mais rápidas de reduzir o abandono de carrinho e aumentar as vendas. Ao melhorar o layout, adicionar sinais de confiança e remover atritos, você pode transformar mais compradores em clientes pagantes.
Com o SeedProd, você pode editar o design da página do carrinho do WooCommerce sem tocar em uma única linha de código. Seu construtor de arrastar e soltar facilita a criação de uma página de carrinho totalmente personalizada e otimizada para conversões.
Se quiser rastrear as conversões de carrinho do WooCommerce, consulte nossa postagem sobre como configurar o rastreamento de conversões do WooCommerce e este guia sobre como corrigir o problema do carrinho de visualização do WooCommerce que não funciona.
Obrigado pela leitura. Se você gostou deste artigo, siga-nos no YouTube, no Twitter e no Facebook para obter mais conteúdo útil para expandir seus negócios.
