Como projetar carrinho WooCommerce no Elementor [sem codificação]

Publicados: 2022-01-11

Seus clientes estão abandonando o carrinho WooCommerce no meio da compra? Você sabia que um motivo extremamente comum por trás disso pode ser uma página de carrinho desorganizada que os usuários acham confuso para comprar? Mas não precisa mais se preocupar; com a atualização mais recente do Essential Addons for Elementor , apresentamos a solução mais fácil para reduzir as taxas de abandono de carrinho e aumentar as vendas.

WooCommerce cart

Neste blog, vamos orientá-lo pelas razões pelas quais o design personalizado da página do carrinho WooCommerce no site da sua loja é a melhor abordagem a ser adotada. Mas não apenas isso, também apresentaremos nosso mais novo elemento Essential Addons criado apenas para ajudá-lo a criar seu carrinho projetado profissionalmente que certamente trará vendas. Então, sem mais delongas, vamos mergulhar e descobrir mais.

Por que você deve criar uma página personalizada do carrinho WooCommerce?

Pesquisas mostram que quase 7 em cada 10 clientes abandonarão seu carrinho de compras e nunca mais voltarão, mesmo que estejam satisfeitos com os produtos que você está vendendo. E, como mencionamos no início, uma das principais razões para isso é uma página de carrinho confusa ou desordenada pela qual os clientes não conseguiram navegar.

Às vezes, seus clientes em potencial podem não conseguir voltar à página de compras e adicionar outros produtos de que precisam. Enquanto em outros momentos, pode ser um problema anexar um código de cupom de vendas que eles esperavam usar. Os compradores podem até ficar frustrados quando não conseguem adicionar mais quantidades do mesmo produto depois de já estarem na página do carrinho do WooCommerce .

WooCommerce cart

E, compreensivelmente, pode ser bastante decepcionante fornecer produtos e serviços excelentes e, ainda assim, observar altas taxas de abandono de carrinho – especialmente se for devido a problemas simples de design de página. Mas suas preocupações estão prestes a terminar, com a versão mais recente de nossa equipe de complementos essenciais para Elementor . Leia mais para descobrir como você pode facilmente aumentar as vendas com uma página de carrinho de comércio eletrônico incrivelmente projetada e com aparência profissional no Elementor .

Projete um carrinho WooCommerce profissional com complementos essenciais 5.0

O ano de 2021 foi um ano incrível para nossa equipe de Essential Addons para Elementor. Alcançamos os maiores marcos e crescemos mais rápido do que jamais havíamos sonhado. E é tudo graças a você. Portanto, para terminar o ano com a mesma nota e fornecer a melhor experiência de construção da web, trazemos para você nossa última atualização Essential Addons 5.0.

A versão mais recente vem com muitas melhorias, novos elementos e extensões para ajudar a liberar suas habilidades de web design no Element com total facilidade. E temos o prazer de informar que esta atualização também vem com um widget exclusivo – EA Woo Cart .

Este novo elemento incrível permite que você crie sem esforço uma página de carrinho de designer WooCommerce em sua loja usando o Elementor, em apenas alguns cliques e SEM CÓDIGO . Portanto, se você é novo no setor de comércio eletrônico ou um proprietário de loja experiente, pode usar facilmente este widget Essential Addons para converter potenciais compradores de vitrines em clientes pagantes.

E seu maior destaque é que ele é totalmente personalizável no Elementor e vem com muitos layouts de design diferentes para você escolher e combina exatamente com a estética da sua loja WooCommerce. Continue lendo para saber mais.

Configure um carrinho EA Woo suave no Elementor sem codificação

Escusado será dizer que você deve se certificar de que já instalou e configurou o plugin WooCommerce para construir sua loja com perfeição. Mas é importante neste caso porque para este widget avançado funcionar dentro do Elementor Editor, você precisa adicionar alguns produtos ao carrinho da sua loja WooCommerce. Feito isso, estamos prontos para usar sem esforço o widget EA Woo Cart em sua loja. Siga os passos abaixo para saber como:

