Como criar um mini carrinho WooCommerce 2023

Atualizado em 13 de noviembre de 2023

Você está procurando uma maneira fácil para configurar um mini carrinho WooCommerce ? Se a sua experiência de checkout for lenta e repetitiva, isso poderá afetar a experiência de compra do seu cliente. Melhorar seu fluxo de checkout é parte integrante para melhorar suas conversões de leads e um minicarrinho pode ser uma ótima solução para isso.

Então, para ajudá-lo a adicionar um ao seu site, aqui está um guia sobre como criar um mini carrinho WooCommerce. Mas primeiro, vamos dar uma olhada no que é exatamente um minicarrinho e por que você pode precisar usá-lo.

Seu carrinho WooCommerce Mini é apenas uma pequena forma da página real do carrinho do WordPress. Ele contém os produtos adicionados ao seu carrinho junto com mais alguns detalhes. O conteúdo do minicarrinho depende do seu tema WordPress ativo, mas geralmente inclui:

  • Sua lista de produtos
  • Subtotal
  • Miniaturas de produtos
  • Quantidade de produto

Quaisquer que sejam os detalhes exibidos pelo minicarrinho WooCommerce, eles são uma parte crucial da experiência do usuário do cliente enquanto navega em sua loja WooCommerce. É uma ferramenta acessível que seus clientes podem usar para acessar a página de checkout diretamente de qualquer lugar do seu site e ajuda a controlar os itens do carrinho.

Usamos até o mini carrinho no QuadLayers. Se você adicionar um produto ao carrinho, poderá ver o mini carrinho passando o mouse sobre o ícone do carrinho no menu do cabeçalho.

Se você olhar a captura de tela abaixo, adicionamos o produto WooCommerce Checkout Manager ao carrinho. Isso também é exibido no minicarrinho junto com a quantidade e o subtotal.

Por que criar um mini carrinho para o seu site WooCommerce?

Por padrão, seu tema WooCommerce pode vir com seu próprio minicarrinho WooCommerce. E mesmo se você fizer isso, sua posição e estilo podem não ser totalmente personalizáveis ​​nas configurações do tema. Além disso, você pode não estar no local perfeito para o seu mini carrinho.

Alguns de nossos leitores podem considerar adicionar um minicarrinho flutuante, enquanto outros podem adicioná-lo à barra lateral ou ao rodapé. Existem várias abordagens possíveis que você pode considerar usar. Além disso, você também pode precisar adicionar mais conteúdo, como preços de frete, detalhes adicionais do carrinho, mensagens personalizadas e muito mais.

A facilidade de conforto ao utilizar seu carrinho também pode ser importante para você e seus clientes melhorarem seu vendas reais . Um checkout personalizado e pronto para vendas que combina perfeitamente com a estética do seu site pode ser uma virada de jogo para o seu site WooCommerce. Portanto, se você deseja criar e adicionar seu mini carrinho personalizado a diferentes páginas do seu site, não procure mais!

Como criar um mini carrinho WooCommerce no WordPress

Para criar e adicionar seu carrinho WooCommerce Mini , Você pode usar 3 métodos diferentes :

  1. Adicionar um widget de carrinho
  2. Use um plug-in WordPress
  3. Programaticamente

Vamos dar uma olhada em cada método e nas etapas envolvidas em todos eles, começando com o método padrão de uso de widgets do WordPress.

1. Crie um mini carrinho WooCommerce usando widgets WordPress

Por padrão, você pode criar minicarrinhos WooCommerce usando widget de carrinho WooCommerce. Como estamos usando um widget, ele pode ser colocado apenas nas áreas de widgets disponíveis no tema. As áreas mais comuns incluem:

  • Barra lateral do widget
  • Abaixo do cabeçalho
  • Rodapés

Pode haver mais áreas de widgets dependendo do seu tema. Mas certifique-se de usar também um dos temas compatíveis com WooCommerce.

1.1. Selecione a área do widget

Para adicionar um widget de carrinho, primeiro você precisa selecionar uma área de widget. Então abra o painel de administração do WP e vá para Aparência > Widgets . Em seguida, escolha a área de widgets do seu mini carrinho.

Para nossa demonstração usaremos o Barra Lateral . Mas você pode usar a área de widget que for mais conveniente para você.

criar mini carrinho de woocommerce - página de widget

1.2. Adicionar widget de carrinho à área de widgets

Após selecionar a área do widget, clique no botão + botão para adicionar o widget. Use a barra de pesquisa para pesquisar Carrinho e clique nele para adicione o widget .

Se você não consegue ver o widget, certifique-se de ter configurado o WooCommerce corretamente em seu site.

Aqui você também pode ativar ou desativar a opção Ocultar se o carrinho estiver vazio. Recomendamos que você ative-o porque o carrinho da barra lateral ficará oculto se o carrinho do cliente estiver vazio. Isso também fará com que seu site pareça mais funcional.

criar mini carrinho woocommerce - captura de tela do carrinho adicionada

Assim que terminar de adicionar o widget do carrinho, atualizar seus widgets para salvar as alterações. Agora, o minicarrinho da barra lateral deve aparecer no front-end.

Como criar um mini carrinho WooCommerce 2023 -

Claro, você também pode adicionar seu minicarrinho a uma área de widget diferente. Basta selecionar o local abaixo da página do widget e você poderá facilmente adicionar o widget abaixo do cabeçalho ou rodapé.

criar mini carrinho woocommerce - carrinho de cabeçalho

