O guia completo para miniaturas e tamanhos de imagem em destaque no WordPress

O guia completo para miniaturas e tamanhos de imagem em destaque no WordPress

Uma imagem vale mais que mil palavras - a menos que tenha sido redimensionada inadequadamente, caso em que é um pouco embaraçoso. O WordPress contém ferramentas poderosas para redimensionar imagens e miniaturas, mas você precisa saber como lidar com elas.





Leia tudo o que você precisa saber sobre tamanhos de imagem no WordPress e gerenciamento de imagens em destaque.





Editando PHP em arquivos WordPress

Esta postagem contém código PHP para WordPress. Você pode querer ler nosso curso intensivo de PHP grátis antes de tentar qualquer modificação em seu tema.





Se você não se sentir confortável em abrir seus arquivos de tema, ou não quiser porque eles serão perdidos com futuras atualizações de tema, você pode usar o Minhas funções personalizadas plugin para adicionar blocos de código.

https://en-gb.wordpress.org/plugins/my-custom-functions/



Noções básicas de tamanho de imagem do WordPress

No painel de administração do WordPress, você provavelmente já conhece Definições > Metade.

o que instalar no novo pc

Estes são os três tamanhos de imagem padrão, que o WordPress chama de: miniatura , médio , e ampla . O tamanho da miniatura tem uma configuração especial para ser cortado na dimensão exata que você especificar aqui. Não precisa ser uma dimensão de proporção 1: 1 --- você pode defini-la como quiser.





Quando o corte estiver ativado, as imagens serão dimensionadas e centralizadas, então tudo o que não couber será descartado.

As configurações de médio e grande porte funcionam de maneira um pouco diferente, pois você especificará máximo dimensões para largura e altura, e as imagens serão reduzidas de acordo. Se a imagem for muito pequena, esses tamanhos de imagem não serão criados.





Quando você carrega uma nova imagem, o original é salvo e fica disponível para inserção em uma postagem em tamanho real, e os outros tamanhos de imagem registrados são criados automaticamente.

Adicionando tamanhos de imagem personalizados no WordPress

Os três tamanhos definidos por padrão no WordPress podem não ser suficientes, e é por isso que os temas e plug-ins podem adicionar seus próprios tamanhos personalizados. Se você se sentir confortável editando seus arquivos de tema, também pode fazer isso.

Abra o diretório do tema e procure o functions.php Arquivo. Adicione o seguinte código, um para cada tamanho de imagem que você deseja definir:

add_image_size( 'my-thumbnail', 400, 200, true);

Cada novo tamanho de imagem precisa de um nome, dimensões de largura e altura e se as imagens devem ou não ser cortadas exatamente neste tamanho ( verdade ou falso ) Para partes estruturais de um tema ou widget, geralmente convém recortar para não quebrar o layout.

Você pode ficar tentado a criar muitos tamanhos de imagem personalizados, mas deve fazer isso com moderação. Cada tamanho de imagem que você definir será gerado para cada imagem que você carregar, mesmo se você planejou isso apenas para nós com a imagem em destaque.

Portanto, se você tiver sete tamanhos de imagem personalizados, mais os três padrões, cada imagem que você carregar gerará 10 pequenas cópias de si mesma. Se você considerar que uma única postagem pode ter 10 imagens incorporadas, são 100 arquivos sendo criados apenas para aquela postagem.

Você não pode criar um tamanho de imagem personalizado e especificar que ele deve ser usado apenas para as imagens apresentadas.

Além disso, mesmo se você não estiver mais usando um determinado tamanho personalizado e tiver excluído esse código (ou alterado os temas), as imagens antigas permanecerão no servidor para sempre. O WordPress não excluirá imagens não utilizadas para você. Em um site tão antigo ou tão grande quanto MakeUseOf, isso significa que algumas centenas de gigabytes são desperdiçados no armazenamento de imagens que não são mais usadas.

Para sites menores, o Limpador de mídia plugin pode ajudar, mas sempre execute um backup completo primeiro.

https://wordpress.org/plugins/media-cleaner/#description

Tamanhos de imagem personalizados para uso em conteúdo de postagem

Por padrão, os tamanhos de imagem personalizados não aparecem na caixa suspensa ao inserir uma imagem em uma postagem. A única coisa que você verá lá é Miniatura, Médio, Grande e Tamanho Completo (dependendo do tamanho da imagem original, já que não será aumentada).

Se você quiser que seu tamanho personalizado também esteja na lista, precisaremos de um pouco mais de código. Novamente, adicione ao seu functions.php Arquivo:

function image_sizes_to_mediapicker( $default_sizes ) {
return array_merge( $default_sizes, array(
'my-thumbnail' => __( 'My Thumbail Size' ),
) );
}
add_filter( 'image_size_names_choose', 'image_sizes_to_mediapicker' );

Isso funciona filtrando a lista do seletor de mídia. Nós mesclamos a matriz da lista de tamanhos original com quaisquer novos tamanhos que também desejamos listados. Altere 'minha-miniatura' e 'Tamanho da minha miniatura' para o tamanho personalizado e o nome legível por humanos que você gostaria que fosse listado.

