Miniaturas de posts estão se tornando mais populares a cada dia. Muitos temas de revistas associam uma imagem a um post específico, que eles exibem posteriormente na página inicial ou na página do post. Exibimos uma miniatura com nossos posts tanto na página do post quanto na página da categoria. Em versões mais antigas, essa funcionalidade era obtida com o uso do método de campo personalizado, que não era muito amigável. Graças aos Desenvolvedores Principais do WordPress, juntamente com muitos recursos notáveis no WordPress 2.9, essa função também foi adicionada ao núcleo.
Simply watch the video or read the tutorial below 
Vídeo
Guia para Iniciantes
Você verá uma opção como esta na barra lateral do seu Painel de Escrita de Posts no WordPress Dashboard.
Clique no link e você será levado a uma página de upload de imagem. Faça o upload da imagem e você verá algo assim:
Basta clicar no link que diz "usar como miniatura". Depois de fazer isso, você verá uma tela como esta:
A tela acima significa que você terminou. Simplesmente clique em publicar e a imagem será exibida em seu site.
Guia do Desenvolvedor
Embora essa funcionalidade tenha sido adicionada ao núcleo, nem todos os usuários verão essa opção na barra lateral do painel de escrita de posts. Esta é uma daquelas funções que só podem ser habilitadas se o tema as suportar. Temas gratuitos mais antigos podem não suportá-la, então você precisará pedir ao desenvolvedor para atualizar, ou você pode fazer isso sozinho seguindo este tutorial.
Primeiro, você precisará abrir seu arquivo functions.php na pasta do seu tema e colar o seguinte código:
add_theme_support( 'post-thumbnails' );
Este código habilitará o suporte do tema para posts e páginas. Assim, agora você poderá ver uma opção em seu painel. Mas ela não será exibida em seus temas porque ainda não adicionamos o código ao tema.
Você pode exibir a miniatura em qualquer lugar dentro de o Loop usando este código:
<?php the_post_thumbnail(); ?>
Essa foi a função básica, mas se você quiser algo mais avançado, como especificar o tamanho da miniatura do post, você só precisará abrir seu arquivo functions.php e colar o código assim:
add_theme_support( 'post-thumbnails' ); set_post_thumbnail_size( 50, 50, true );
As dimensões são definidas nesta ordem: largura x altura e são em pixels.
Você também pode adicionar tamanhos de imagem adicionais para sua imagem destacada adicionando esta linha:
add_image_size( 'single-post-thumbnail', 590, 180 ); // Permalink thumbnail size
Você pode chamar os tamanhos específicos de miniatura em seu loop de postagem assim:
<?php the_post_thumbnail('single-post-thumbnail'); ?>
Esta é uma versão simplificada da funcionalidade completa deste recurso. Tentamos mantê-lo simples, para que todos possam segui-lo. Se você quiser mais informações sobre esta funcionalidade, confira:
Artigo de Mark Jaquith sobre Miniaturas de Posts
WordPress Codex
Chrissy
Isso é necessário com Temas Filhos do Genesis. Eles parecem ter uma imagem destacada para seus posts já. Obrigado
Equipe Editorial
Não, isso não é necessário com temas Genesis.
Admin
Divya
Olá,
No meu tema não há loop.php, então onde preciso editar?
Agradeço desde já
Equipe Editorial
O loop pode estar em seu index.php, single.php, archive.php e outros arquivos.
Admin
A. Suriel
Eu tentei o widget e ele está funcionando bem. Obrigado pela dica.
Kathleen Smitheram
Então… eu tentei isso e acho que quebrei meu site. Agora recebo este erro
Parse error: syntax error, unexpected ‘”‘ in /home/content/21/10729521/html/wp-content/themes/desk-mess-mirrored/functions.php on line 642
e não consigo acessar meu painel. Sou novo em auto-hospedagem e não tenho ideia de como consertar isso. AJUDA!
Equipe Editorial
Por favor, leia este artigo:
https://www.wpbeginner.com/beginners-guide/beginners-guide-to-pasting-snippets-from-the-web-into-wordpress/
Acreditamos que você cometeu um erro ao colar o código corretamente.
Admin
Nik
Ótimo tutorial!
Pergunta rápida:
Você disse: Se você não vir “usar como miniatura”, talvez precise ir ao PHP porque o tema é um tema antigo.
Onde eu procuraria no novo layout do WordPress para ver se “usar como miniatura” está presente no meu tema?
Aqui está uma imagem para ajudar a explicar o que quero dizer com “novo layout do WordPress”.
http://thereselawlor303.files.wordpress.com/2012/12/newpost5.jpg?w=1024&h=621
Espero que faça sentido.
Obrigado!
Equipe Editorial
Se você puder ver a imagem em destaque sendo exibida ao lado do seu título no seu site, então seu tema tem suporte para miniaturas.
Admin
Nik
Entendi. Obrigado!
Drew
Olá,
Obrigado por este post, me ajudou muito!
Pergunta: agora como eu também mostraria a imagem em destaque (em um tamanho diferente) apenas dentro do post real (não no loop)?
Thanks
Equipe Editorial
Você pode simplesmente usar o botão de inserir post na imagem.
Admin
Mimo
Ops, meu exemplo acima falhou.
e.g i mg src=”<?p hp the_p ost_thumbnail (); />
Mimo
Ignorem meus comentários. Descobri por que você não gostaria de envolvê-los em tags img e anchor :D.
Obrigado pela postagem
jaquetas canada goose
Continue escrevendo, continue inspirando, continue criando. Gosto da ideia e o site é bem fácil de usar. Eu gostaria que eles revisassem mais do que apenas os 20 principais sites da área. A web é um lugar grande.
jaquetas canada goose
Continue escrevendo, continue inspirando, continue criando. Gosto da ideia e o site é bem fácil de usar. Eu gostaria que eles revisassem mais do que apenas os 20 principais sites da área. A web é um lugar grande.
mbtshoesmbts
Obrigado por postar esta informação. Só quero que você saiba que acabei de conferir seu site e o acho muito interessante e informativo. Mal posso esperar para ler muitas de suas postagens.
Speeltjezoeken
Obrigado, esta postagem me ajudou a voltar à estrada..
lakkolmahendra
Muito obrigado pela maravilhosa informação. É um método simples para adicionar miniatura na sua página inicial. Vou tentar para o meu site hoje.
LukeSwenson
Estou trabalhando na versão 3.2.1 do WordPress. Notei que o módulo no admin lê "Imagem em Destaque" em vez de "Miniatura da Postagem".
Além disso, recebo o seguinte erro quando tento adicionar uma imagem no admin:
Warning: Cannot modify header information – headers already sent by (output started at /——–/—-/——/——-/wp-content/themes/html5/functions.php:58) in /Applications/MAMP/htdocs/justine/wp-admin/async-upload.php on line 2648
SagivHaalush
@wpbeginner Hey
VERY(!) helpful post, However I got to the exact same problem after adding the 2 lines(at the bottom…). When I put them at the beginning, nothing happens…
Can you please be more specific as for the placement in the loop(Which/where)? Thanks
birdhammer
Olá, acabei de tentar inserir o código acima seguindo as instruções do vídeo, mas quando atualizei, recebi um erro de análise. Não consigo nem fazer login no meu painel. Sinto-me um idiota!
Eu uso WordPress com o tema modularity lite e meu site é birdhammer.com.
Você pode me ajudar, por favor?
wpbeginner
A colocação do código no seu arquivo functions.php provavelmente está causando os erros. Você está usando um framework de tema? Você está adicionando no final??
Casey Dennison
meu não está funcionando de jeito nenhum, continuo recebendo erros em PHP e está escrito corretamente. não sei o que está ferrado, continua mostrando o código das funções bem no topo do meu painel do WP ??? isso é estranho
davede
@wpbeginner Ah, obrigado, resolvi o problema. detalhes aqui: (bem, parece que não consigo colar um URL). que chato.
wpbeginner
@davede Você precisaria adicionar o código da miniatura também no seu arquivo single.php.
davede
Bom material. Obrigado.
Estou tendo dificuldade em fazer a miniatura aparecer apenas no resumo, não na página do post.
Alguma ideia?
kevin.m.kwok
@wpbeginner Funcionou perfeitamente, muito obrigado!
wpbeginner
@kevin.m.kwok Sim, isso parece um problema de CSS. Sua classe CSS da imagem precisa ter a propriedade float: left.
kevin.m.kwok
Olá, ótimo tutorial. Tudo funciona, exceto que não consigo fazer a miniatura ficar à esquerda do meu post na minha página inicial. Ela sempre fica em cima do meu post, mesmo que eu selecione esquerda nas opções de miniatura. Alguma ideia?
kevin.m.kwok
Olá,
Peter Wolff
Olá WP Beginner.
Ótimo tutorial do WP acima da Equipe Editorial!
Tenho uma pergunta rápida sobre galeria de miniaturas do WP e fotos. Tenho tentado adicionar um código PHP simples de Campo Personalizado ao meu modelo Category.php para adicionar um pequeno título de legenda de texto abaixo de cada imagem em miniatura. Muito frustrado… de qualquer forma, anexei abaixo o loop de miniaturas do Category.php e gostaria de saber se você pode me ajudar a escrever o código PHP de Campo Personalizado (campo chamado "thumb_tag") dentro deste loop. Aqui está o código:
ID, ‘main_image’, true); ?
Muito obrigado!
Pete
Equipe Editorial
Por que usar campo personalizado para isso? O WordPress tem isso integrado por padrão.
https://www.wpbeginner.com/wp-tutorials/how-to-display-wordpress-post-thumbnails-with-captions/
Admin
Ankit
Obrigado pelo tutorial incrível. É o método mais simples e único para adicionar miniatura na sua página inicial. Funciona no meu site.
shivam
sou novo no wordpress, não sei muita programação.. gostei do seu artigo. mas você pode me dizer exatamente em qual posição devemos colocar este código.. como functions.php é um arquivo, qual devemos editar, em que lugar devemos adicionar esse código, existe alguma demonstração para isso?
Equipe Editorial
Temas diferentes têm códigos diferentes no arquivo de funções. Você precisa adicionar este código dentro da tag php.
Admin
James
Obrigado, acho que consegui fazer funcionar. No entanto, ao adicionar uma miniatura, ela agora é adicionada automaticamente ao topo do meu post, mesmo que o post já tenha uma imagem.
mark
Ótimo tutorial – No entanto, e não consigo encontrar esta informação em lugar nenhum – MAS, eu quero adicionar a miniatura à tela do editor de posts para que meus redatores possam ver como ficaria em linha com o post antes de publicarem. Onde eu poderia fazer isso? Agradeço desde já.
Equipe Editorial
Você vê a miniatura assim que a carrega, no entanto, não há uma prévia ao vivo na tela de administração. Seu autor pode simplesmente clicar em Prévia e ver o post na nova aba <<
Admin
elizabeth
Olá
Obrigado pela informação. Segui os passos no meu tema, mas minhas imagens ainda não aparecem na caixa de imagens... elas parecem arquivos quebrados na minha página inicial. Quando clico nelas, elas aparecem. Como posso torná-las visíveis na página inicial? Obrigado.
Equipe Editorial
Desde que o_post_thumbnail(); esteja dentro do loop na página inicial, deve funcionar bem.
Admin
jam
obrigado pela sua ajuda! eu odeio plugins, então prefiro usar funções de template!
janine
Obrigado pelo ótimo post – especificamente sobre add_theme_support( ‘post-thumbnails’ ); – Funcionou muito bem com o wootheme que estou modificando
saBEE
Obrigado pela ótima informação.
Cada um dos meus posts tem uma foto. Estou tentando fazer com que a foto de cada post apareça como uma miniatura no feed RSS. O método acima funcionará para isso?
Equipe Editorial
Não, você terá que usar este método em conjunto com este método:
https://www.wpbeginner.com/wp-tutorials/how-to-add-post-thumbnail-to-your-wordpress-rss-feeds/
Admin
sabee
Obrigado pela sua rápida resposta.
Estou um pouco confuso, pois o tema que estou usando, AutoFocus+, também requer o tema Thematic. Qual arquivo functions.php precisa ser editado? Ou ambos precisam ser editados?
Gostaria de saber também onde colocar o código?
Bernard
Segui os passos deste tutorial, mas por algum motivo recebo o seguinte erro sempre que tento selecionar uma imagem da opção de galeria:
Erro fatal: Chamada para função indefinida: get_post_thumbnail_id() em /wp-admin/includes/media.php na linha 1292
Alguém pode me ajudar a resolver isso?
obrigado
Bernard
darren
isso realmente está cortando a imagem no upload? Ou apenas a exibe na altura e largura apropriadas quando a chama na página? Eu pergunto porque nós puxamos nosso feed do nosso blog para um site que não é wp e linkamos de volta para ele, mas gostaríamos de poder referenciar as miniaturas. É um site asp, então eu não tenho o luxo da manipulação nativa de imagens do php
Equipe Editorial
Está redimensionando a imagem, não cortando.
Admin
Zara
Obrigado pessoal, vocês são incríveis!
Eu amo vocês <3
Helen
Olá
Nós temos este código nas funções do tema (veio com o skin do tema) o tema tem um slider de imagens que usa a função 'post thumbnail'. no entanto, ele não aparece no admin, então não conseguimos fazer o slider funcionar;
<?php
ajuda : ) obrigado
Equipe Editorial
Helen,
Não vemos o código php. Você pode, por favor, codificar seu código PHP antes de colá-lo nos comentários? Ou você pode nos enviar um e-mail usando nosso formulário de contato.
Admin
Ami
funciona muito bem!! só uma pergunta.. como posso adicionar um link ou envolver um link em
para que quando alguém clicar no link uma lightbox se abra com o tamanho original.
Apenas para esclarecer.
No momento, em functions.php eu tenho
add_image_size(‘my-custom-image’, 640,9999); então a imagem na postagem tem 640 de largura, que será vinculada à imagem original que é, digamos, 1000px por 500px.
Eu encontrei isto: http://polymathworkshop.com/shoptalk/2010/03/19/get-the_post_thumbnail-direct-path-for-wordpress/ que funciona até certo ponto, mas abre a miniatura na lightbox.
Equipe Editorial
A única maneira de fazer funcionar é vincular ao anexo original da miniatura.
Admin
Eduardo Antunes
Legal!
Para lembrar:
> adicionar em functions.php
add_theme_support(‘post-thumbnails’);
set_post_thumbnail_size(70, 70, true);
> adicionar no loop:
php the_post_thumbnail();
Ricky@twitter apps
Bem, eu estava procurando a mesma coisa. Tenho uma pergunta rápida para você. Existe alguma maneira de ter uma imagem padrão da categoria para mostrar como miniaturas? Ou existe alguma maneira de buscar a primeira imagem do post e usá-la como miniatura para posts relacionados.
Eu implementei a técnica acima no meu blog, mas o principal problema é que nem todos os meus posts têm miniaturas habilitadas. O que torna a situação horrível, pois tenho que atualizar todos os posts com miniaturas.
Existe alguma maneira de usar a primeira imagem como miniatura padrão usando a técnica acima?
Equipe Editorial
Sim, você pode buscar a primeira imagem do post usando o Get Image Plugin de Justin Tadlock. Você também pode adicionar uma variável if then verificando is_post_thumbnail.
Admin
Jal
Editores,
Você usa o editor de posts do WordPress ou algum software de publicação de blog offline? Eu uso o Live Writer, que tem algumas opções decentes, mas às vezes penso em mudar para o editor de posts do WP. Você pode compartilhar algumas opiniões sobre isso, por favor?
Obrigado
Antonio
Wow thanks I’ve always wondered how to do this but never really had the patience to look for a solution. I didn’t know it was this simple. WOOOOT! Thanks.
Bob
Como você adiciona lightbox ou thickbox (exemplo rel="lightbox" ou class "thickbox") à miniatura?
Equipe Editorial
Você tem que usar jQuery e adicionar a classe à miniatura. Para adicionar a classe, você adicionaria: array('class' => 'lightbox')
Admin
Trisha
Alguma ideia se isso funciona para miniaturas de Páginas? Estou tentando listar páginas filhas usando este código. (o segundo, em 'post format'. Troquei todas as instâncias de 'content' por 'excerpt' e usei o Excerpt Editor de Andrew Oz, que é realmente legal.
Quando tento inserir o código para a miniatura, ele não aparece.
Alguma ideia do que posso estar fazendo de errado?
Equipe Editorial
Este código só funciona dentro do loop. Se você quiser exibi-lo fora do loop, então você teria que executar uma função wp_query global.
Admin
noonoob
Muito obrigado, funcionou. perfeito
Jeremy
Como posso obter a miniatura de fora do loop?
Equipe Editorial
Escreveremos outro artigo explicando isso em breve. Obrigado pela sugestão. Se você realmente quiser começar a trabalhar nisso, usará a função query_post.
Admin
Chad
Aguardando seu post sobre como exibir imagens de posts fora do loop. Ainda não encontrei um exemplo funcional usando WP 3.0
Equipe Editorial
Funcionaria da mesma forma que isto:
https://www.wpbeginner.com/wp-themes/how-to-display-custom-fields-outside-the-loop-in-wordpress/
Walt Ribeiro
É semelhante a esse tutorial que não é um exemplo exato. Então você postou o seu próprio tutorial para miniaturas? Eu adoraria saber como!
Cosmin
Pessoal, isso só funciona com imagens quadradas?
Como em 50px por 50px?
Ouvi alguém mencionar que ele só pega o valor da altura ao especificar dimensões...
(então 50px por 30px não funcionaria)
Equipe Editorial
Funcionará com qualquer tamanho. Às vezes, a qualidade da imagem será perdida se não for a proporção correta. Temos isso funcionando no site de um cliente e funciona perfeitamente.
Admin
Luke
Sou iniciante e adoro o que vocês estão fazendo. Seria bom ter instruções muito específicas para coisas como essa. Quando copio/colo no functions, não funciona.
Alguma ideia do que eu poderia estar fazendo de errado? Talvez um post de functions para iniciantes?
Obrigado e continuem o ótimo trabalho.
Equipe Editorial
Você está usando o WordPress 2.9? Se sim, não há como não funcionar. Esta é provavelmente a melhor explicação desse código.
Embora tentemos tornar tudo o mais claro possível, às vezes é necessário conhecimento prévio para completar algumas tarefas.
Se você quiser que um de nossos funcionários dê uma olhada e faça isso para você, podemos fazer por uma pequena taxa.
Admin
Chris Peterson
Ótimas dicas! Você explicou claramente cada etapa da instalação de miniaturas de postagem.
Cosmin
Incrível!
Obrigado pessoal, timing perfeito, pois estou trabalhando em um tema do WordPress para um cliente e ele requer exatamente isso!
Now it will be sooo easy for the less-tech-savvy person that’ll write posts
Nimit kashyap
Eu preferiria usar um plugin para isso.
Equipe Editorial
Por quê? Plugins deixam seu site lento, e esta é provavelmente a maneira mais fácil de fazer isso.
Admin
jeprie
artigos muito bons, nunca soube que você podia fazer isso no WordPress.
então, quão lentos os plugins podem deixar nosso site WordPress? é significativo?
Equipe Editorial
Quanto mais consultas ao banco de dados seu site fizer, mais lento ele carregará e cada plugin adiciona consultas.