Embora este seja o Caminho mais fácil Depois de criar seu mini carrinho WooCommerce, ele vem com um boa quantidade de limitações . Por um lado, não existem personalizações, vocêVocê está muito limitado em termos da aparência do seu minicarrinho e de como seus clientes o acessam.

As posições são limitadas às áreas de widgets fornecidas pelo seu tema. Além disso, recursos como mini carrinhos pop-up ou campos de carrinho personalizados também não estão disponíveis para os clientes ou para o proprietário do site.

2. Crie um mini carrinho WooCommerce usando um plug-in WordPress

Usar um plugin do WordPress é uma das maneiras mais fáceis de organizar sua experiência no carrinho. Você pode garantir que seus clientes possam pagar facilmente a qualquer momento com a ajuda de plug-ins. Eles também permitem que você simplifique a experiência de checkout do seu site.

Os plug-ins fornecem recursos interessantes para promover as vendas de seus produtos e melhorar a geração de leads. Por exemplo:

  • Você pode ativar ícones de carrinho flutuantes e pop-ups para que seus clientes possam acessá-los a qualquer momento, enquanto mantém o restante do conteúdo da loja limpo e sem distrações.
  • Muitos itens e produtos do carrinho podem ser adicionados ao mini carrinho. Por exemplo, informações adicionais do produto, alteração da quantidade, edição do subtotal do carrinho e exibição total e muito mais.
  • Com plug-ins, você pode adicionar alguns recursos inteligentes, como adicionar cupons diretamente, produtos em destaque dedicados e sugestões de produtos recomendados.

Para nossa demonstração, usaremos o plugin Carrinho Woocommerce tudo em um. É um dos melhores plugins para criar um mini carrinho no seu site. O plugin também é muito fácil de usar e possui todos os recursos que você precisa, como pop-up, carrinho de barra lateral ou opções de personalização de carrinho de menu.

2.1. Instale e ative o plugin

Vamos começar instalando e ativando o plugin.

Abre o teu Painel de administração WP e depois vá para Plug-ins > Adicionar novo na sua barra lateral.

Agora, precisamos configurar o plugin para habilitar seu mini carrinho WooCommerce.

2.2. Configure o carrinho tudo-em-um para o plugin WooCommerce

Para configurar o plugin do mini carrinho WooCommerce, clique no botão Guia Carrinho tudo-em-um na sua Painel de administração WP . Isso abrirá a página do painel do plugin.

crie um mini carrinho de woocommerce - tudo em um carrinho

Na versão gratuita do plugin, você pode ativar um mini carrinho Barra Lateral ou um mini carrinho de cardápio . Você também pode adicionar e configurar um botão AJAX Adicionar ao carrinho, mas vamos nos concentrar apenas nas opções do mini carrinho por enquanto.

Para ativar o pop-up do mini carrinho em seu site, abra o carrinho da barra lateral e clique Habilitar . Você também pode usar a opção Ativar celular para ativar/desativar o pop-up do mini carrinho em dispositivos móveis. Finalmente, salvar suas mudanças.

Como criar um mini carrinho WooCommerce 2023 -

Agora, recarregue o front-end do seu site. Você deverá ver o novo ícone do mini carrinho em sua página da web. Você pode simplesmente clicar nele para abrir seu mini carrinho.

Como criar um mini carrinho WooCommerce 2023 -

Além disso, você também pode adicionar um carrinho de cardápio para qualquer um dos seus menus. Basta abrir a aba Menu do carrinho e habilitá-lo como nas etapas anteriores. Você também pode habilitá-lo nos menus móveis, se necessário.

Em seguida, você precisa adicionar os menus do WordPress onde deseja exibir o carrinho de menus em seu site. Basta escolher os menus que deseja adicionar ao seu mini carrinho WooCommerce no campo Cardápios . Então clique Manter .

Como criar um mini carrinho WooCommerce 2023 -

Agora você deve ver o carrinho do mini menu em seu site. Ele será adicionado aos menus que você selecionou para o mini carrinho.

Como criar um mini carrinho WooCommerce 2023 -

23. Personalize seu mini carrinho WooCommerce usando o plugin

A personalização é uma característica fundamental do Plug-in Carrinho Tudo em Um . Você pode personalizar livremente o carrinho da barra lateral, bem como o carrinho do menu. Isso inclui cores, estilos, posições, animações personalizadas, ícones, estilos de menu da barra lateral e muito mais.

Para acessar as opções de personalização, vá para Aparência > Personalizar em seu painel de administração do WP. Você será redirecionado para o seu personalizador de tema. Aqui, clique Carrinho tudo-em-um para WooCommerce e você deverá ver todas as opções de personalização.

criar mini carrinho woocommerce – personalização do carrinho

Para esta demonstração, personalizaremos o carrinho da barra lateral. Então clique Carrinho lateral e você deverá ver todas as opções para isso. Por enquanto, vamos habilitar um mi nem carrinho menor usando a opção Mostre o conteúdo da barra lateral e mudaremos o posição do carrinho da barra lateral.

Mas você pode personalizar ainda mais usando essas opções, dependendo de como se adapta ao seu site. Ainda há muito o que editar, como interagir com o ícone do carrinho, para que o mini carrinho apareça ao passar o mouse sobre o ícone, personalizar o ícone de carregamento e muito mais.

criar mini carrinho woocommerce - estilo de personalização do carrinho

Depois de concluir suas alterações, clique em Publicar e salvá-los.

Vídeo tutorial:

Scroll al inicio