As imagens apresentadas são uma única imagem associada a uma postagem, mas não necessariamente inserida no conteúdo da postagem. Eles costumam ser usados ​​por temas no cabeçalho, na página inicial ou na barra lateral. No entanto, em termos de dimensionamento de imagem, eles não são tratados de forma diferente das imagens normais.

Para cada tamanho que você definiu, qualquer imagem enviada será duplicada e redimensionada, incluindo a imagem em destaque.

o gerenciador de tarefas foi desabilitado pelo seu administrador

Se você não vê a opção de Definir imagem em destaque na tela de edição de postagem, é possível que seu tema não seja compatível com o recurso. Você pode forçar o suporte adicionando a seguinte linha ao seu tema functions.php arquivo, mas eu sugiro fortemente que você encontre um novo tema.

A falta de suporte para algo tão básico como imagens em destaque seria um indicativo de código desatualizado em outro lugar.

add_theme_support('post-thumbnails');

Para usar a imagem em destaque em seu próprio tema ou plug-ins, use the_post_thumbnail () função para gerar a tag da imagem:

the_post_thumbnail('my-thumbnail',array('class'=>'my_post_thumbnail_css_class'));

A função usa 2 parâmetros: o tamanho nomeado que você está procurando (neste caso, 'minha miniatura') e quaisquer atributos que você deseja passar, como uma classe CSS personalizada.

Se você preferir apenas obter o URL real da imagem em destaque, em vez do HTML necessário também, tente fazer isso (obtendo o tamanho médio da imagem neste exemplo):

você pode deletar uma postagem do Facebook?
$thumbnail = wp_get_attachment_image_src(get_post_thumbnail_id(), 'medium');
echo $thumbnail[0];

Gerando imagens em miniatura do WordPress

Sempre que você alterar as dimensões padrão da imagem ou criar um tamanho de imagem personalizado, isso só se aplicará a novo uploads. Todas as suas imagens existentes permanecem nas dimensões originais.

Se você quiser redimensionar imagens carregadas anteriormente, você precisará de um plugin. Reconstrução de miniatura AJAX permite que você selecione quais tamanhos regenerar e trabalhará lentamente em seu arquivo.

https://wordpress.org/plugins/ajax-thumbnail-rebuild/

No entanto, existem algumas limitações e armadilhas que você deve conhecer.

Embora as imagens em destaque possam ser redimensionadas automaticamente, nenhum plugin pode reescrever o conteúdo da postagem. Por exemplo, se você adicionou uma imagem a uma postagem no ampla tamanho (que pode ter sido 500px na época), alterando a definição de ampla não mudará o tamanho da imagem na postagem. Ele permanecerá em 500 px, a menos que você edite a postagem e reinsira a mesma imagem no novo tamanho.

Conforme mencionado, se você tiver muitos tamanhos de imagem, irá gerar muitas imagens. Felizmente, a reconstrução de miniaturas permite limitar isso a apenas imagens em destaque . Mas, novamente, lembre-se de que isso só se aplica à sua imagem anterior. Todos os uploads de imagens futuros serão gerenciados pelo WordPress, o que significa que todos os tamanhos de imagem serão criados para tudo.

Agora seria um ótimo momento para aprender também o diferença entre JPG e PNG para que você saiba como usar o formato ideal no futuro.

Leve o seu site WordPress para o próximo nível

Quer ajustar seu tema WordPress? O uso de imagens, cores e posicionamento de elementos em seu tema é definido principalmente por CSS e HTML, portanto, recomendamos verificar esses tutoriais passo a passo para aprender CSS e HTML.

E se você estiver interessado em temas, dê uma olhada nesses temas legais do WordPress para um portfólio de fotografia.

O seu site WordPress falha com muita frequência? Você está pagando muito? Mude para um serviço de hospedagem bem conhecido como InMotion Hosting (desconto especial MakeUseOf com esse link ) ou Bluehost (desconto especial MakeUseOf com esse link )

Compartilhado Compartilhado Tweet O email Veja por que o FBI emitiu um aviso para Hive Ransomware

O FBI emitiu um alerta sobre uma cepa particularmente desagradável de ransomware. Veja por que você precisa ser especialmente cauteloso com o ransomware Hive.

Leia a seguir
Tópicos relacionados
  • Programação
  • Wordpress
Sobre o autor James Bruce(707 artigos publicados)

James é bacharel em Inteligência Artificial e certificado pela CompTIA A + e Network +. Quando não está ocupado como Editor de Avaliações de Hardware, ele gosta de LEGO, VR e jogos de tabuleiro. Antes de ingressar na MakeUseOf, ele foi técnico de iluminação, professor de inglês e engenheiro de data center.

Mais de James Bruce

Assine a nossa newsletter

Junte-se ao nosso boletim informativo para dicas de tecnologia, análises, e-books grátis e ofertas exclusivas!

Clique aqui para se inscrever