Destaque do plug-in Divi: Divi BodyCommerce

Divi BodyCommerce é um plugin de terceiros para Divi que lhe dá controle sobre o design de sua loja, desde a página do produto até a página de pagamento e tudo mais. Ele foi projetado com conversões em mente e oferece controle total sobre o design da sua loja usando o Divi Builder.

Quando um plugin oferece tantos módulos e recursos quanto este, eles tendem a se tornar opressores de usar. No entanto, isso não foi um problema com este, pois tudo é fácil de seguir e há mais vídeos passo a passo do que qualquer plug-in que já vi. Neste artigo, vamos dar uma olhada no Divi BodyCommerce e ver o que ele pode fazer e como é fácil de usar.

Instalação e configurações do Divi BodyCommerce

Faça upload e ative o plugin normalmente. Para ativar a licença, vá para Divi Engine > Licença BodyCommerce no menu do painel.

Clicar em BodyCommerce no menu do painel abre as configurações. Esses são os mesmos tipos de configurações que você esperaria ver no WooCommerce. Aqui, você pode selecionar suas páginas. Depois de criar os layouts para essas páginas, acesse esta página de configurações e selecione-os. Você também pode definir as páginas com largura total e escolher um modelo de produto diferente para cada categoria.

Módulos Divi BodyCommerce

53 novos módulos são adicionados ao Divi Builder. Esses são todos os elementos de que você precisa para projetar cada aspecto de sua loja WooCommerce, incluindo páginas de produtos, páginas de contas, páginas de arquivo, carrinho de compras, etc. Eles são codificados por cores para que você não possa perdê-los. As cores realmente mostram para que servem os módulos. Por exemplo, os módulos vermelhos são para as páginas do produto. Alguns usam um gradiente para mostrar que funcionam com dois tipos de páginas. Esta imagem mostra os primeiros 24 módulos.

Aqui estão os próximos 29 módulos. Os módulos adicionam elementos de página, como vendas crescentes, vendas cruzadas, controles deslizantes, produtos relacionados, carrosséis, galerias, compartilhamento, guias, migalhas de pão e muito mais. Os loops criam listas de produtos para construir as páginas da sua loja. Eles incluem as guias e opções esperadas de Conteúdo, Design e Avançado.

Nota - Se uma página não carregar, certifique-se de que você não está usando um módulo na página que não foi projetado para funcionar nela. Alguns módulos são globais e funcionam com qualquer página, mas outros são destinados a tipos específicos de páginas. Por exemplo, você não pode usar um módulo de página de produto em uma página de loop.

Criação e atribuição de uma página

Vejamos como criar a página e defini-la como padrão para essa categoria. Primeiro, crie o layout na Biblioteca Divi.

Em seguida, vá para Divi Engine > BodyCommerce no menu do painel. Selecione a guia para o tipo de página que você está criando e escolha o layout dessa página. Você pode criar quantos layouts desejar e usá-los para diferentes tipos de páginas e para categorias individuais.

Exemplos Divi BodyCommerce

Aqui estão alguns exemplos que criei. Esta é apenas uma pequena amostra do que pode ser feito com este plugin.

Página da loja Divi BodyCommerce

Para a página da loja, acabei de adicionar um módulo de páginas de arquivo de loop de produto.

Esta é a página com as configurações padrão. Cada um dos elementos pode ser ajustado com o Divi Builder.

Aqui está dentro do layout Tea Shop. Estas são as configurações padrão, com exceção do limite. Eu o configurei para mostrar 6 produtos.

Você pode ajustar alguns dos elementos ao vivo.

Adicionei fundos verdes ao emblema de venda e botões, configurei o layout para mostrar 6 colunas, adicionei uma sombra de caixa aos produtos e adicionei uma sobreposição verde. Estou impressionado com o número de opções de layout.

Este é o layout do estilo do blog. Ficaria ótimo se você tivesse descrições de produtos mais longas.

