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

Bloco de colunas

O bloco de colunas permite a inserção de texto, mídia e de outros tipos de conteúdo em até seis colunas. Quando usadas sucessivamente, as colunas criam um efeito de grade.

Tutorial em vídeo

Adicionar bloco de colunas

Para adicionar o bloco de colunas, clique no ícone Inserção de bloco (+) e pesquise “colunas”. Clique no bloco para adicioná-lo ao post ou à página.

💡

Usando o teclado, você também pode digitar /colunas em uma nova linha e pressionar Enter para adicionar rapidamente um novo bloco de colunas.

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

Após adicionar o bloco de colunas, escolha o número de colunas que deseja adicionar. Você poderá alterar esse número para incluir ou remover colunas posteriormente.

Bloco de colunas – número de colunas
Selecione a variação de colunas com a qual você deseja começar

Depois de selecionar o número de colunas, você pode clicar nos ícones de + para começar a adicionar blocos a cada coluna. Você pode adicionar quaisquer blocos às colunas.

Barra de ferramentas do bloco

Ao adicionar o bloco, aparecerá uma barra de ferramentas com opções:

Barra de ferramentas do bloco de colunas

A barra de ferramentas do bloco de colunas oferece as seguintes opções:

Configurações do bloco

Ao clicar no bloco, serão exibidas configurações adicionais na barra lateral direita. Se você não estiver vendo a barra lateral, clique no ícone ⚙️ (engrenagem) no canto superior direito para exibir as configurações.

As configurações do bloco estão na barra lateral direita.
Clique no ícone ⚙️ para encontrar as configurações do bloco.

Há dois níveis no bloco de colunas com configurações diferentes, dependendo do que você selecionar:

Se você tiver problemas para selecionar a coluna correta, consulte a seção Selecionar o bloco de colunas.

Configurações gerais das colunas

Essas configurações controlam todas as colunas:

Números de colunas: use o controle deslizante para ajustar o número de colunas, de 1 a 6, ou digite o número no campo à direita.

Mostrar em pilha para celular: esse botão define se as colunas são exibidas na horizontal ou se são empilhadas na vertical quando a página ou post é exibido no dispositivo móvel.

Cor: essa configuração permite definir as cores de fundo e de texto para todas as colunas do bloco de colunas.

Bloco de colunas - configurações de cor
Como selecionar as cores das colunas

Dimensões: aqui você define as margens internas, o espaço em torno dos elementos do seu bloco de colunas. Esta opção é particularmente relevante quando você usa uma cor de fundo.

As margens internas podem ter um único valor para todos os quatro lados. Adicione um valor no campo mostrado aqui:

Configurações de dimensões do bloco de linhas do WordPress.com

As margens internas também podem ter valores diferentes para cada um dos lados. Os números mostrados à direita seguem no sentido horário (acima -> direita -> abaixo -> esquerda). Você pode acessar esta visualização clicando no ícone de link azul mostrado na imagem anterior.

Opções de dimensões do bloco de linhas do WordPress.com
Configurações individuais das colunas

Essas configurações afetam apenas uma única coluna:

Largura: define a largura em pixels de uma coluna selecionada. Você pode alterar o valor da coluna para torná-la mais larga ou mais estreita. As colunas não precisam ter o mesmo valor.

Cor: essas configurações permitem definir as cores do texto e de fundo de uma única coluna.

Dimensões: defina as margens internas de cada coluna individual, conforme descrito anteriormente.

Avançado

Na guia Avançado, você adiciona uma classe CSS ao seu bloco, permitindo a gravação de CSS personalizado para estilizar o bloco. Saiba mais.

A seção Avançado permite adicionar uma classe CSS ao bloco.
A seção Avançado permite adicionar uma classe CSS ao bloco.

Selecionar o bloco de colunas

É possível adicionar, remover e alterar as cores das colunas. Para isso, é importante distinguir entre o bloco de colunas geral e as colunas individuais dentro dele.

Se você estiver editando uma coluna individual, primeiro é preciso selecionar o bloco de colunas geral para alterar a cor e o número de colunas. Isso pode ser feito de várias formas:

Usar a visualização em lista

A Visualização em lista mostra a hierarquia dos blocos, o que facilita selecionar o bloco necessário:

Visualização em lista para ver todos os blocos
Clicar no seletor de bloco principal

Ao trabalhar em apenas uma coluna, selecione o ícone do bloco de colunas geral na barra de ferramentas do bloco:

Saiba mais sobre como selecionar blocos.

Transformar vários blocos em colunas

Se você inseriu vários blocos, um após o outro, e quer mudá-los para colunas, é muito simples. Para fazer isso, siga as etapas abaixo:

  1. Clique e arraste para selecionar todos os blocos que você quer transformar em colunas.
  2. Clique no ícone do bloco ao lado esquerdo da barra de ferramentas do bloco.
  3. Clique em “Colunas” na lista “Transformar em”.
Como transformar vários blocos em colunas

Todos os blocos selecionados mudarão para colunas próprias. O número de colunas será o mesmo que o número de blocos que você selecionou antes de transformar. É possível selecionar de dois a seis blocos.

Copied to clipboard!