Colocando Seções Lado a Lado (Colunas)
Por padrão, cada seção de uma página ocupa a largura total e fica abaixo da anterior. A seção Colunas muda isso: ela divide uma faixa da sua página em 2, 3 ou 4 colunas, e você decide o que vai em cada uma.
Você pode colocar dois tipos de elementos em uma coluna:
- Blocos pequenos — um título, um parágrafo, uma imagem, um botão ou um ícone com texto. Rápidos de adicionar, editados diretamente dentro da seção Colunas.
- Seções inteiras — qualquer tipo de seção: Último Sermão, Eventos, um formulário de contato, uma galeria, Horários de Culto. Arrastadas da sua página.
No celular, as colunas sempre se empilham uma abaixo da outra para que nada fique espremido.
Adicionando uma seção Colunas
- Acesse Website Studio > Páginas e abra a página que deseja editar.
- Clique em Adicionar seção.
- Escolha Colunas (no grupo Layout).
Ela chega com três colunas já preenchidas com um exemplo, para que você veja o formato imediatamente. Substitua ou exclua essas colunas como quiser.
Escolhendo o layout
Clique no ícone de editar (lápis) na seção Colunas para abrir suas configurações.
| Configuração | O Que Faz |
|---|---|
| Colunas | 2, 3 ou 4 colunas. |
| Larguras das colunas | Iguais, ou torne uma coluna mais larga: Primeira coluna larga, Última coluna larga, ou Coluna do meio larga (apenas 3). |
| Espaço entre | Quanto espaço fica entre as colunas: Pequeno, Normal ou Grande. |
| Alinhar texto | Esquerda ou Centralizar, aplicado a tudo dentro das colunas. |
| Alinhar colunas | Superior alinha as colunas pelo topo (melhor quando têm quantidades diferentes de conteúdo). Centralizar as centraliza entre si. |
Primeira coluna larga é o clássico layout "conteúdo principal com uma barra lateral estreita" — bom para um artigo com uma caixa de doações ou os horários de culto ao lado.
Adicionando blocos pequenos a uma coluna
Nas configurações de Colunas você verá um cartão para cada coluna. Use os pequenos botões no canto superior direito de um cartão para adicionar um bloco:
| Botão | Adiciona |
|---|---|
| Título | Um cabeçalho. |
| Parágrafo | Um parágrafo. |
| Imagem | Uma imagem, com uma descrição para leitores de tela. |
| Botão | Um link no estilo de botão, com um ícone opcional. |
| Ícone | Um ícone com um título e uma linha curta de texto. |
Cada bloco tem setas para movê-lo para cima ou para baixo dentro da sua coluna, e um x para removê-lo. Uma coluna pode conter até dez blocos.
Colocando uma seção inteira em uma coluna
É assim que você faz um sermão, uma lista de eventos ou um formulário ficarem ao lado de outra coisa.
- No editor de páginas, olhe para a seção Colunas. Abaixo dela você verá uma área de soltar para cada coluna, rotulada Coluna 1, Coluna 2, e assim por diante.
- Arraste qualquer seção da lista da sua página para a coluna desejada, usando a alça de arrastar (o ícone de linhas horizontais à esquerda do cartão da seção).
- Solte. O movimento se salva sozinho.
Para tirar uma seção de volta, arraste-a da coluna para cima, para a lista principal da página.
Você também pode adicionar uma nova seção diretamente em uma coluna, em vez de mover uma existente.
Em um celular ou tablet, as áreas de soltar das colunas se empilham uma abaixo da outra, então cada uma fica com a largura total e é fácil de soltar nela.
O que pode e não pode ser aninhado
- Qualquer tipo de seção pode entrar em uma coluna — não existe uma lista de seções "permitidas".
- Uma seção Colunas não pode entrar dentro de outra seção Colunas. Um único nível de colunas mantém as páginas legíveis, especialmente no celular.
Se você tentar algo que não é permitido, o TimelyChurch informa o que aconteceu e nada é alterado.
Como as colunas se comportam em telas diferentes
As colunas não estão presas a tamanhos de tela fixos. Em vez disso, o TimelyChurch mantém cada coluna larga o suficiente para ser lida:
- No computador, você obtém o número de colunas que escolheu.
- No tablet, se o número escolhido tornasse cada coluna estreita demais, ele diminui automaticamente para menos colunas.
- No celular, as colunas sempre se empilham em uma só.
Isso importa mais quando uma coluna contém uma seção inteira — um cartão de sermão ou uma lista de eventos precisa de mais espaço do que uma linha de texto, e o layout dá esse espaço em vez de espremê-lo.
Alterando o número de colunas depois
Se você reduzir o número de colunas — digamos, de 4 para 2 — tudo o que estava nas colunas removidas é movido para a última coluna restante, e o TimelyChurch avisa que isso aconteceu:
1 seção estava em uma coluna que este layout não tem mais, por isso foi movida para a última coluna.
Nada é excluído e nada fica oculto. Arraste para onde quiser a partir daí.
Ideias para usar colunas
- Três caixas de "próximo passo" — um ícone, um título, uma linha de texto e um botão em cada coluna.
- Sermão e eventos lado a lado — solte a seção Último Sermão em uma coluna e Eventos em outra.
- Artigo com barra lateral — escolha Primeira coluna larga, coloque seu texto na coluna um e uma seção de doações ou horários de culto na coluna dois.
- Uma linha de cartões de ministério — quatro colunas, cada uma com uma imagem, um título e um botão.
Artigos Relacionados
- Seções do Site — todos os tipos de seção disponíveis
- Adicionando uma Linha de Botões — vários botões em linha, com ícones
- Criando Páginas
- Personalizando o Design