Etapa 1: defina sua página de carrinho WooCommerce desejada

Em primeiro lugar, navegue até a página WooCommerce → Configurações diretamente do seu painel do WordPress e, em seguida, vá para a guia 'Avançado' . A partir daqui, você pode atribuir qualquer uma das páginas desejadas como sua nova página de carrinho.

Basta clicar na opção 'Página do carrinho' e escolher qualquer página do menu suspenso como sua página do carrinho WooCommerce, como você pode ver na imagem abaixo. Você estará pronto para ir.

WooCommerce cart

Passo 2: Edite o carrinho WooCommerce no Elementor

O próximo passo a seguir é editar sua página WooCommerce Cart usando o Elementor Editor em apenas alguns cliques. Mas antes que você possa fazer isso, você deve habilitar o elemento EA Woo Cart com Essential Addons for Elementor.

Certifique-se de ter instalado a versão mais recente do Essential Addons 5.0 PRO e, em seguida, vá para a guia 'Elements' na interface do usuário Essential Addons for Elementor. Você encontrará mais de 80 elementos disponíveis aqui, mas tudo o que você precisa fazer é alternar a opção ' EA Woo Cart ' e clicar em ' Salvar configurações ' para começar.

WooCommerce cart

Passo 3: Edite o carrinho WooCommerce no Elementor

Agora você está pronto para criar uma página de carrinho impressionante no Elementor. Então, basta acessar a página do carrinho do WooCommerce e clicar em ' editar com Elementor '.

Quando estiver no editor Elementor, encontre o elemento ' EA Woo Cart ' na opção 'Pesquisar' na guia 'Elementos' . Em seguida, basta arrastar e soltar o elemento 'EA Woo Cart' em qualquer seção desejada no Elementor Editor, conforme mostrado abaixo. É realmente tão fácil.

WooCommerce cart

Configure sem esforço cada aspecto do EA Woo Cart

Seu carrinho WooCommerce agora está definido, mas precisa ser estilizado e personalizado para parecer profissional e fácil de entender para seus clientes. E esta seção se concentrará em como você pode fazer isso com facilidade.

Etapa 1: definir as configurações gerais do EA Woo Cart

No painel lateral do Elementor Editor, você encontrará várias opções, como 'Configurações gerais' , 'Construtor de tabelas' ou 'Componentes do carrinho' na guia 'Configurações de conteúdo'.

Nas 'Configurações Gerais' , você encontrará 2 estilos diferentes de layouts para o seu EA Woo Cart para escolher e personalizar ao seu gosto, conforme mostrado abaixo.

WooCommerce cart

Etapa 2: alterar os rótulos do construtor de tabelas

Em seguida, no ' Table Builder ', você pode alterar os rótulos das tabelas e arrastar seções para reorganizar sua tabela de preços do EA Woo Cart. Isso lhe dá total flexibilidade para alterar todos os rótulos de todas as colunas que você adicionou à página do carrinho - 'produto', 'preço', 'quantidade' etc.

WooCommerce cart

Etapa 3: personalize o recurso do componente do carrinho

E então, passamos para a seção ' Componente do carrinho ', onde você pode simplesmente alternar ' Botão de atualização do carrinho ' para permitir que seus clientes adicionem mais produtos ao carrinho.

Mas não apenas isso, você também pode alternar o ' Formulário de cupom ' para permitir que os clientes adicionem facilmente qualquer cupom que desejarem no momento do checkout na página do carrinho do WooCommerce. Além disso, você também pode ativar a opção ' Continuar comprando ' para ajudar os clientes a retornar à página da loja novamente para comprar mais. Além disso, você pode até alterar o texto do 'Botão Checkout' nesta seção e tornar sua chamada para ação mais interativa.

