Seções do Supply

O conteúdo do tema é criado com o uso de seções, blocos personalizáveis de conteúdo que determinam o layout e a aparência de diferentes páginas da loja virtual. Para adicionar, remover, editar e personalizar as seções, use o editor de temas atualizado.

Os temas da Shopify têm os seguintes tipos de seções:

  • Seções estáticas: seções que aparecem em locais predeterminados da loja virtual e não podem ser removidas ou reorganizadas. Elas podem incluir cabeçalhos, rodapés e seções de navegação ou de conteúdo em páginas como as de produto e de coleção. A seção Produto, por exemplo, determina a aparência de cada página de produto na loja virtual.
  • Seções dinâmicas: seções opcionais usadas para personalizar o layout da página inicial. Adicione até 25 seções dinâmicas diferentes, que podem ser reorganizadas e removidas na página inicial.

Você pode saber mais sobre a seleção exclusiva de seções de Supply e aprender a personalizá-las para se adequarem à sua empresa.

Seções estáticas

O Supply inclui as seguintes seções estáticas:

Seções dinâmicas

O Supply inclui as seguintes seções dinâmicas:

Cabeçalho

O cabeçalho do tema é a seção que aparece no topo de todas as páginas de sua loja.

Personalize os seguintes itens no cabeçalho:

  • Logo
  • Barra de avisos
  • Menu

Adicionar um logo personalizado

É possível adicionar uma imagem do logo personalizado ao cabeçalho da loja. O melhor formato é um arquivo .png de fundo transparente. O logo ideal para o Supply tem 400 pixels de largura. É possível redimensionar a imagem do logo ajustando a largura. Não aumente o valor além da largura original. Isso pode causar distorção e queda na qualidade da imagem.

Se você não adicionar uma imagem de logo, o nome da loja será exibido como texto. Vale lembrar que é possível alterar o nome da loja na página de configurações Informações da loja no admin da Shopify.

  • Largura do logo personalizado: a largura do logo.
  1. Clique em Cabeçalho.
  2. Na área Imagem do logo, clique em Selecionar imagem e execute uma das seguintes ações:

    • Para selecionar uma imagem que você já enviou para o seu admin da Shopify, clique na aba biblioteca.
    • Para selecionar uma imagem de seu computador local, clique em Biblioteca > Fazer upload.
  3. Use as configurações para personalizar o tamanho e o posicionamento do logo.

  4. Clique em Salvar.

Adicionar uma barra de comunicados

Para exibir uma mensagem aos clientes, adicione uma barra de comunicados ao cabeçalho. O texto é personalizável e pode incluir informações de contato, eventos, promoções ou o slogan da loja. A mensagem pode ter até 55 caracteres.

  1. Clique em Cabeçalho.

  2. Na área da Barra de avisos, marque Exibir comunicado.

  3. Digite o texto do comunicado.

  4. Opcional: insira um URL para adicionar um link ao comunicado.

  5. Clique em Salvar.

Adicionar um menu

Adicione um menu ao cabeçalho para exibir todos os links e use essa função para destacar as páginas que os clientes acessam com mais frequência. Por exemplo, adicione um menu que contenha links para as coleções.

  1. Clique em Cabeçalho.

  2. Para selecionar um menu, clique em Alterar. Selecione um menu na lista ou clique em Criar menu para gerar um novo.

  3. Para editar o menu, clique em Editar menu.

  4. Clique em Salvar.

Rodapé

O rodapé do tema é a seção que aparece na parte inferior de todas as páginas de sua loja. Adicione os seguintes recursos ao rodapé:

  • ícones de redes sociais
  • ícones de pagamento
  • um menu horizontal
  • uma assinatura da newsletter
  • texto personalizado
  • links rápidos

Adicionar ícones de redes sociais

É possível exibir ícones de redes sociais no rodapé da loja virtual. O controle dessa exibição é feito nas configurações do tema.

  1. Clique em Rodapé.
  2. Marque Exibir ícones de redes sociais.
  3. Clique em Salvar.

Adicionar ícones de pagamento

