Obs.: embora os nossos guias mais acessados tenham sido traduzidos para o português, outros guias estão disponíveis apenas em inglês.

Redimensionar uma imagem

Quando você adiciona um Bloco de Imagem a uma página ou publicação do blog, vários fatores afetam o tamanho dele no seu site:

Este explica esses fatores e as diferentes opções de redimensionamento de imagem.

Assista a este vídeo

Antes de começar

  • Este guia trata do redimensionamento dos Blocos de Imagem, que permitem adicionar imagens a Páginas de Layout, publicações do blog e outras áreas de conteúdo no Squarespace. Para saber mais sobre outros tipos de imagens, consulte nossas informações sobre outras imagens.
  • Recomendamos fazer o upload de uma imagem que tenha largura entre 1500 e 2500 pixels. Esse intervalo é a melhor opção para imagens com boa aparência, mas que não sobrecarregam seu site.
  • Ao usar um layout predefinido com um marcador de posição Bloco de Imagem, adicione sua própria imagem ao bloco antes de tentar redimensioná-lo.

Redimensionar com outros blocos

Ao adicionar um Bloco de Imagem, ele se expande para preencher a largura total da área de conteúdo. Para diminuir o tamanho do Bloco de Imagem, adicione blocos a ambos os lados. Como a proporção da imagem (largura e altura) permanece a mesma, a imagem inteira diminui, mantendo a mesma forma.

A forma mais comum de fazer isso é com o bloco de espaçamento, que cria espaços em branco. Para redimensionar o bloco de imagem, adicione um bloco de espaçamento à esquerda ou à direita do bloco de imagem e arraste o cursor de redimensionamento.

  1. Clique em um ponto de inserção para adicionar um Bloco de Espaço.
  2. Arraste o bloco espaçador para a esquerda ou para a direita do bloco de imagem.
  3. Clique e arraste o cursor de redimensionamento.

Redimensionar uma imagem para torná-la menor, usando outro bloco.

Para centralizar a imagem, adicione blocos de espaçamento de tamanho igual em ambos os lados.

Arrows_pointing_to_two_Spacer_Blocks_with_an_image_in_between_the_blocks.jpg

Outros blocos

Você pode usar o mesmo método com outros blocos. Isso é especialmente útil para textos lado a lado com imagens, como mostrado no .gif abaixo.

Resizing_an_Image_Block_using_a_Text_Block.gif

Recorte a imagem original

Para alterar a altura e a forma de uma imagem, recorte partes dela.

Para recortar a imagem original, use o Editor de imagem integrado (imagem abaixo); ou use um software externo e carregue a imagem novamente.

Dica: geralmente, as imagens recortadas permanecerão com a mesma largura no seu site. Para alterar a largura, use um dos outros métodos neste guia.

editor_imagem_-exemplo_cortar.jpg

Use a ferramenta de recorte

Uma opção para os layouts Alinhados e layouts de Poster é clicar e arrastar a ferramenta de recorte para cortar a imagem verticalmente. Isso mantém a largura da imagem, mas altera sua altura.

  1. Clique no Bloco de Imagem. Aparecerá uma margem com um cursor de recorte circular na parte inferior.
  2. Clique e arraste o cursor de recorte para recortar a imagem.

Dicas:

  • 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.
  • A ferramenta de recorte só aparece após você adicionar uma imagem.
  • Para centralizar a imagem recortada, use os pontos focais.
  • Clique duas vezes no cursor de recorte para desfazer o corte.
  • Puxe a alça para baixo para ampliar a imagem.

Decreasing_the_height_of_an_image_using_the_cropping_handle.gif

Clique e arraste o cursor de recorte para baixo para cortar na horizontal. A imagem é ampliada, recortando os lados.

Dragging_the_cropping_handle_down_to_horizontally_crop_an_image.gif

Redimensionar com estilos de bloco de imagem

Os layouts de Cartão, Sobreposição e Colagem oferecem opções de redimensionamento nas configurações de estilo.

  1. Ao editar uma página, abra Estilos do Site e clique em Blocos de Imagem.
  2. Acesse a seção desse layout (por exemplo: role até a seção Bloco de Imagem: cartão).
  3. Use o ajuste de Largura de imagem para alterar o tamanho. O texto da imagem será ajustado automaticamente de acordo com o espaço.
  4. Clique em Salvar.
  1. No Menu Inicial, clique em Design e depois em Estilos do Site.
  2. Acesse a seção desse layout (por exemplo: role até a seção Bloco de Imagem: cartão).
  3. Use o ajuste de Largura de Imagem para alterar seu tamanho. O texto da imagem ficará automaticamente maior ou menor para caber no espaço.
  4. Clique em Salvar.
Dica: isso afeta todos os Blocos de Imagens com esse layout.

Amplie a imagem para preencher o bloco

Ao usar o layout Inline, se imagem for menor do que o Bloco de Imagem, ela manterá a largura original. Você verá um espaço em branco nos dois lados da imagem dentro do bloco. Isso preserva a qualidade da imagem original.

Para preencher o espaço em branco e fazer com que a imagem ocupe toda a largura do bloco:

  1. Abra o Bloco de Imagem e clique em Design.
  2. Ative a opção Esticar.

Dicas:

  • Esticar uma imagem pode afetar sua qualidade.
  • Para reduzir a necessidade de alongamento, recomendamos fazer o upload da imagem com largura entre 1500 e 2500 pixels.
  • Se a imagem for mais larga do que a área do Bloco de Imagem, ela será encolhida para caber (sem corte).
  • Os outros layouts são ampliados automaticamente.

Arrow_pointing_to_the_Stretch_setting_in_the_Inline_Image_Block.jpg

Opções por layout

Veja a seguir uma referência rápida sobre as diferentes opções disponíveis em cada layout:

Opção Alinhado Pôster Cartão Sobreposição Colagem Stack (Pilha)
Redimensionamento com blocos
Recorte a imagem original
Ferramenta de corte
Estilos do site

Ampliar para preencher n/d n/d n/d n/d n/d

Outras imagens

Seu site tem outras opções para adicionar imagens, cada uma com sua própria opção de redimensionamento:

Dica: em qualquer bloco, é possível usar o método de Redimensionamento com outros blocos.
Este artigo foi útil?
Utilizadores que acharam útil: 159 de 577