WooCommerce cart

Todos esses botões e opções ajudarão seus clientes a entender completamente a página do carrinho do WooCommerce e também navegar por essa página com facilidade. E assim, com o widget EA Woo Cart, você pode reduzir instantaneamente o abandono de carrinho e as taxas de rejeição de uma só vez.

Personalize totalmente o estilo do carrinho EA Woo em poucos cliques

E, finalmente, depois de configurar o conteúdo para a página do EA Woo Cart , é hora de estilizá-lo para corresponder ao seu site WooCommerce ou à estética da marca. E para fazer isso, você pode simplesmente clicar na guia 'Estilo' do editor Elementor para personalizar diferentes áreas da sua página.

Etapa 1: estilizar as configurações gerais

Na seção 'Geral' , você pode alterar a cor de fundo de toda a seção EA Woo Cart. Você poderá ajustar a cor do fundo do EA Woo Cart manualmente ou escolher cores globais.

WooCommerce cart

Etapa 2: Entre nos detalhes com a seção Tabela

Na seção 'Tabela', você pode alterar o preenchimento, margem, tipografia, tipo de borda e assim por diante de toda a seção do carrinho. Eventualmente, fará com que sua página do EA Woo Cart se destaque de outras lojas WooCommerce e pareça completamente personalizada.

Etapa 3: alterar outros aspectos do design

Mas isso não é tudo. Da mesma forma, você pode alterar a aparência de ' Total do carrinho ', ' Formulário de cupom' , ' Continuar comprando ', 'Botão' e 'Aviso' . Você pode mesmo mudar os textos para dentro também.

WooCommerce cart

Para adicionar mais funcionalidades e tornar sua página do EA Woo Cart mais interativa e atraente, você também pode explorar as opções de configuração 'Avançadas' .

WooCommerce cart

Uma página de carrinho WooCommerce com aparência profissional

E é isso. Com essas pequenas etapas e fácil personalização, você pode criar facilmente uma impressionante página de carrinho WooCommerce para o seu site, conforme sua preferência. Isso também, sem usar uma única linha de codificação.

Confira o resultado final abaixo e veja como sua página de carrinho de designer com aparência profissional no WooCommerce com a ajuda do widget Premium Essential Addons EA Woo Cart.

WooCommerce cart

Outros widgets exclusivos para sua loja WooCommerce

E com isso, queremos concluir nosso guia definitivo sobre como projetar um carrinho WooCommerce no Elementor sem codificação e com total facilidade. Mas antes de sairmos, queremos informá-lo de todos os outros widgets do WooCommerce aos quais você tem acesso a partir de Essential Addons for Elementor.

Este excelente plugin traz um widget para melhorar todos os aspectos da sua loja WooCommerce em apenas alguns cliques. Existem mais 7 elementos que você pode analisar:

WooCommerce cart

Galeria de produtos Woo

Controle deslizante do produto Woo

Carrossel de produtos Woo

Grade de produtos Woo

Comparação de produtos Woo

Coleções de produtos Woo

Woo Checkout

Confira-os no site Essential Addons e aumente instantaneamente as vendas da sua loja WooCommerce com facilidade.

Atualize para Essential Addons 5.0 e aumente as vendas do WooCommerce

Então, o que você está esperando? Não espere! Atualize para Essential Addons 5.0 agora e junte-se a nós na criação de uma loja WooCommerce exclusiva e de alta conversão. Ou confira qualquer um dos nossos pacotes PRO , a partir de um preço exclusivo de apenas $ 39,97 , e aumente o tráfego, as vendas e as conversões usando todos os nossos recursos premium!

Se você tiver alguma sugestão, informe-nos nos comentários abaixo ou entre em contato com nossa equipe de suporte; ficaremos felizes em saber seu feedback. Para mais atualizações, tutoriais e dicas e truques, assine nosso blog ou participe de nossa amigável Comunidade do Facebook .