Seções e blocos

Esta página foi impressa em Dec 08, 2023. Para a versão mais recente, acesse https://help.shopify.com/pt-BR/manual/online-store/themes/theme-structure/sections-and-blocks.

Os temas usam seções para gerar o layout ideal. A maioria das seções é composta por blocos com funções específicas, como cabeçalhos, textos, imagens individuais, uma colagem de imagens ou links. O uso de seções e blocos nos modelos proporciona mais flexibilidade para organizar o conteúdo, o que permite controlar a aparência da loja virtual sem editar o código. Vale destacar que cada modelo pode ter até 25 seções.

Para cada seção existe uma variedade específica de blocos que podem ser adicionados a ela, respeitando o limite de 50. Para saber quais opções estão disponíveis para você, consulte a documentação do seu tema.

Algumas seções têm um número-limite de blocos que você pode adicionar ou definem o número de blocos de um determinado tipo. Por exemplo, a seção Imagem com texto só pode exibir os blocos especificados pelo designer do tema. No Dawn, o tema gratuito da Shopify, só é possível adicionar um de cada um dos seguintes blocos:

  • Um título
  • Um parágrafo
  • Um botão

Também é possível personalizar a seção, basta editar as Configurações para incluir uma imagem e escolher o alinhamento, o tamanho, a cor do plano de fundo e o que será carregado primeiro quando os clientes visitarem a loja virtual.

Caso as seções adicionadas ao layout da loja não incluam as configurações ou as opções de que você precisa, edite o código do tema ou entre em contato com o desenvolvedor do tema para receber ajuda.

Nesta página

Personalizar os modelos de tema com seções e blocos

Quando você abre o editor de temas, a página inicial da loja é carregada por padrão. Use o menu suspenso para selecionar outro modelo ou pesquisar um tipo específico de página. O modelo escolhido é carregado no editor de temas e todas as alterações feitas são pré-visualizadas na ferramenta em tempo real.

Adicionar uma seção

Adicione uma nova seção a uma página da loja virtual.

Etapas:

  1. No admin da Shopify, acesse Loja virtual > Temas.
  2. Encontre o tema que você quer editar e clique em Personalizar.
  3. Selecione um modelo no menu suspenso.
  4. Clique em + Adicionar seção e selecione uma nova seção na lista ou use a barra de Pesquisa para encontrar um termo específico.
  5. Clique na nova seção para editar os blocos dela.
  6. Opcional: clique e arraste o ícone ⋮⋮ ao lado de uma seção para reorganizar as seções na página.
  7. Clique em Salvar.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. Selecione um modelo no menu suspenso.
  7. Clique em + Adicionar seção e selecione uma nova seção na lista ou use a barra de Pesquisa para encontrar um termo específico.
  8. Clique na nova seção para editar os blocos dela.
  9. Opcional: clique e arraste o ícone ⋮⋮ ao lado de uma seção para reorganizar as seções na página.
  10. Clique em Salvar.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. Selecione um modelo no menu suspenso.
  7. Clique em + Adicionar seção e selecione uma nova seção na lista ou use a barra de Pesquisa para encontrar um termo específico.
  8. Clique na nova seção para editar os blocos dela.
  9. Opcional: clique e arraste o ícone ⋮⋮ ao lado de uma seção para reorganizar as seções na página.
  10. Clique em Salvar.

Editar uma seção

  1. No admin da Shopify, acesse Loja virtual > Temas.
  2. Encontre o tema que você quer editar e clique em Personalizar.
  3. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  4. Clique em uma seção para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis para você.
  5. Opcional: clique em blocos individuais para editá-los dentro da seção.
  6. Clique em Salvar.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  7. Clique em uma seção para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis para você.
  8. Opcional: clique em blocos individuais para editá-los dentro da seção.
  9. Clique em Salvar.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  7. Clique em uma seção para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis para você.
  8. Opcional: clique em blocos individuais para editá-los dentro da seção.
  9. Clique em Salvar.

Duplicar uma seção ou um bloco

  1. No admin da Shopify, acesse Loja virtual > Temas.
  2. Encontre o tema que você quer editar e clique em Personalizar.
  3. No menu suspenso, selecione o modelo que contém a seção ou o bloco que você quer duplicar.
  4. Clique em uma seção ou um bloco que você quer duplicar.
  5. Clique no botão ... ao lado do nome da seção na barra lateral e em Duplicar.
  6. Clique em Salvar.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção ou o bloco que você quer duplicar.
  7. Clique em uma seção ou um bloco que você quer duplicar.
  8. Clique no botão ... ao lado do nome da seção na barra lateral e em Duplicar.
  9. Clique em Salvar.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção ou o bloco que você quer duplicar.
  7. Clique em uma seção ou um bloco que você quer duplicar.
  8. Clique no botão ... ao lado do nome da seção na barra lateral e em Duplicar.
  9. Clique em Salvar.

Remover uma seção ou um bloco

  1. No admin da Shopify, acesse Loja virtual > Temas.
  2. Encontre o tema que você quer editar e clique em Personalizar.
  3. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  4. Clique em uma seção para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis para você.
  5. Clique no ícone do olho para ocultar ou exibir uma seção ou bloco.
  6. Clique em Remover para excluir um bloco ou seção.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  7. Clique em uma seção para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis para você.
  8. Clique no ícone do olho para ocultar ou exibir uma seção ou bloco.
  9. Clique em Remover para excluir um bloco ou seção.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  7. Clique em uma seção para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis para você.
  8. Clique no ícone do olho para ocultar ou exibir uma seção ou bloco.
  9. Clique em Remover para excluir um bloco ou seção.