Página de produto Divi BodyCommerce

Eu criei um layout de página de produto na Biblioteca Divi e o selecionei como o layout padrão nas configurações do BodyCommerce. Este é apenas um layout básico para se ter uma ideia do que os módulos podem fazer.

É simples, mas é um bom lugar para começar. Mostra o título, a galeria e o controle deslizante do produto.

Joguei mais algumas páginas de produtos e módulos globais aleatoriamente.

Está começando a mostrar o tipo de coisas que podem ser feitas com BodyCommerce. Vamos fazer um pouco de Divi nesta página.

Aqui estão alguns ajustes simples com o Divi Builder. Tudo o que fiz foi adicionar um fundo à seção e linha e ajustar as bordas dos botões e do campo de pesquisa.

Neste, adicionei uma nova linha para produtos relacionados e movi o módulo de pesquisa para essa linha. Eu também mudei o layout do produto e mudei a imagem do produto para uma galeria. Eu tenho definido para rolagem vertical. Se a demonstração do WooCommerce tivesse mais imagens para este produto, elas seriam exibidas em uma coluna vertical à esquerda. Isso é apenas arranhar a superfície do nível de ajustes que podem ser feitos com as páginas de produtos.

Divi BodyCommerce Shopping Cart

Estou criando uma página de carrinho de compras usando a página de contato no layout Padaria. Estou usando os módulos Produtos do carrinho e Totais do carrinho. Eles não exibem seu conteúdo quando visualizados no Visual Builder, mas você ainda pode criar no Visual Builder. Os módulos oferecem muitos outros recursos, como venda cruzada.

Aqui está o carrinho de compras usando as configurações padrão. Eu tenho os dois módulos em um único layout de 2 colunas.

Aqui está a página do carrinho de compras após algumas alterações. Mudei para um layout de coluna única, adicionei algum espaçamento à direita e à esquerda, adicionei uma cor de fundo do layout, alterei as cores dos botões e do texto para combinar com o layout e adicionei uma sombra de caixa.

Documentação Divi BodyCommerce

A documentação é fornecida por escrito no site do desenvolvedor e com uma série de vídeos no YouTube. Eu gosto que inclua ambos. Os links são fornecidos no menu do painel do Divi Engine. Você também pode ver os vídeos clicando em qualquer um dos recursos no site do desenvolvedor. Isso cria uma estrutura interessante para encontrar os vídeos de que você precisa. Foi assim que encontrei os vídeos que queria ver.

Preço Divi BodyCommerce

BodyCommerce tem três licenças para escolher:

• 1 site - £ 24
• 5 sites - £ 50
• Sites ilimitados - £ 96

Você pode comprar BodyCommerce no site do desenvolvedor.

Reflexões finais

Divi BodyCommerce oferece um nível impressionante de controle sobre os designs de página e produto WooCommerce. Eu mal toquei no que ele pode fazer. Você também pode personalizar a tela de login, emblemas, páginas da conta, páginas de agradecimento, formulários, páginas de pesquisa e muito mais. Inclui até modelos de e-mail, ícones personalizados, amostras e AJAX para o carrinho de compras. Gosto de poder criar um layout diferente para cada categoria.

Os módulos e o layout eram fáceis de usar. Acompanhei os vídeos na página do desenvolvedor para criar meus exemplos. Os vídeos eram detalhados e fáceis de acompanhar. Não tive problemas para criar qualquer tipo de página que queria.

BodyCommerce oferece mais ferramentas e personalizações do que qualquer plugin WooCommerce / Divi que eu já vi até agora. Se você usa WooCommerce com Divi e deseja personalizar suas páginas WooCommerce, BodyCommerce é uma escolha fácil.

Nós queremos ouvir de você. Você já experimentou BodyCommerce for Divi e WooCommerce? Deixe-nos saber o que você pensa sobre isso nos comentários.

Imagem em destaque via Letters-Shmetters / shutterstock.com