CMS: exibir seus produtos do Wix Stores em uma página dinâmica de lista

12 min de leitura
Use o CMS (sistema de gerenciamento de conteúdo) e sua criatividade para exibir seus produtos do Wix Stores, mostrando-os em um repetidor totalmente personalizável em uma página dinâmica de lista. Escolha apenas os elementos de página que você precisa (por exemplo: texto, botões, imagens) e conecte-os aos campos relevantes usados pelos seus produtos (por exemplo: nome, preço, quantidade em estoque). 

Você pode vincular botões ou imagens à sua página de produto para que os clientes possam clicar para obter mais informações antes de comprar. Você também pode criar botões de "Adicionar ao carrinho" e "Visualização rápida" para uma experiência de compra perfeita.
Antes de começar:

Etapa 1 | Adicione uma página dinâmica de lista para seus produtos

Vá para Coleções de aplicativos Wix no CMS do seu Editor e crie uma página dinâmica de lista da coleção da loja. Esta página inclui um repetidor que já está parcialmente conectado aos produtos da sua loja.
Editor Wix
Editor X
Editor do Wix Studio
  1. Vá para o seu editor.
  2. Clique em CMS  à esquerda do editor.
  3. Clique em Coleções de aplicativos Wix à esquerda.  
  4. Role para baixo até Stores, passe o mouse sobre Products e clique no ícone Mais ações
  5. Clique em Adicionar página dinâmica
  1. Clique em Página de lista
  2. Clique em Adicionar ao site
Dica:
Você pode exibir seus produtos em uma galeria Pro ou tabela (apenas no Editor Wix) em vez de um repetidor. Para isso, remova o repetidor e adicione uma galeria ou tabela. Em seguida, siga o resto das etapas neste artigo para conectar sua galeria ou repetidor ao CMS.

Etapa 2 | Conecte seu repetidor ao CMS

Conecte o repetidor a um conjunto de dados que se vincula à sua coleção de produtos do Wix Stores. Em seguida, conecte cada elemento do repetidor aos valores dinâmicos da sua coleção que mudam dependendo do produto mostrado. Certifique-se de vincular uma imagem ou botão no seu repetidor à página de produto do Wix Stores para que os clientes possam visualizar informações adicionais sobre os produtos antes de comprar. Você também pode criar links para "Adicionar ao carrinho" e "Visualização rápida". 
Editor Wix
Editor X
Editor do Wix Studio
  1. (Opcional) Adicione elementos ao seu repetidor (por exemplo: botões, texto, imagens) ou remova elementos de que você não precisa. Você pode ajustar o tamanho do repetidor para que ele possa mostrar todos os elementos. 
  2. Clique no elemento do repetidor e selecione o ícone Conectar ao CMS .
  3. Clique no dropdown Escolha um conjunto de dados e selecione Products.
  4. Em Conexões, clique no elemento do repetidor que você deseja conectar.
    Observação: se você estiver usando o repetidor padrão que acompanha a página dinâmica, os elementos Imagem e Texto já estão conectados. Você pode excluir elementos de texto adicionais ou desconectá-los e substituí-los por um texto estático. 
  5. Clique nos dropdowns relevantes e selecione os campos dinâmicos de coleção do Wix Stores que você deseja conectar ou as opções de conexão do conjunto de dados para botões e imagens:
    • Campos da coleção do Wix Stores: selecione os campos relevantes, por exemplo:
      • Nome (texto): o nome do produto que você criou no Wix Stores.
      • Preço com desconto formatado (texto): o preço formatado com a moeda (por exemplo: R$ 20).
      • Mídia principal (imagem): o item de mídia principal (imagem ou vídeo) para o produto.
    • Opções para vincular botões e imagens: clique no dropdown A ação do clique conecta-se a ou O link conecta-se a e selecione a opção relevante:
      • Navegar para Product Page URL: acesse o endereço web da página de produto no seu site. 
      • Adicionar ao carrinho: adicione o produto ao carrinho. 
      • Open quick view (Abrir visualização rápida): abre um pop-up com informações sobre o produto. 
  1. Clique em Conexões do repetidor e repita os passos 4 e 5 acima para conectar elementos adicionais ao repetidor. 
  2. Clique para ajustar seus elementos do repetidor conforme necessário.
    Dica: você pode adicionar ou remover elementos do seu repetidor a qualquer momento. Desconecte elementos se quiser usar conteúdo estático que não muda de acordo com a categoria relevante. 
  3. Clique em Visualizar para testar sua página dinâmica de produtos.
  4. Clique em Publicar se as alterações puderem ser publicadas. 

Etapa 3 | (Opcional) Gerencie as configurações do conjunto de dados

Nas configurações do conjunto de dados, você pode escolher o número máximo de produtos que podem ser exibidos por vez. Você também pode adicionar filtros para incluir apenas determinados produtos ou adicionar classificações para controlar a ordem em que os produtos são exibidos. 
Editor Wix
Editor X
Editor do Wix Studio
  1. No editor, clique no repetidor, galeria Pro ou na tabela.
  2. Clique no ícone Conectar ao CMS .
  3. Clique em Configurações do conjunto de dados.
  4. Edite o campo Máximo de itens exibidos para definir o número máximo de produtos que podem ser carregados ao mesmo tempo na página. Esse é também o máximo de produtos que podem carregar por página em uma barra de paginação conectada ou por clique em botões "Ver mais" ou Página "seguinte/anterior".
    Observação: esse campo não se aplica a tabelas. Se usar uma tabela para exibir seus itens, limite o número de itens exibidos ao clicar no ícone Layout da tabela e, em seguida, definir uma altura personalizada da tabela e ativar a paginação. 
  5. (Opcional) Clique em + Adicionar filtro para mostrar apenas produtos específicos no repetidor. 
  6. (Opcional) Clique em + Adicionar classificação para escolher a ordem em que os produtos aparecem no repetidor.
  7. Clique em Visualizar para testar sua página dinâmica de produtos.
  8. Clique em Publicar se as alterações puderem ser publicadas. 

Etapa 4 | (Opcional) Permita que os clientes filtrem produtos

Ofereça aos compradores uma maneira de visualizar apenas produtos que correspondam aos filtros aplicados, como preço, estoque ou marca. Escolha entre qualquer um dos seguintes elementos de entrada que permitem filtrar: botões de opção, caixas de seleçãodropdowntags de seleção, ou slider (somente sliders de intervalo).

Etapa 5 | (Opcional) Adicione botões "Ver mais" ou de navegação

Você pode melhorar o desempenho da sua página ao limitar o número de produtos que aparecem e adicionar um botão "Ver mais".

Adicione botões de navegação para permitir que os compradores cliquem para visualizar os itens seguintes/anteriores ou adicione uma barra de paginação para percorrer um determinado número de produtos ao mesmo tempo. 
Dica:
Saiba mais sobre as ações do conjunto de dados do CMS que você pode aplicar a botões e imagens.

Esse artigo foi útil?

|