CMS: exibir seus produtos do Wix Stores em qualquer página
10 min de leitura
Neste artigo
- Etapa 1 | Adicione uma galeria Pro, repetidor ou tabela a uma página
- Etapa 2 | Conecte sua galeria, repetidor ou tabela ao CMS
- Etapa 3 | (Opcional) Gerencie as configurações do conjunto de dados
- Etapa 4 | (Opcional) Permita que os clientes filtrem produtos
- Etapa 5 | (Opcional) Adicione botões "Ver mais" ou de navegação
Mostre seus produtos do Wix Stores em uma galeria, repetidor ou tabela em qualquer página, como a página inicial ou a página do carrinho. O CMS (Sistema de gerenciamento de conteúdo) permite que você vincule dinamicamente os botões, imagens ou colunas da tabela à sua Página de produto. Os clientes podem clicar para navegar para a Página de produto onde podem ler mais sobre ele antes de decidir se vão comprá-lo.
Você também pode vincular botões, imagens e colunas à ação "Adicionar ao carrinho" ou à janela de visualização rápida. Use as configurações no conjunto de dados que vincula seus produtos aos elementos da página para filtrar, classificar ou limitar o total de produtos exibidos.

Antes de começar:
- Crie seus próprios produtos no Wix Stores.
- Certifique-se de adicionar o CMS ao seu site se você ainda não fez isso.
- Ative coleções de aplicativos Wix para que você possa usar o Wix Stores com o CMS.
Etapa 1 | Adicione uma galeria Pro, repetidor ou tabela a uma página
Vá para a página no seu editor onde você deseja exibir seus produtos do Wix Stores. Se necessário, você pode adicionar uma nova página. Em seguida, adicione o elemento no qual deseja exibir seus produtos.
Editor Wix
Editor do Wix Studio
- Vá para o seu editor.
- Vá para a página ou seção onde você deseja exibir os produtos do Wix Stores.
- Clique em Elementos
no lado esquerdo do editor.
- Adicione uma galeria Pro, repetidor ou tabela:
- Galeria Pro: mostre seus produtos em uma galeria:
- Clique em Galeria.
- Clique e arraste a galeria Pro escolhida para a página.
- Remova as imagens padrão da galeria:
- Clique na galeria e selecione Gerenciar mídia.
- Clique em Selecionar tudo e clique em Excluir.
- Clique em OK.
- Repetidor: mostre seus produtos usando vários elementos anexados a um repetidor:
- Clique em Lista.
- Clique e arraste o repetidor escolhido para a página.
- Certifique-se de que seu repetidor tenha uma imagem ou botão para que você possa conectá-lo à sua página de produto mais tarde. Você pode adicionar ou remover elementos do seu repetidor. Se necessário, você pode redimensionar o repetidor para que todos os elementos necessários caibam nele.
- Tabela: exiba seus produtos em formato de tabela:
- Clique em Lista.
- Clique em Tabelas e arraste a tabela escolhida para a página.
- Galeria Pro: mostre seus produtos em uma galeria:
Etapa 2 | Conecte sua galeria, repetidor ou tabela ao CMS
Conecte os campos de coleção ao seu repetidor, galeria ou tabela. Os valores desses campos dinâmicos mudam no seu site online dependendo do produto obtido pelo conjunto de dados. Certifique-se de vincular os botões ou imagens ao URL da página. Esse link permite que os visitantes cliquem para ir para a Página de produto de loja relevante.
Editor Wix
Editor do Wix Studio
- No seu editor, clique no repetidor, galeria ou tabela.
- Clique no ícone Conectar ao CMS
.
- Clique em Criar conjunto de dados. Se você já tiver um conjunto de dados em sua página, clique no menu dropdown Escolha um conjunto de dados e selecione Criar um novo conjunto de dados.
- Clique no dropdown Escolha uma coleção e selecione Produtos abaixo das coleções de aplicativos Wix Stores.

- (Opcional) Clique no campo Nome do conjunto de dados e insira um nome para o conjunto de dados.
- Clique em Criar.
- (Apenas para repetidores) Em Conexões, clique no elemento do repetidor que você deseja conectar (por exemplo: texto, botão, imagem).
- 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 Link se conecta 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.
- Campos da coleção do Wix Stores: selecione os campos relevantes, por exemplo:

- (Apenas para repetidores) Clique em Conexões do repetidor e repita os passos 7 e 8 acima para conectar elementos adicionais ao repetidor.
- Clique para ajustar seus elementos do repetidor, galeria Pro ou tabela 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. - Clique em Visualizar para testar a funcionalidade.
- 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 exibidas por vez. Você pode adicionar filtros para incluir produtos específicos ou usar classificações para controlar a ordem.
Observação:
O campo Itens por carregamento não se aplica a tabelas. Se estiver usando uma tabela para listar produtos, você pode limitar o número de itens exibidos clicando no ícone Layout
. Em seguida, defina uma altura de tabela personalizada e ative a paginação.

Editor Wix
Editor do Wix Studio
- Vá para as configurações do conjunto de dados:
- Clique em CMS
à esquerda.
- Clique em Gerenciar conexões de página.
- Clique no ícone Mais ações
ao lado do conjunto de dados relevante e selecione Configurações do conjunto de dados.
- Clique em CMS
- (Opcional) Clique no tipo de permissão ao lado de Permissões para determinar quem pode visualizar, adicionar, atualizar ou excluir o conteúdo da coleção no seu site online.
- Edite o campo Itens por carregamento para definir o número máximo de itens que podem ser carregados de cada vez.
Observação: esse é também o número máximo de itens que podem ser carregados quando os visitantes clicam nos botões "Ver mais", "Página seguinte/anterior" ou nas barras de paginação. Confira as etapas na próxima seção. - (Opcional) Clique em + Adicionar filtro para mostrar apenas produtos específicos no elemento.
- (Opcional) Clique em + Adicionar classificação para escolher a ordem em que os produtos aparecem no elemento.
- Clique em Visualizar para testar a funcionalidade.
- 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ção, dropdown, tags de seleção, ou sliders (somente sliders de intervalo).
Saiba como configurar elementos de entrada que permitem aos visitantes filtrar o conteúdo da coleção.

Etapa 5 | (Opcional) Adicione botões "Ver mais" ou de navegação
Melhore o desempenho da sua página ao limitar o número de produtos que aparecem e adicionar um botão "Ver mais".
Você pode adicionar 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.