No rodapé, é possível exibir ícones das formas de pagamento aceitas, associados ao provedor habilitado na seção de configurações de pagamento do admin. Quando o cliente visita a loja, esses ícones são filtrados para que apenas as formas de pagamento aceitas na região e na moeda do cliente atual sejam exibidas.

  1. Clique em Rodapé.

  2. Marque a opção Exibir ícones de pagamento.

  3. Clique em Salvar.

Adicionar um menu horizontal

Adicione um menu ao rodapé com todos os links em uma barra horizontal na parte inferior. Use esse recurso para vincular as páginas que os clientes acessam com mais frequência. Por exemplo, é possível adicionar um menu com links para suas políticas de frete e devolução.

  1. Clique em Rodapé.
  2. Edite a configuração Menu Aviso legal. Para selecionar um menu, clique em Alterar. Selecione uma opção na lista ou clique em Criar menu para criar um novo.
  3. Para editar o menu, clique em Editar menu.
  4. Clique em Salvar.

Adicionar um menu, uma assinatura da newsletter ou um texto

É possível adicionar até nove blocos de conteúdo ao rodapé.

  1. Clique em Rodapé.

  2. Adicione um bloco de conteúdo na área Conteúdo, clicando em Adicionar conteúdo. Selecione uma das seguintes opções de bloco de conteúdo:

  3. Clique em Salvar.

Produto

Produto é a principal seção personalizável para páginas de produtos. Personalize essa seção usando as seguintes opções:

  • Habilitar o zoom da imagem: permita que os clientes aumentem o zoom passando o mouse sobre a imagem do produto.
  • Exibir seletor de quantidade - permita que os usuários especifiquem uma quantidade a adicionar ao carrinho.
  • Exibir uma mensagem de quantidade restante: mostre o número de produtos restantes quando o estoque estiver baixo. Essa mensagem aparece quando há nove ou menos variantes em estoque. Para exibi-la, é preciso habilitar o acompanhamento de estoque do produto.
  • Mostrar uma mensagem de estoque a ser recebido quando um item estiver esgotado: mostre uma mensagem que indica quando um produto esgotado retornará ao estoque. O texto apresentado é "Em estoque a partir de [data]". Para exibir a mensagem, é preciso criar uma transferência do produto para registrar o estoque a ser recebido.
  • Exibir fabricante: mostre a marca ou o fabricante do produto. Adicione um fabricante ao produto para ver essas informações.
  • Exibir valor economizado: mostre o valor que o cliente está economizando. O valor economizado é a diferença entre o preço normal e a Comparação de preços do produto. Para que esse valor seja exibido, é necessário definir uma Comparação de preços do produto.
  • Exibir Comparação de preços: mostre a Comparação de preços do produto.
  • Exibir produtos relacionados: mostre uma seleção de produtos relacionados na parte inferior da página. O produto relacionado precisa fazer parte de uma coleção para aparecer nessa seção. Caso contrário, não será exibido. Isso também ocorre quando o produto é o único item em uma coleção.
  • Exibir o botão de checkout dinâmico: permita que os clientes pulem o carrinho e passem direto para o checkout na seção de produto em destaque.
  • Habilitar o compartilhamento de produtos: mostre os botões que os clientes podem usar para compartilhar produtos nas redes sociais. As opções de compartilhamento exibidas são controladas nas configurações do tema.
  • Habilitar avaliações de produtos: adicione uma seção de avaliação de produtos à página. Para mostrá-la, instale o app gratuito da Shopify Product Reviews e receba as opiniões dos clientes.
  • Tamanho do botão e do seletor de variante: escolha uma opção nesse menu suspenso para definir o tamanho do seletor de variante, do botão Adicionar ao carrinho e do botão de checkout dinâmico.

Editar as configurações do produto

  1. Selecione Páginas de produtos.
  2. Clique na seção Produto.
  3. Personalize a seção de produtos nas configurações.
  4. Clique em Salvar.

Coleção

Coleção é a principal seção personalizável para páginas de coleções.