Algumas seções têm tipos e limites de blocos fixos. Se houver um limite para uma seção ou um bloco específico, a interface informa que você usou X de X blocos disponíveis. Caso você tenha usado o número máximo de blocos, não será possível adicionar outros blocos até a exclusão de um já existente.

Trabalhar com blocos

Os blocos são módulos personalizáveis que formam as seções nos modelos de página e podem ser usados para adicionar texto, imagens, links, botões e muito mais.

Os temas da Shopify têm seções e blocos personalizáveis. No entanto, algumas seções contam com tipos fixos de bloco, ou seja, só é possível escolher aqueles disponibilizados pelo designer do tema. Já em outras é possível selecionar qualquer bloco, mas há um limite total que pode ser adicionado à seção. Uma mensagem é exibida quando esse número máximo é atingido, e a opção + Adicionar bloco fica esmaecida até um bloco ser removido.

Adicionar um bloco

  1. No admin da Shopify, acesse Loja virtual > Temas.
  2. Encontre o tema que você quer editar e clique em Personalizar.
  3. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  4. Clique em uma seção para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis para você.
  5. Clique em + Adicionar bloco e selecione um novo bloco ou clique na barra de Pesquisa para inserir um termo específico.
  6. Clique em Salvar.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  7. Clique em uma seção para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis para você.
  8. Clique em + Adicionar bloco e selecione um novo bloco ou clique na barra de Pesquisa para inserir um termo específico.
  9. Clique em Salvar.
  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  7. Clique em uma seção para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis para você.
  8. Clique em + Adicionar bloco e selecione um novo bloco ou clique na barra de Pesquisa para inserir um termo específico.
  9. Clique em Salvar.

Usar metacampos e origens dinâmicas

É possível exibir informações dinâmicas na loja virtual: se você tiver um tema compatível com metacampos, poderá conectá-los a uma seção ou um bloco no editor de temas.

Por exemplo, um vendedor de velas pode querer exibir tempos de queima para cada tipo de vela disponível. Depois de configurar um metacampo de produto para esse dado, o vendedor pode adicionar um bloco para tempo de queima ao modelo do produto e conectá-lo ao metacampo de produto. Depois de configurar um metacampo de coleção para uma página que lista os tempos de queima, o vendedor pode adicionar um bloco ao modelo de coleção e conectá-lo ao metacampo de coleção.

Para exibir informações dinâmicas na loja virtual, adicione origens dinâmicas, que podem ser usadas em seções ou blocos no modelo do produto. Em modelos que não são de produtos, use o recurso em seções ou blocos que mostram itens. Vale lembrar que é necessário adicionar um metacampo antes de conectá-lo aos modelos. Consulte Origens dinâmicas para saber mais sobre como usar metacampos e origens dinâmicas no tema.

Após concluir o processo de configuração, siga estas etapas para inserir a origem dinâmica no modelo:

  1. No admin da Shopify, acesse Loja virtual > Temas.
  2. Encontre o tema que você quer editar e clique em Personalizar.
  3. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  4. Clique em uma seção existente para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis ou clique em*+ Adicionar seção*.

  5. Clique em + Adicionar bloco e, em seguida, conecte uma origem dinâmica:

    • Se o ícone de conectar origem dinâmica for exibido, clique para selecionar um único metacampo:
      Connect dynamic source
    • Se o ícone de conectar origem dinâmica exibir um +, clique para selecionar até 20 metacampos adicionando um de cada vez:
      Insert dynamic source icon

  6. Clique em Salvar.

  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  7. Clique em uma seção existente para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis ou clique em*+ Adicionar seção*.

  8. Clique em + Adicionar bloco e, em seguida, conecte uma origem dinâmica:

    • Se o ícone de conectar origem dinâmica for exibido, clique para selecionar um único metacampo:
      Connect dynamic source
    • Se o ícone de conectar origem dinâmica exibir um +, clique para selecionar até 20 metacampos adicionando um de cada vez:
      Insert dynamic source icon

  9. Clique em Salvar.

  1. No app da Shopify, toque no botão ….
  2. Na seção canais de vendas, toque em loja virtual.
  3. Toque em Gerenciar todos os temas.
  4. Encontre o tema que você quer editar e toque em Personalizar.
  5. Toque em Editar.
  6. No menu suspenso, selecione o modelo que contém a seção que você quer editar.
  7. Clique em uma seção existente para carregar o conteúdo na janela de pré-visualização e acessar as opções disponíveis ou clique em*+ Adicionar seção*.

  8. Clique em + Adicionar bloco e, em seguida, conecte uma origem dinâmica:

    • Se o ícone de conectar origem dinâmica for exibido, clique para selecionar um único metacampo:
      Connect dynamic source
    • Se o ícone de conectar origem dinâmica exibir um +, clique para selecionar até 20 metacampos adicionando um de cada vez:
      Insert dynamic source icon

  9. Clique em Salvar.

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

Experimente de graça