Um Bloco de Produto exibe um item da loja do seu site em outras páginas ou publicações. É uma ótima maneira de promover produtos em todo o site ou criar um layout diferente da página de destino integrada da sua loja.
Dica: para saber mais sobre as diferenças entre as páginas da loja e os blocos de produtos, visite as páginas da loja versus blocos de produtos.
Antes de começar
- Para usar Blocos de Produtos, você precisa de uma Página de Armazenamento contendo o produto que deseja exibir.
- A Página de Armazenamento que contém o produto deve estar ativada. Se você desativá-la, o produto não aparecerá nos carrinhos de compras quando adicionado por meio de Blocos de Produtos.
- O produto deve ser publicado e deve estar visível.
Adicionar o Bloco de Produto
Para adicionar um Bloco de Produtos:
- Edite uma página ou publicação, clique em um ponto de inserção e selecione Produto no menu. Veja ajuda em Adição de conteúdo com blocos.
- No campo Adicionar um produto, procure o produto que você deseja exibir. Clique nele nos resultados da pesquisa para adicioná-lo. A pesquisa exibe até 15 produtos.
- Para acessar seu inventário e fazer alterações nos produtos, clique em Editar produtos e clique em Salvar e continuar. Tenha em mente que isso fecha a página atual.
- Clique na guia Design para personalizar quais detalhes do produto são exibidos.
Dica: os Blocos de Produto exibem um produto de cada vez. Para exibir mais de um produto em uma página, use vários Blocos de Produto ou exiba uma coleção de produtos usando Blocos de Sumário.
Promover produtos fechados
Se você assina o recurso Áreas de Membros e tem uma loja on-line em uma área de membros, os visitantes do site precisarão se assinar para poder comprar nessa loja. Para dar acesso a não membros, adicione Blocos de Produto ao site principal e use a barra de busca Localizar um produto para selecionar os produtos da loja fechada.
Adicionar detalhes do produto
Para personalizar o Bloco de Produto, clique na guia Design. Aqui, você pode definir o alinhamento do bloco para esquerda, centro ou direita. Você também pode personalizar quais detalhes do produto serão exibidos ativando ou desativando as alternâncias:
- Imagem - Exibe a imagem em miniatura do produto
- Título - Exibe o título do produto
- Preço - Exibe o preço do produto
- Descrição - Exibe a descrição do produto
- Botão Adicionar ao carrinho - Exibe um botão Adicionar ao carrinho
- Visualização rápida do produto - Permite visualização rápida
Para alterar qualquer um desses detalhes, edite o produto.
Estilo do Bloco de Produto
Você pode estilizar o Bloco de Produto e personalizar o botão Adicionar ao carrinho.
Texto do botão
Por padrão, o texto do botão Bloco de Produto é Adicionar ao Carrinho. Você pode alterar esse texto e utilizar outro, como Comprar Agora.
- Abra a Página de Armazenamento que contém o produto exibido no seu Bloco de Produto.
- Clique duas vezes no produto para abrir o editor do produto.
- Na guia Opções, insira o novo texto do botão.
Design de botões
A maneira de alterar o design do botão depende da versão do seu site.
- Abra uma página contendo um Bloco de Produto.
- Clique em Editar, abra Estilos do Site e clique em Botões.
Saiba mais em Edição de estilo dos botões.
- Abra uma página contendo um Bloco de Produto.
- No Menu Inicial, clique em Design e depois em Estilos do Site.
- Role para baixo até os ajustes de estilo dos botões.
Saiba mais em Edição de estilo dos botões.
Texto e fonte do Bloco de Produtos
A forma como você estilizar o título, o preço e a descrição do Bloco de Produto depende da versão do seu site.
Para alterar o texto exibido, acesse a Página da Loja e edite as informações do produto.
Altere a fonte, a cor do texto e o tamanho do texto em Estilos do Site.
- Fonte – Segue Parágrafos
- Cor – Segue Parágrafo (Médio)
- Tamanho – Segue Parágrafo 2
O título sempre aparece um pouco maior.
Para alterar o texto exibido, acesse a Página da Loja e edite as informações do produto.
As fontes de detalhes do produto tiram seu estilo de outros estilos de texto em seu site. Na maioria dos modelos:
- Título - Segue a fonte do corpo do texto, porém um pouco maior. A cor segue a cor do link do corpo.
- Preço - Segue a fonte e a cor do texto do corpo, mas um pouco maiores.
- Descrição - Segue a fonte e a cor do texto do corpo.
Há algumas exceções. Nestas famílias de modelos:
| Família de template | Notas |
|
Bedford |
|
|
Brine |
|
|
Farro |
|
|
Skye |
|
| Supply |
|
Tamanho e forma do Bloco de Produto
Quando você adicionar o bloco pela primeira vez, ele preencherá toda a largura da área de conteúdo se não houver outros blocos ao lado dele. Para ajuda no redimensionamento dos blocos, confira Redimensionamento de bloco e Movendo blocos para personalizar o layout.
Para a forma do bloco, a proporção de blocos de produtos corresponde à taxa de proporção original da imagem em miniatura do produto. Para garantir que um Bloco de Produto tenha uma proporção específica, recorte a imagem antes de enviá-la para o editor de produtos ou use o editor de imagens no editor de produto.
Dicas de pesquisa do Bloco de Produtos
Ao procurar um produto a ser exibido no bloco, os resultados da pesquisa são baseados nas seguintes informações:
- Títulos
- Descrições
- Tags
- Categorias
- Blocos de texto nas informações adicionais do produto
A pesquisa exibe até 15 correspondências. Se seus produtos tiverem nomes semelhantes, pesquise pelo título exato. Novos produtos podem não ser exibidos imediatamente na pesquisa.
Personalize sua loja online
Embora deva usar uma página de loja para adicionar produtos ao seu site, você pode usar Blocos de Produtos para criar um layout de loja on-line personalizado em uma página diferente. Depois de criar e personalizar sua loja, você pode ocultar a página da loja movendo-a para a seção Não vinculada do painel de páginas. Isso remove a página da loja dos menus de navegação enquanto a mantém ativada.
Resolução de problemas
Meu Bloco de Produto mostra a imagem errada
Os Blocos de Produtos exibem a imagem em miniatura do produto. Essa imagem pode ser diferente da primeira imagem definida no editor de produtos. Para alterar a imagem no Bloco de Produto, altere a imagem em miniatura do produto.
No Bloco de Produto, o produto não é adicionado ao carrinho de compras.
Se um clique em um botão Adicionar ao Carrinho do Bloco de Produto não adicionar o produto ao carrinho de compras, a Página de Armazenamento vinculada poderá estar desativada. Os produtos de Páginas de Armazenamento desativados podem ser exibidos nos Blocos de Produtos, mas não podem ser adicionados aos carrinhos. Para resolver esse problema, ative a Página de Armazenamento.