A seção "Coleção" conta com as seguintes configurações:

  • Produtos por linha: defina o número de produtos a serem exibidos em cada linha da página de coleção.
  • Linhas por página (somente grade): defina o número de linhas de produtos a serem exibidas na página de coleção.
  • Filtros de produto na barra lateral: classifique as coleções por tags de produto ou por grupos de filtros na barra lateral.
  • Exibir Comparação de preços: mostre a Comparação de preços do produto.
  • Exibir valor economizado: mostre o valor que o cliente está economizando. O valor economizado é a diferença entre o preço normal e a Comparação de preços do produto. Para que esse valor seja exibido, é necessário definir uma Comparação de preços do produto.
  • Habilitar avaliações de produtos: exiba selos de pontuação de avaliações na página. Para mostrá-los, instale o app gratuito da Shopify Product Reviews e receba as opiniões dos clientes.
  • Habilitar barra lateral: mostre uma barra lateral para que os clientes vejam os produtos com base no tipo de filtro selecionado.

Editar configurações de coleção

  1. Selecione Páginas de coleções.
  2. Clique na seção Coleção.
  3. Personalize a seção da coleção nas configurações.
  4. Clique em Salvar.

Lista de coleções

É possível selecionar até seis coleções de produtos para exibir na página inicial na seção Lista de coleções.

Adicionar uma lista de coleções à sua página inicial

  1. Clique em Adicionar seção.
  2. Clique em Lista de coleções e, depois, em Selecionar.
  3. Para adicionar coleções à seção, personalize cada bloco de Coleção:

    • Clique em um bloco de coleção e em Selecionar uma coleção.
    • Na lista suspensa Coleção, escolha uma opção para exibir ou clique em Criar coleção para criar uma.
    • Clique em Selecionar.
  4. Para adicionar outros blocos de coleção, clique em Adicionar coleção.

  5. Clique em Salvar.

Coleção em destaque

Você pode destacar uma coleção na sua página inicial. Destacar coleções pode ajudar você a promover vendas e novas coleções.

A seção "Coleção em destaque" apresenta as seguintes configurações:

  • Título: adicione um título à seção de coleção em destaque.
  • Coleção: escolha a coleção que aparecerá na seção.
  • Produtos por linha: defina o número de produtos a serem exibidos em cada linha da seção.
  • Linhas: defina o número de linhas de produtos a serem exibidas na seção.
  • Exibir valor economizado: mostre o valor que o cliente está economizando. O valor economizado é a diferença entre o preço normal e a Comparação de preços do produto. Para que esse valor seja exibido, é necessário definir uma Comparação de preços do produto.
  • Exibir Comparação de preços: mostre a Comparação de preços do produto.

Adicionar uma coleção em destaque à sua página inicial

  1. Clique em Adicionar seção.
  2. Clique em Coleções em destaque e em Selecionar.
  3. Clique em Selecionar coleção, escolha uma coleção para exibir e, depois, clique em Selecionar.
  4. Use as configurações para personalizar a seção de coleção em destaque.
  5. Clique em Salvar.

Apresentação de slides

É possível carregar imagens para usar em apresentações de slides na página inicial na seção Apresentação de slides.

É possível selecionar até seis imagens de slide para a página inicial. Adicione links para cada slide, de modo que os clientes possam clicar e abrir uma página de sua loja.

Cada imagem de slide deve ter 1000 pixels de largura e 500 pixels de altura. Se você usar imagens com alturas diferentes para os slides, elas poderão ser puladas ou aparecerem desajustadas entre as transições.

A seção de apresentação de slides apresenta as seguintes configurações:

Conteúdo

  • Imagem: adicione uma imagem para exibir na apresentação de slides.
  • URL do link: vincule o slide a outra parte de sua loja virtual.

Configurações

  • Rotação automática de slides: defina como automática a apresentação de slides.
  • Tempo da transição: escolha a frequência de troca dos slides.

Personalizar sua apresentação de slides

  1. Clique em Adicionar seção.
  2. Clique em Apresentação de slides e, depois, em Selecionar.
  3. Para adicionar imagens à apresentação de slides, clique em um bloco de Imagem para personalizá-lo:

  4. Use as configurações para personalizar a apresentação de slides.

  5. Clique em Salvar.

Newsletter

Você pode adicionar uma assinatura de newsletter à sua página inicial. Isso permite coletar endereços de e-mail de contato para campanhas de e-mail marketing. Saiba mais sobre e-mail marketing no blog da Shopify.

Adicionar uma área para assinatura de newsletter à sua página inicial

  1. Clique em Adicionar seção.

  2. Clique em Newsletter e, depois, em Selecionar.

  3. Digite um título para a assinatura da newsletter.

  4. Insira um subtítulo para a assinatura da newsletter.

  5. Clique em Salvar.

