Voltar para o suporte Conteúdo e mídia Blocos Bloco de grupo

Bloco de grupo

O bloco de grupo reúne outros blocos dentro de um contêiner para que você possa definir uma cor de fundo, ajustar o espaçamento e organizar diferentes seções da página. Este guia explicará como usar o bloco de grupo no seu site.

Vídeo de introdução

Criar um grupo

Há algumas maneiras de agrupar blocos. Você pode começar com um bloco de grupo vazio e adicionar conteúdo a ele, ou agrupar blocos existentes. Essas opções são descritas abaixo.

Adicionar bloco de grupo

Para adicionar o bloco de grupo, clique no botão de inserção de blocos (+) e pesquise “grupo”. Clique no bloco para adicioná-lo ao post ou à página. Usando o teclado, você também pode digitar /grupo em uma nova linha e pressionar Enter para adicionar rapidamente um novo bloco de grupo.

Você encontra instruções detalhadas sobre como adicionar blocos neste link.

Após inserir um bloco de grupo, você terá que selecionar um layout dentre as seguintes opções:

Seletor de layout do bloco de grupo
Seleção de uma variação de grupo, linha ou pilha

Ao selecionar um layout, você pode clicar no ícone de inserção de bloco (+) para começar a adicionar blocos dentro do grupo:

Bloco de grupo inserido
Para adicionar blocos internos, clique no ícone de inserção de bloco (+).

Agrupar blocos existentes

Você pode agrupar os blocos que já estão na página usando as seguintes etapas:

  1. Selecione um ou mais blocos para agrupar. Você pode selecionar vários blocos ao:
    • Destacar todos os blocos com o mouse.
    • Clicar no primeiro bloco, manter pressionada a tecla Shift no teclado e clicar no bloco final. Isso selecionará todos os blocos entre o primeiro e o último bloco.
    • Usar a Visualização em lista, clicar no primeiro bloco, manter pressionada a tecla Shift no teclado e clicar no bloco final. Isso selecionará todos os blocos entre o primeiro e o último bloco.
  2. Na barra de ferramentas do bloco, que aparece acima ou abaixo dos blocos, clique nas reticências (três pontos) e escolha a opção Agrupar. Se você selecionar vários blocos, novos ícones aparecerão na barra de ferramentas para criar rapidamente um grupo ou uma variação de um grupo (linha, pilha ou grade):
Uma seta aponta para a opção de grupo depois de clicar nos três pontos na barra de ferramentas.
Adicionar um único bloco a um grupo
Uma seta aponta para os ícones de grupo na barra de ferramentas do bloco.
Agrupar vários blocos

Após clicar no ícone de grupo na barra de ferramentas, os blocos serão colocados dentro de um bloco de grupo.

Selecionar o bloco de grupo

O bloco de grupo tem várias configurações que você pode acessar selecionando o bloco. No entanto, não é possível selecionar um bloco de grupo clicando nele, porque clicar em qualquer bloco interno (conhecido como bloco secundário) o selecionará em vez do bloco de grupo como um todo (conhecido como bloco principal).

Há alguns métodos diferentes que você pode usar para selecionar o bloco de grupo principal:

Visualização em lista

Você pode selecionar o bloco de grupo usando a visualização em lista na parte superior da tela do editor. O bloco de grupo é mostrado aqui, com todos os seus blocos internos listados abaixo:

A opção Visualização em lista foi expandida para mostrar os diferentes blocos na página, com o bloco de grupo destacado.
Um bloco de grupo na visualização em lista

Seletor de bloco principal na barra de ferramentas

Quando você clica em um bloco que foi agrupado, o ícone de bloco de grupo é exibido na barra de ferramentas dele. O ícone do bloco de grupo, representado por dois quadrados sobrepostos, é exibido à esquerda do bloco selecionado. Você pode clicar nelepara selecionar o bloco de grupo:

Uma seta aponta para o ícone do bloco de grupo na barra de ferramentas.

Barra de ferramentas do bloco de grupo

Ao clicar no bloco de grupo, aparecerá acima uma barra de ferramentas com opções:

A barra de ferramentas do bloco de grupo, com ícones para mover o bloco, alterar o alinhamento e o menu Mais opções.
Barra de ferramentas do bloco de grupo

Os ícones na barra de ferramentas do bloco de grupo são, da esquerda para a direita:

Configurações do bloco de grupo

