Tudo sobre o tamanho das imagens no WordPress

Lidar com imagens no WordPress pode ser um desafio. Se você não prestar atenção nas exigências, você pode bagunçar toda a aparência do seu site ou pode inclusive impactar o tempo de carregamento. Por isso, você precisa aprender sobre o padrão do tamanho das imagens do WordPress e como alterá-las. Relaxe, pegue o seu café e vamos aprender mais essa! 

Como o WordPress Processa Imagens

Quando você faz o upload de uma imagem na biblioteca de mídia, o WorPress gera, automaticamente, imagens adicionais com três tamanhos de imagem padrão e armazena em outro local.

Por essa razão, você vê quatro opções de imagens quando está fazendo o upload de uma imagem. As opções são thumbnail (miniatura), médio, grande e full-size (tamanho original).

As três primeiras opções são chamadas de tamanho de imagens padrão do WordPress, enquanto a opção full-size é o tamanho original da imagem que você fez upload.

O WordPress cria essas opções porque ao usar essas imagens em locais diferentes para serem exibidas exigirá tamanhos diferentes. Por exemplo, a resolução da imagem em thumbnail pode ser diferente da resolução da imagem usada no slide.

Portanto, você não precisa editar e redimensionar suas imagens manualmente se quiser usar as mesmas imagens em locais diferentes com resoluções diferentes. Você só precisa adicionar uma imagem e o WordPress fará o resto.

Qual é o Padrão do Tamanho das Imagens do WordPress?

Por padrão, o WordPress vem com três tamanhos de imagens pré-estabelecidos. São eles:

• Thumbnail (miniatura): (150px quadrangular);
• Tamanho médio: (máximo 300px largura e altura);
• Tamanho grande: (máximo 1024px largura e altura);
• Tamanho original: (tamanho original da imagem que você fez upload).

Como Alterar o Padrão do Tamanho das Imagens do WordPress

Embora o WordPress já oferece três tamanhos de imagem padrão, se você perceber que essas opções não atendem às suas necessidades, existem alternativas.

Talvez você precise de thumbnails menores ou imagens em destaque maiores. Portanto, você precisa alterar os tamanhos de imagem padrão do WordPress. Para fazer isso, siga as etapas abaixo:

1. Acesse o Painel do Administrador;
2. Passe o mouse em Configurações -> Mídia;
3. Na janela de configurações de mídia, você pode ajustar o pixel desejado para cada tamanho;
4. Clique em Salvar Alterações para finalizar.

Como Adicionar Tamanho de Imagens Personalizado no WordPress

Então, você tem os três tamanhos de imagem padrão. Digamos que você tenha uma imagem em tamanho thumbnail para sua miniatura, uma imagem de tamanho médio para a imagem do seu post e uma imagem de tamanho grande para seu slide.

Mas você percebe que precisa de mais tamanhos de imagem padrão para seu banner, pop-up e widgets. Você pode adicionar tamanhos de imagem personalizados do WordPress? Sim você pode.

1º Passo. Adicionar Tamanhos de Imagens Personalizados no WordPress via Arquivo function.php

Na verdade, alguns temas já oferecem opções adicionais de tamanho de imagem. Mas, se você não encontrá-los, adicione o tamanho de imagem personalizado do WordPress que faremos agora.

Você vai lidar com códigos agora. Então, não esqueça de fazer um backup dos arquivos e criar um tema filho do seu WordPress antes de qualquer mudança.

1. Acesse o painel do administrador;
2. Passe o ponteiro do mouse em Aparência -> Editor de Temas
3. Edite o arquivo functions.php;
4. Copie o script abaixo e cole no arquivo add_theme_support( ‘pop-up-banner’ );
5. Aperte o botão Atualizar Arquivo.

O script acima irá ativar a função add_image_size(). Se já estiver ativada, você pode adicionar novas imagens WordPress como a seguir:

1. add_image_size( 'pop-up banner size', 1000, 590 );
2. add_image_size( 'widget size', 220, 180 );

No exemplo, você nomeará os novos tamanhos como  “Pop-up banner size” e “Widget size.” Os números a seguir do tamanho correspondem a largura e altura.

2º Passo. Exiba as Imagens com Tamanhos Customizados no seu Tema

Você conseguiu adicionar os novos tamanhos de imagem com sucesso, mas ainda não está sendo exibido no seu tema. Agora, você tem que ativar os novos tamanhos ao seu tema.

Primeiro, faça um backup do seu site antes de qualquer mudança. Acesse seu arquivo de tema dentro do loop de posts e edite-o. Agora, cole o código: 

1. <?php the_post_thumbnail( 'your-specified-image-size' ); ?>

Você deve alterar ‘your-specified-image-size` com o nome que você definiu na etapa anterior. Por exemplo, você pode alterá-lo para “tamanho do banner pop-up”.

Depois destas etapas, você vai encontrar opções de tamanho de imagem de banner pop-up ao carregar imagens na sua biblioteca de mídia.

Plugins Para Ajudar

Você definiu um novo tamanho de imagem personalizado no WordPress. Porém, essa alteração não afetará suas imagens anteriores. Para isso, você precisa regenerar os tamanhos de imagem anteriores.

Para sua sorte, você não precisa fazer isso manualmente. Existe um plugin chamado Regenerate Thumbnails, que o ajudará a atualizar o tamanho das imagens anteriores. Siga as etapas abaixo para fazer isso.

1. Acesse o painel do administrador;
2. Clique em Plugins -> Adicionar Novo;
3. Pesquise por Regenerate Thumbnails;
4. Instale e ative o plugin;
5. Agora, acesse Ferramentas -> Regenerate Thumbnails;
6. Clique no botão Regenerate Thumbnails For X Attachments;
7. Todas as imagens que você fez upload anteriormente serão regeneradas para as novas configurações de imagem.

Conclusão

Os tamanhos de imagem do WordPress parecem um detalhe pequeno, mas, na verdade, podem causar dor de cabeça. Você pode descobrir que a imagem que você carrega não atende ao tamanho exigido. 

Para resolver isso, você pode tentar dois métodos. Você pode alterar os tamanhos de imagem padrão do WordPress ou adicionar tamanhos de imagem personalizados.

Antes de configurar o novo tamanho da imagem, lembre-se de que enviar imagens grandes com alta resolução não é uma boa ideia. Imagens de tamanho grande ocupam muito espaço e diminuem o tempo de carregamento dos sites. 

Esperamos que este artigo ajude você a escolher as imagens certas, no lugar certo, com os tamanhos certos. Até logo!

Todo o conteúdo dos tutoriais deste site segue os rigorosos padrões editoriais e valores da Hostinger.