Mapa

Você pode adicionar um mapa do Google à sua página inicial para mostrar aos clientes onde sua empresa está localizada.

A seção de mapa apresenta as seguintes configurações:

  • Título: adicione um título à seção de mapa.
  • Endereço e horário: adicione o endereço e horário de funcionamento de sua loja à seção de mapa.
  • Endereço do mapa: defina a localização de sua loja para exibição no mapa.
  • Marcador de link do mapa: adicione um botão com link para a localização de sua loja no Google Maps.
  • Exibir marcador: adicione um marcador que mostre a localização específica de sua loja no mapa.
  • Chave da API do Google Maps: adicione a chave da API de seu mapa à seção de mapa.
  • Imagem: adicione uma imagem para exibição se o mapa não carregar.
  • Posição da imagem: defina o posicionamento da imagem.

Adicionar um mapa à sua página inicial

  1. Clique em Adicionar seção.
  2. Clique em Mapa e, depois, em Selecionar.
  3. Use as configurações para personalizar a seção de mapa.
  4. Clique em Salvar.

Rich text

Utilize a seção Rich text para adicionar conteúdo escrito à página inicial ou para inserir páginas criadas no admin da Shopify. Por exemplo, é possível dar destaque a eventos futuros ao incorporar a página de seu blog ou exibir uma página com qualquer um dos recursos a seguir:

A seção de rich text apresenta as seguintes configurações:

  • Título - adicione um título à seção de rich text.
  • Texto: adicione e formate seu texto personalizado. Para dar destaque a uma página da loja, clique em Adicionar conteúdo e em Página. No menu suspenso, selecione uma página para destacar como sua página inicial.
  • Tamanho: defina o tamanho de seu texto.

Adicionar rich text à página inicial

  1. Clique em Adicionar seção.

  2. Clique em Rich text e em Selecionar.

  3. Use as configurações para personalizar a seção de rich text.

  4. Clique em Salvar.

Vídeo

Você pode adicionar um vídeo do YouTube ou do Vimeo à sua página inicial. Os vídeos podem envolver seus clientes e gerar interesse em relação à sua empresa.

Para adicionar um vídeo, você precisa localizar o link de compartilhamento do vídeo:

  • YouTube: um link de compartilhamento do YouTube tem esta aparência: https://youtu.be/ZXWgHlnVVEY. Saiba como copiar o link de compartilhamento de um vídeo do YouTube neste artigo da Ajuda do YouTube.
  • Vimeo : um link de compartilhamento do Vimeo se parece com este exemplo: https://vimeo.com/123456789. Você pode obter informações sobre como copiar o link de compartilhamento de um vídeo do Vimeo neste artigo da Central de ajuda do Vimeo.

A seção de vídeo apresenta as seguintes configurações:

  • Título: adicione um título à seção de vídeo.
  • Link do vídeo: adicione o link de compartilhamento do vídeo.

Adicionar um vídeo à sua página inicial

  1. Clique em Adicionar seção.
  2. Clique em Vídeo e em Selecionar.
  3. Personalize a seção de vídeo nas configurações.
  4. Clique em Salvar.

Conteúdo personalizado

A seção Conteúdo personalizado permite o agrupamento de vários blocos de conteúdo. A largura e o alinhamento de cada bloco podem ser ajustados para criar um layout personalizado.

Use HTML para formatar blocos de texto, criar tabelas ou incorporar conteúdo de outro site. É possível adicionar até nove blocos HTML personalizado em uma seção de conteúdo personalizado.

Cada bloco HTML personalizado apresenta as seguintes configurações:

  • HTML: adicione o código HTML que você deseja exibir em sua página inicial.
  • Largura do contêiner: defina a largura do bloco de HTML personalizado.
  • Alinhamento vertical: defina a posição vertical do conteúdo no bloco.

Adicionar conteúdo personalizado à página inicial

  1. Clique em Adicionar seção.

  2. Clique em Conteúdo personalizado e em Selecionar.

  3. Selecione e configure os blocos de conteúdo que você quer incluir na seção.

  4. Clique em Salvar.

Tudo pronto para começar a vender com a Shopify?

Experimente de graça