Ao selecionar um bloco, serão exibidas configurações adicionais na barra lateral direita. Se você não estiver vendo a barra lateral, clique no ícone Configurações, no canto superior direito, para exibi-las. Esse ícone se parece com um quadrado com duas colunas irregulares:

O ícone de configurações no editor com a dica de ferramenta "Configurações" abaixo dele.
Clique no ícone Configurações para abrir as configurações do bloco

Transformar em linha, pilha ou grade

Alterne o bloco de grupo para uma das seguintes variações:

Configurações do layout

Use as configurações de layout para controlar a largura e a posição dos blocos dentro de um grupo:

Configurações de layout no bloco de grupo

Quando a opção Os blocos internos usam a largura do conteúdo está desativada, os blocos adicionados dentro do bloco de grupo preenchem a largura da área de conteúdo padrão da página.

Para ter mais controle sobre a largura dos blocos internos, ative a opção Os blocos internos usam a largura do conteúdo. Você pode especificar a largura dos blocos internos usando as seguintes opções:

Não há opção para definir a largura da opção Largura total , pois os blocos definidos como largura total preenchem a tela toda por padrão.

Configurações de layout do bloco de grupo

Use a configuração Justificação para alinhar os blocos internos à esquerda, à direita ou ao centro do grupo.

Configurações de posição

Defina a posição do bloco de grupo como Fixa para que o grupo fique fixado na parte superior da janela à medida que o visitante rolar para baixo. Um ícone de alfinete aparecerá ao lado do bloco de grupo na visualização em lista.

Um GIF animado mostrando um exemplo de grupo fixado na parte superior da tela conforme o leitor rola para baixo.
A caixa de assinatura é um grupo fixado na parte superior da tela

Somente grupos de nível superior podem ser definidos como fixos. Certifique-se de que o bloco de grupo não esteja aninhado em nenhum outro bloco para a fixação funcione.

Se a configuração de posição estiver definida como Padrão, o grupo aparecerá na ordem apresentada na página.

Avançado

Saiba mais sobre as configurações avançadas de bloco.

Agrupar estilos de bloco

Na barra lateral de configurações do bloco, clique no ícone Estilos para acessar as configurações de design do bloco. O ícone Estilos tem a forma de um círculo com a metade preenchida:

Uma seta aponta para o ícone Estilos, no qual você pode clicar para abrir a seção de estilos do bloco.

Aqui, você pode definir a cor do texto, a cor de fundo, o tamanho e as fontes do texto, o preenchimento, a margem e o espaçamento do bloco. Consulte os guias a seguir para obter mais detalhes sobre como usar essas configurações:

Imagem de fundo

Nos estilos de bloco de grupo, você também pode definir uma imagem de fundo para ser exibida atrás do conteúdo do bloco:

  1. Selecione o bloco de grupo.
  2. Na barra lateral de configurações à direita, clique na guia Estilos.

Se você não estiver vendo a barra lateral à direita, clique no ícone de Configurações no canto superior direito para exibir as configurações. Esse ícone é um quadrado com duas colunas de tamanhos diferentes.

Ícone de Configurações na parte superior do editor do WordPress realçado.
O ícone de Configurações no canto superior direito
  1. Em Plano de fundo, clique em Imagem de fundo para ver as seguintes opções:
    • Abrir biblioteca de mídia: selecione uma imagem existente na mídia do seu site.
    • Fazer upload: adicione uma nova imagem do seu computador ou dispositivo.
    • Redefinir: remova a imagem de fundo.

A imagem de fundo terá prioridade sobre qualquer cor de fundo definida.

Ao clicar no menu de três pontos ao lado de Imagem de fundo, você poderá definir o tamanho da imagem:

Se as opções Conter ou Fixo forem escolhidas, será possível escolher se a imagem será repetida usando a configuração Repetir imagem.

Opções exibidas para definir o tamanho das imagens de fundo dos blocos de grupo.

Desagrupar blocos

Se quiser remover um bloco de grupo sem apagar os blocos internos, desagrupe os blocos. Siga estas etapas:

  1. Selecione Visualização em lista na parte superior da tela de edição.
  2. Selecione o bloco de grupo.
  3. Clique nos três pontos ao lado do bloco de grupo.
  4. Selecione a opção Desagrupar.
GIF mostrando a ação de selecionar Desagrupar na barra de ferramentas do bloco.
Copied to clipboard!