Como construir uma loja WooCommerce personalizada com OceanWP e conjunto de ferramentas (sem codificação)

Publicados: 2021-05-05

Você não precisa de codificação personalizada para criar uma loja online atraente com recursos avançados . Com o Toolset e o OceanWP, você pode criar páginas de produtos e lojas completamente personalizadas do zero com sua própria funcionalidade e estilo exclusivos - tudo sem necessidade de codificação.

Se você está construindo uma loja online, deve ter notado que os modelos padrão do WooCommerce e o tema do seu site decidem principalmente como será a aparência da sua loja. Você pode ter algumas opções que você pode ativar ou desativar, caso contrário, adicionar recursos avançados simplesmente não é possível sem programação personalizada.

Ou você pode criar uma loja WooCommerce completamente personalizada com Toolset e OceanWP e sem codificação.

Com o Toolset, você pode criar recursos que só vê nos principais sites de varejo. Ou você pode até imaginar seus próprios recursos e criá-los usando tipos e campos de postagem personalizados, relacionamentos de postagem, layouts personalizados e muito mais.

O OceanWP faz com que seu site tenha uma ótima aparência graças às suas amplas opções de estilo. Além disso, ele possui uma experiência de edição de administrador intuitiva que mostra exatamente como será a aparência do seu site no front-end.

Aqui estão quatro etapas para personalizar sua loja online usando o Toolset e o OceanWP:

  1. Decida o que você deseja exibir e promover
  2. Defina seus produtos com tipos de postagem, campos e taxonomias personalizados
  3. Criar páginas de produtos personalizadas
  4. Crie páginas de loja dinâmicas e funcionalidade de pesquisa

Decida o que você deseja exibir e promover

Os recursos flexíveis do Toolset fazem mais do que apenas reorganizar e estilizar suas páginas de produtos. Você pode criar recursos totalmente personalizados que se aplicam especificamente ao seu negócio ou usar recursos avançados dos principais sites de varejo.

conjunto de ferramentas q-and-a-section
Crie perguntas e respostas de produtos usando formulários e campos de repetição personalizados
conjunto de ferramentas de upsells-cross-sells
Exiba upsells e cross-sells populares usando relacionamentos de postagem
conjunto de ferramentas de taxonomia personalizada da marca
Exiba produtos por marca ou designer usando taxonomias personalizadas
conjunto de ferramentas de ofertas especiais
Compartilhe ofertas especiais usando blocos condicionais com informações de campos personalizados
conjunto de ferramentas de formulários de front-end
Permita que os fornecedores enviem seus produtos diretamente para seu site usando formulários
Conjunto de ferramentas de locais de loja
Mostre as localizações das suas lojas em um mapa usando visualizações personalizadas
criar-conta-conjunto de ferramentas
Crie logins de clientes ou fornecedores com permissões de acordo com o tipo de usuário

conjunto de ferramentas de produtos por roupa
Crie inspiração de roupas compráveis ​​usando relacionamentos de postagem

Esses são recursos que você nunca poderia obter apenas do WooCommerce e eles apenas arranham a superfície do que é possível com o Toolset. O melhor de tudo, tudo isso pode ser feito sem qualquer codificação!

Defina seus produtos com tipos de postagem personalizados, campos e taxonomias

Depois de ter suas ideias em mente, você pode criar um número ilimitado de tipos de postagem personalizados, campos, taxonomias e relacionamentos de postagem para tornar suas ideias realidade.

O WooCommerce oferece alguns campos básicos para definir seus produtos, como atributos do produto, descrições, preços e informações de envio, como peso e dimensões.

Com o conjunto de ferramentas, você pode adicionar outras informações, como recursos específicos de produtos, marcas ou dizer a qual departamento um produto pertence.

produtos de campos personalizados
Campos personalizados em um produto

Nem todos os temas funcionam bem com tipos de postagem personalizados, mas o OceanWP está “pronto para tipos personalizados”. Com o OceanWP, você pode aplicar diferentes configurações de tema a cada modelo de conteúdo. Isso oferece maior controle sobre como esse conteúdo personalizado aparece em seu site.

Criar páginas de produtos personalizadas

Com seus produtos definidos, você pode criar modelos totalmente personalizados para exibir seus produtos e as informações de seus campos personalizados. Ao usar modelos de produtos, você só precisa criar sua página uma vez e todas as alterações feitas são refletidas imediatamente em todos os seus produtos que usam esse modelo.

O Toolset permite que você crie seus modelos de produtos completamente do zero usando os WooCommerce Blocks do Toolset.

