This page redirects to an external site: https://developer.wordpress.org/reference/functions/the_post_thumbnail/
Languages: English • Italiano • 日本語 Македонски • (Add your language)
Display the Featured Image (previously called Post Thumbnails) for the current post, as set in that post's edit screen.
This tag must be used within The Loop. Use get_the_post_thumbnail($id, $size, $attr ) instead to get the featured image for any post.
Use has_post_thumbnail() to check whether a Feature Image has been added to the post.
To enable post thumbnails, the current theme must include add_theme_support( 'post-thumbnails' ); in its functions.php file. See also Post Thumbnails.
<?php the_post_thumbnail( $size, $attr ); ?>
PLEASE NOTE: The crop does not work in WP 3.0+. All that is needed for WP 3.0+ is the call for the thumbnail to post. Then proceed to media in the dashboard and set your thumbnail to crop to the size you wish to use.
the_post_thumbnail relies on: wp_get_attachment_image
$default_attr = array( 'src' => $src, 'class' => "attachment-$size", 'alt' => trim( strip_tags( $wp_postmeta->_wp_attachment_image_alt ) ), 'title' => trim( strip_tags( $attachment->post_title ) ) );
Note that these attributes will be automatically escaped within the internal call to wp_get_attachment_image - you do not need to esc_attr() the attributes you pass to this function.
<?php
if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
the_post_thumbnail();
}
?>
<?php the_content(); ?>
Note: To return the Post Thumbnail for use in your PHP code instead of displaying it, use: get_the_post_thumbnail()
The default image sizes of WordPress are "thumbnail", "medium", "large" and "full" (the size of the image you uploaded). These image sizes can be configured in the WordPress Administration Media panel under Settings > Media. This is how you can use these default sizes with the_post_thumbnail():
the_post_thumbnail(); // without parameter -> 'post-thumbnail' the_post_thumbnail( 'thumbnail' ); // Thumbnail (default 150px x 150px max) the_post_thumbnail( 'medium' ); // Medium resolution (default 300px x 300px max) the_post_thumbnail( 'large' ); // Large resolution (default 1024px x 1024px max) the_post_thumbnail( 'full' ); // Full resolution (original size uploaded) the_post_thumbnail( array(100, 100) ); // Other resolutions
Register new image sizes for Post Thumbnails with: add_image_size().
To set the default size for Post Thumbnails see: set_post_thumbnail_size().
Note: Don't use these two examples together in the same Theme.
example 1. To link Post Thumbnails to the Post Permalink in a specific loop, use the following within your Theme's template files:
<?php if ( has_post_thumbnail() ) : ?> <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"> <?php the_post_thumbnail(); ?> </a> <?php endif; ?>
example 2. To link all Post Thumbnails on your website to the Post Permalink, put this in the current Theme's functions.php file:
add_filter( 'post_thumbnail_html', 'my_post_image_html', 10, 3 );
function my_post_image_html( $html, $post_id, $post_image_id ) {
$html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_the_title( $post_id ) ) . '">' . $html . '</a>';
return $html;
}
This example links to the "large" Post Thumbnail image size and must be used within The Loop.
<?php
if ( has_post_thumbnail() ) {
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large' );
echo '<a href="' . $large_image_url[0] . '" title="' . the_title_attribute( 'echo=0' ) . '">';
the_post_thumbnail( 'thumbnail' );
echo '</a>';
}
?>
Post Thumbnails are given a class "wp-post-image". They also get a class depending on the size of the thumbnail being displayed You can style the output with these CSS selectors:
img.wp-post-image img.attachment-thumbnail img.attachment-medium img.attachment-large img.attachment-full
You can also give Post Thumbnails their own class.
Display the Post Thumbnail with a class "alignleft":
<?php the_post_thumbnail( 'thumbnail', array( 'class' => 'alignleft' ) ); ?>
the_post_thumbnail() is located in wp-includes/post-thumbnail-template.php.