Projete suas categorias de produtos WooCommerce com Elementor

Elementor é um excelente construtor de páginas WordPress para aprimorar a funcionalidade padrão do construtor WordPress adicionando novos recursos.

Se você se lembra, as primeiras versões do WordPress não eram particularmente fáceis de usar. Além de ter funcionalidade limitada, era necessário contar com temas WordPress pré-fabricados para criar um design básico para o seu site. Porém, para muitos usuários, a funcionalidade básica dos temas WordPress era insuficiente, sendo necessária a instalação de plugin ou a edição manual do código do tema.

• Combinação WooCommerce e Elementor
• Criando página de categoria no Elementor
• Configurações de layout

Elementor é um construtor baseado em blocos semelhante ao WordPress, mas é muito mais avançado que o construtor WordPress por ser mais intuitivo, responsivo e rico em recursos. Mais importante ainda, você pode criar um site fantástico sem precisar escrever uma linha de código!!

Combinação WooCommerce e Elementor

WP-WooCommerce e Elementor são dois dos plugin WordPress mais usados ​​disponíveis atualmente. A quantidade de flexibilidade e o grande número de recursos que cada um deles oferece são simplesmente inestimáveis. Se você administra uma loja de comércio eletrônico, WooCommerce é o melhor plugin para quase todas as necessidades que você possa ter. É o plugin mais completo disponível para praticamente qualquer necessidade.

Além disso, Elementor é um dos construtores de sites de arrastar e soltar mais eficazes disponíveis no mercado. Ele oferece a capacidade de projetar, personalizar e fornecer rapidamente praticamente qualquer página do seu site. Ainda mais, recursos estão disponíveis, como a criação de mega menus e o acesso a uma ampla variedade de complementos e modelos altamente convenientes. Com a ajuda do WooCommerce e do Elementor, você pode projetar e construir páginas de Loja e Negócios de qualidade profissional com o mínimo de despesas e esforço possíveis. Com a ajuda do Elementor, você pode personalizar completamente os layouts da sua loja, grades de produtos e carrosséis, bem como escolher entre uma variedade de belos layouts. Também está disponível a capacidade de configurar e personalizar suas páginas de checkout e carrinho, bem como integrá-las a uma variedade de opções e recursos de pagamento para oferecer maior comodidade aos seus clientes.

Além disso, você pode criar páginas e designs personalizados para produtos digitais, incluir opções de páginas personalizadas para envio e pagamentos e páginas de pós e pré-compra, entre outras coisas. Tudo isso contribui para que o site da sua empresa pareça profissional e fácil de usar. Junto com os botões de call to action fáceis de usar, controles deslizantes prontos para paralaxe e uma série de outros recursos, você pode integrar a funcionalidade WooCommerce ao seu site. O grande número de oportunidades disponíveis é praticamente ilimitado. Agora, se você estiver suficientemente convencido, deixe-nos orientá-lo no processo de colocar seu plano em ação. Você pode fazer uma variedade de coisas para tornar sua página da Loja mais acolhedora, e o objetivo é que essas etapas o ajudem a criar uma página da Loja mais acolhedora para sua loja WooCommerce.

Criando página de categoria WooCommerce no Elementor

Se você está familiarizado com o WooCommerce, sabe que as categorias de produtos são fundamentais na organização de seus produtos para exibição adequada e acesso pelos clientes – quanto mais rapidamente eles encontrarem o que procuram, melhor. Mas o que exatamente são categorias de produtos?

Os clientes passam uma quantidade significativa de tempo navegando pelos seus produtos na página da sua loja, por isso devem ter uma experiência positiva. Não há nada mais frustrante do que navegar por dezenas de páginas para ver os produtos no site da sua loja.

Como resultado, a categorização é essencial para proporcionar aos seus clientes uma melhor experiência de compra. Os clientes acharão mais fácil classificar e filtrar suas preferências se houver uma seção bem organizada e organizada para todos os tipos de itens, como roupas ou sapatos. Adicionar elementos de geração de leads, como botões de call to action, seções de produtos em destaque, pop-ups para vendas ou ofertas e outros componentes semelhantes a esta seção pode torná-la mais atraente para os visitantes.

Se você tem uma loja WooCommerce e deseja reformulá-la, este tutorial é exatamente o que você precisa para começar.

Muitos temas WooCommerce incluem um layout padrão para categorias de produtos, que pode ou não ser o mais adequado às suas necessidades de negócios. Embora esses padrões possam consistir em alguns recursos úteis, eles não podem ser personalizados com frequência.

Vamos ao que interessa.
Depois de configurar seu produto, você precisa fazer o seguinte antes de publicá-lo para que ele apareça em uma categoria:

