Redimensionar blocos

Altere os blocos de conteúdo no seu site para ficarem maiores ou menores.

Ultima atualização 17 de Junho de 2024

Você pode ajustar o tamanho de um bloco a qualquer momento para alterar o layout e expor o conteúdo de novas maneiras. A forma de ajustar o tamanho do bloco depende do editor, e cada bloco pode ter um comportamento diferente após esse ajuste. Este guia analisa algumas formas de ajustar o tamanho de um bloco.

Os exemplos neste guia usam a página de layout, mas é possível adicionar e ajustar o tamanho dos blocos em áreas diferentes do site. Para ajuda na reorganização dos blocos em uma área de conteúdo, confira Movendo blocos para personalizar o layout.

Assista ao vídeo  

Ajuste o tamanho de um bloco no Editor Intuitivo

O Editor Intuitivo é o mais novo recurso para edição de conteúdo do Squarespace, disponível nos sites da versão 7.1 onde você pode adicionar uma seção de blocos. Se aparecer o botão Adicionar bloco no canto superior esquerdo quando você estiver editando, essa seção usa o Editor Intuitivo.

No Editor Intuitivo, clique e arraste para ajustar o tamanho do bloco diretamente na página:

  1. Clique em Editar na página.
  2. Clique no bloco que deseja redimensionar. Para redimensionar vários blocos ao mesmo tempo, clique e arraste no fundo da seção para realçar todos os blocos que deseja redimensionar.
  3. Passe o cursor sobre um dos quadrados no contorno de um bloco até que o cursor vire seta; em seguida, clique e arraste para aumentar ou diminuir a largura e/ou a altura do bloco. Para ajustar simetricamente o tamanho o bloco, segure ou Ctrl enquanto arrasta. Aparecerá uma grade em segundo plano para orientar o ajuste.
  4. Clique no ícone Tela na versão móvel para ajustar o tamanho do bloco no layout para versão móvel. O ajuste do tamanho dos blocos na versão para computador não afeta o layout para versão móvel.
  5. Clique em Salvar para salvar as alterações e continuar editando ou clique em Sair e depois em Salvar para fechar o editor.
    .

O ajuste do tamanho varia de acordo com o tipo de bloco. Você pode, por exemplo, alterar a largura do bloco de formulário, mas a única forma de alterar a altura é adicionando ou excluindo campos.

Anotação

no Editor Intuitivo, o ajuste de estilo "Largura da página (máx)" pode afetar a capacidade de alterar o tamanho dos blocos. Se não for possível fazer isso, tente alterar o valor para uma largura maior.

Indicadores de ajuste do tamanho

Ao ajustar o tamanho de um bloco, os indicadores amarelos aparecem quando o bloco tem a mesma altura, largura ou ambos de outros blocos na seção. Ao alterar a largura de uma imagem acima de um botão, por exemplo, aparecem indicadores amarelos na margem superior ou inferior de ambos os blocos quando a largura do bloco de imagem corresponder à do bloco de botões. Ao alterar a altura, os indicadores amarelos aparecem na margem esquerda ou direita quando as alturas coincidem; quando os blocos têm a mesma largura e altura, os indicadores contornam o bloco inteiro.

When_resizing_blocks__indicators_display_when_boxes_match_height__width__or_both.png

When_resizing_blocks__indicators_display_when_boxes_match_height__width__or_both.png

Ajuste o tamanho do bloco no editor clássico

Todos os sites da versão 7.0 e locais específicos nos sites da versão 7.1 usam nosso editor clássico nas áreas de conteúdo de bloco. No editor clássico, quando dois ou mais blocos são colocados um ao lado do outro, o tamanho deles é ajustado entre si. Você pode usar isso para ajustar o tamanho dos blocos.

Em particular, os blocos de espaçamento criam um espaço vazio e podem ter o tamanho ajustado para aumentar ou diminuir os blocos ao redor. Para centralizar um bloco na área de conteúdo, por exemplo, adicione um bloco de espaçamento a cada lado e ajuste-os para que fiquem do mesmo tamanho.

Dica

aparecem linhas pretas quando você clica e arrasta os blocos. Se a linha guia se estender apenas pela altura do bloco a ser ajustado, o bloco de espaçamento ajustará apenas esse bloco. Se a linha guia se estender por toda a altura da área de conteúdo, será criada uma nova coluna.

Para ajustar o tamanho com blocos:

  1. Clique em um ponto de inserção.
  2. Selecione Espaçador ou outro bloco no menu de blocos.
  3. Clique e arraste o novo block ao lado do bloco a ser ajustado.
add_spacer.gif
  1. Passe o cursor entre os dois blocos até ele virar um ajustador de colunas. Depois, clique e arraste para ajustar o tamanho deles. Dessa forma, os blocos vizinhos terão o tamanho alterado, criando mais espaço vazio na área de conteúdo.
centering_with_spacers.gif

Dica

para criar layouts mais avançados, confira nossos guias sobre movimentação de blocos e criação de linhas e colunas.

Alças de corte no editor clássico

No editor clássico, você pode alterar a altura de certos blocos com uma alça de corte para que o conteúdo tenha o tamanho ajustado sem distorção. A alça de corte está disponível nestes blocos:

Para usar a ferramenta de corte, clique no bloco, depois clique e arraste o círculo exibido na parte inferior do bloco.

Dicas para usar o bloco com alça de corte:

  • Para redimensionar a imagem em incrementos de 20 pixels, mantenha pressionada a tecla Shift enquanto arrasta a ferramenta de recorte. Isso alinha a parte inferior da imagem com outro bloco.
  • No bloco de imagem, a alça de corte só aparece após se adicionar uma imagem.
  • Clique duas vezes no cursor de recorte para desfazer o corte.
  • Puxe a alça para baixo para ampliar o bloco.
  • Clique e arraste o cursor de recorte para baixo para cortar na horizontal. No bloco de imagem, a imagem é ampliada, recortando os lados.
cropping_handle.gif
Footer Image
  • Peça ajuda à nossa comunidade

  • Peça ajuda à nossa comunidade sobre personalizações avançadas.

  • Contrate um Squarespace Expert

  • Ganhe destaque on-line com a ajuda de um designer ou desenvolvedor experiente.