modelo padrão do woocommerce
Modelo de produto WooCommerce padrão
conjunto de ferramentas de modelo de produto personalizado
Modelo de produto totalmente personalizado do conjunto de ferramentas

Basta atribuir o modelo ou arquivo aos seus produtos e adicionar os blocos desejados, como classificações de produtos, guias de produtos, atributos de produtos, um botão de adicionar ao carrinho e muito mais.

Os blocos podem extrair as informações de seus campos personalizados dinamicamente. Isso significa que quando você adiciona um bloco de cabeçalho para exibir, por exemplo, o nome do produto, ele exibirá automaticamente o nome correto do produto de acordo com o produto que seu cliente está visualizando.

conjunto de ferramentas de conteúdo dinâmico
Criando um modelo de produto que extrai as informações dinamicamente para cada produto

Você também pode atribuir modelos condicionalmente para usar modelos diferentes de acordo com determinados critérios do produto. Por exemplo, você pode usar um modelo condicional para exibir itens que estão em falta usando um layout diferente.

conjunto de ferramentas em estoque
Item em estoque
conjunto de ferramentas de item fora de estoque
Item fora de estoque

O OceanWP oferece várias opções para estilizar esses modelos. Como está pronto para pós-tipo, você pode escolher diferentes opções de tema para diferentes modelos. Por exemplo, você pode optar por exibir uma barra lateral para alguns produtos e escolher um layout de largura total para produtos em destaque.

theme-options-owp-toolset
Escolhendo suas opções de tema OceanWP por modelo

O OceanWP também inclui opções globais de estilo para ajudar a manter a identidade visual de sua loja consistente em todo o site. Além disso, não há como alternar entre o administrador do site e o front-end para ver a aparência das alterações, porque o que você vê no back-end é como ele aparecerá no front-end.

global-styling-toolset-oceanwp
Adicionando estilos globais ao seu site

Crie Páginas de Loja Dinâmicas, Listas de Produtos e Adicione a Funcionalidade de Pesquisa

Você definiu seus produtos e projetou seus modelos de produtos. Agora, ajude seus clientes a encontrar o que estão procurando.

Criando páginas personalizadas da loja e outras páginas de arquivo

No WordPress, páginas como a página da loja e as páginas de listagem de categorias são chamadas de arquivos. Em essência, os arquivos listam todas as postagens (ou produtos) que pertencem a uma determinada categoria ou tipo de conteúdo.

O conjunto de ferramentas permite criar arquivos diferentes de acordo com os critérios que você escolher. Por exemplo, se o seu site vende sapatos de salto e bolsas, você pode querer páginas de loja diferentes com filtros relevantes para cada tipo de produto.

conjunto de ferramentas de página de arquivo
Página da loja para saltos
shop-page-bags-toolset
Página da loja para bolsas

Criando listas dinâmicas de conteúdo

Você pode adicionar uma lista dinâmica de produtos à sua página da Loja ou a qualquer outra página do seu site usando o bloco Visualização do Conjunto de Ferramentas. Isso permite definir quais produtos listar e projetar a aparência da lista.

conjunto de ferramentas de bloco de visualização
Escolhendo qual conteúdo exibir em uma página de loja

Adicionando opções personalizadas de pesquisa e filtro

O conjunto de ferramentas torna mais fácil para seus clientes em potencial encontrar produtos de maneira rápida e fácil, graças às opções personalizadas de pesquisa e filtragem. Você pode filtrar por qualquer campo personalizado ou relação de postagem que você criou.

conjunto de ferramentas de pesquisa personalizada
Pesquisa personalizada que permite filtrar por campos personalizados

Outros recursos personalizados da página de loja do OceanWP

O OceanWP oferece mais recursos para suas páginas de loja e arquivo, incluindo uma opção de visualização rápida, rolagem infinita e a capacidade de ocultar seus filtros da tela quando não estiverem em uso. Observe que esses recursos funcionam apenas com os arquivos do OceanWP, não com os personalizados que você cria com o Toolset.

opção de visualização rápida-oceanwp
Opção de visualização rápida
filtros ceanwp-off-screen
Ocultar filtros da tela

O OceanWP também oferece opções de como exibir seu carrinho de compras:

  • Carrinho nativo aparecendo
  • Barra flutuante de adicionar ao carrinho
  • Exibição do carrinho
  • Check-out sem distrações

..e mais!

Experimente o OceanWP e o Toolset hoje e conte-nos sobre sua experiência nos comentários!

Aprenda a construir lojas WooCommerce personalizadas passo a passo com o curso WooCommerce gratuito da Toolset.


Você também pode experimentar o Toolset e o OceanWP juntos gratuitamente com esta demonstração da loja WooCommerce.