Você definirá as condições que determinarão onde seu modelo de produto aparecerá durante esta fase. Quando você usa um modelo, ele se aplica automaticamente a todas as páginas de produtos do seu site. Você também pode restringir sua pesquisa a uma categoria específica de produto.

Clique em Publicar e seu único produto já estará disponível para compra!

Ainda não terminamos. O que acabamos de fazer não é suficiente para colocar as categorias no ar em nosso site; para ativar as categorias em todas ou algumas páginas do nosso site, ainda precisamos configurar algumas coisas.
Para concluir a tarefa, crie uma página de catálogo de produtos que afetará todos os produtos ou uma página de catálogo que afetará uma categoria específica de produtos. Para fazer isso, primeiro retorne ao Elementor > Meus modelos e crie um modelo de arquivo de produto. Em seguida, escolha um modelo existente ou crie um novo.
Personalize a aparência do widget Archive Products e do widget Archive Title adicionando-os à sua página.

Use a funcionalidade de estilo de cópia entre páginas para personalizá-lo para corresponder ao design que você já criou para seu modelo de produto único e, em seguida, salve suas alterações. Retorne à página do produto e selecione Copiar no menu suspenso. Clique com o botão direito em Colar estilo quando estiver de volta ao produto de arquivo.
Escolha Produtos mais recentes no menu suspenso Consulta > Fontes nas configurações de Arquivar produtos. Em seguida, selecione anéis no menu suspenso Categoria de produto. Somente a categoria do anel será exibida desta maneira.
Se você tiver uma longa lista de produtos para uma categoria específica, ative a paginação.
Você pode personalizar a distância entre as colunas e as linhas selecionando a guia estilo. Altere as cores, fontes e outros aspectos do design.

Pré-publicação, selecione as condições que determinam onde o arquivo aparecerá, assim como você fez para o modelo de produto único, e depois publique.

Depois de clicar em “publicar”, sua página de arquivo estará ativa.

Elementor pro oferece a possibilidade de projetar categorias de produtos totalmente limpas com sua panóplia de opções;

Você pode fazer o seguinte com as opções disponíveis no Elementor Pro:

Configurações de layout para categorias de produtos WooCommerce

• Colunas: Defina o número exato de colunas a serem exibidas, de 1 a 12
• Contagem de categorias: selecione o número de categorias a serem exibidas

Configurações de consulta

• Fonte: selecione a fonte a partir da qual as categorias serão exibidas, escolhendo entre Todas, Seleção manual, Por pai ou Subcategorias atuais. Se a Seleção Manual for escolhida, selecione manualmente quais categorias exibir. Se “Por pai” for escolhido, selecione Somente nível superior ou selecione uma categoria individual na lista suspensa.
• Ocultar vazio: defina como Sim para categorias sem produtos dentro delas
• Ordenar por: Defina a ordem em que as categorias serão exibidas. As opções incluem Nome, Slug, Descrição ou Contagem
• Ordem: selecione para exibir categorias em ordem ASC ou DESC (crescente ou decrescente).

Configurações de estilo

• Lacuna entre colunas: defina a lacuna exata entre as colunas
• Espaço entre linhas: defina o espaço exato entre as linhas
• Alinhamento: Alinhe os dados dos produtos à esquerda, à direita ou ao centro

Configurações de imagem

• Tipo de borda: selecione o tipo de borda, escolhendo entre nenhuma, sólida, dupla, pontilhada, tracejada ou ranhurada
• Raio da Borda: Defina o raio para controlar a redondeza do canto da borda
• Espaçamento: ajuste a quantidade de espaço entre as imagens e seus dados

Configurações de título

• Cor: Escolha a cor do título
• Tipografia: Defina as opções de tipografia para o texto do título

Configurações de contagem

• Cor: Escolha a cor para a Contagem
• Tipografia: Defina opções de tipografia para o Count

Conclusão

O WooCommerce Builder no Elementor fornece a flexibilidade de design necessária para criar e ajustar visualmente suas páginas de produtos. O tempo que leva para passar de uma ideia a uma vida, e totalmente A loja online funcional WooCommerce é significativamente reduzida como resultado da economia de seu tempo. No geral, personalizar a página da sua loja WooCommerce com Elementor tem o potencial de impactar significativamente o desempenho geral do seu site. Você pode ajudar ou atrapalhar as vendas organizando e exibindo seus produtos da melhor maneira possível para que os clientes os vejam e comprem. A configuração e personalização da sua página da loja WooCommerce no Elementor serão demonstradas através das etapas deste guia. No entanto, tenha em mente que esta é apenas a ponta do iceberg em termos da extensão do problema. Uma introdução ao uso do Elementor para criar a página de loja ideal para sua loja é demonstrada nesta demonstração básica. Use isso como ponto de partida e experimente para tirar o máximo proveito deste fantástico construtor de páginas