use the the_post_thumbnail In WordPress

How to use the the_post_thumbnail In WordPress

Now WordPress in core the new post thumbnail function will not changed until. we have given info about How to use the the_post_thumbnail In WordPress.

use the the_post_thumbnail In WordPress

You can provide 4 picture formats to the function (change the width and height values to your need):

use the the_post_thumbnail In WordPress
use the the_post_thumbnail In WordPress
// the thumbnail
the_post_thumbnail(array(100,100));

// medium resolution
the_post_thumbnail(array(300,200));

// large resolution
the_post_thumbnail(array(600, 400));

// original
the_post_thumbnail();

You can set how the images should align. It is also possible to assign an own class:

//  left align
the_post_thumbnail(array(100,100), array('class' => 'alignleft'));

//  right align
the_post_thumbnail(array(100,100), array('class' => 'alignright'));

//  center
the_post_thumbnail(array(100,100), array('class' => 'aligncenter'));

// align right and the class  'my_own_class'
the_post_thumbnail(array(100,100), array('class' => 'alignright my_own_class'));

The 3rd possibility is the control of the images size with an array of height and width:
For this purpose we suppose that the settings for thumbnail is 150×150, for medium 300×200 and for large 600×400.

// thumbnail scaled to 60x60 pixel
the_post_thumbnail(array(60,60), array('class' => 'alignleft'));

// original thumbnail
the_post_thumbnail(array(150,150), array('class' => 'alignleft'));

// medium resolution scaled to 200x133 pixel
the_post_thumbnail(array(200,200), array('class' => 'alignleft'));

// large resolution scaled to 400x266 Pixel
the_post_thumbnail(array(400,345), array('class' => 'alignleft'));

We see that the image proportions are always maintained, even if one specifies crooked values.

For the Theme Designers is this not necessarily easier, because no one knows what the user will put in his settings o his library. One way to approach this problem, to query the options for the various sizes:

// width of the thumbnails
get_option('thumbnail_size_w');

//  height of the thumbnails
get_option('thumbnail_size_h');

//  height of the medium resolution
get_option('medium_size_h');

//  width of the large resolution
get_option('large_size_w');

//  1 = Crop thumbnail to exact dimensions, 0 = Crop off
get_option('thumbnail_crop')

You can change these values in your theme.

$w = get_option('thumbnail_size_w') / 2;
$h = get_option('thumbnail_size_h') /2;

the_post_thumbnail(array($w, $h), array('class' => 'alignleft'));

Here another example: If the size of a thumbnail is bigger than 100×100 and crop is activated, then the thumbnail should be resized to 100×100, otherwise use the original thumbnail.

if(get_option('thumbnail_size_w') > 100 && get_option('thumbnail_crop') == 1) {
    the_post_thumbnail(array(100,100));
}else{
    the_post_thumbnail('thumbnail');
}

What Matt is saying?

I wouldn’t recommend anyone use the named arguments for the_post_thumbnail, like ‘thumbnail’, could you remove those from your tutorial.

Inspired by

Published by

Purab

I am Purab from India, Software development is my profession and teaching is my passion. Programmers blog dedicated to the JAVA, PHP, DevOps technologies and Opensource Frameworks. Github Repo: Purab Youtube Chanel Purab Code Book Connect to on LinkedIn or Follow @purab on Twitter or Write Mail to purabdk@gmail.com

4 thoughts on “How to use the the_post_thumbnail In WordPress”

  1. Thanks for this information, I am wodnering if you know how to set the thumbnail picture in a code…perhaps something like update_metadata or so

    1. In wordpress database we are just storing the image(attachment) information. For thumbnail there is functions. if size 150px to 150px then image will be called as image_name-150×150.jpg. If thumbnail sizes defined in functions.php file then that much thumbnails will be created in uploads directory.

Leave a Reply

Your email address will not be published. Required fields are marked *