post thumbnails - How to deal with wordpress images?

admin管理员组

文章数量:1324621

I have blog post featured image that has specific size.

then I want to display it with its excerpt in different page called front-page.php, but I want to display it with larger size.

It already appear in the front page as I want but it is in its normal size.

I just want it to appear larger to be 458 x 355. I already put the dimensions on the code but it is not applied. here is the code

<?php echo get_the_post_thumbnail($post['ID'], array(458, 355)); ?>

please, what should I do?

I have blog post featured image that has specific size.

then I want to display it with its excerpt in different page called front-page.php, but I want to display it with larger size.

It already appear in the front page as I want but it is in its normal size.

I just want it to appear larger to be 458 x 355. I already put the dimensions on the code but it is not applied. here is the code

<?php echo get_the_post_thumbnail($post['ID'], array(458, 355)); ?>

please, what should I do?

• post-thumbnails

Share Improve this question asked Sep 7, 2020 at 17:29 socialsocial 7133 silver badges99 bronze badges 1

• 1 It won't resize images if you pass specific arguments for a specific set of dimensions, it'll just choose the closest pre-sized image. If it did, the site would be incredibly slow as it resized the image on the fly every single time – Tom J Nowell ♦ Commented Sep 7, 2020 at 19:18

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 3

Passing explicit dimensions to those APIs won't give you an image with those dimensions unless one already exists. It will choose the image size that's closest.

So, you have 2 options

1. Add a named image size via add_image_size that matches the desired dimensions. WordPress will generate an image of this size on upload. You will need to use a regenerate thumbnails type plugin to apply this to past uploads
2. Refactor your CSS to use object-fit: cover; then use a larger image size, then specify the width and height of the image explicitly ( which you should be doing anyway instead of relying on the image dimensions to determine the img elements width and height. The advantage of this is that images that are smaller, larger images, and images with different aspect ratios, will all work just fine.

e.g.

...yourfeaturedimg... {
    width: 458px;
    height: 355px;
    object-fit: cover;
}

I recommend option 2 as it's more performant, easier to test, and involves following the HTML spec. It also makes your theme more robust and able to handle images better.

Further reading:

• https://www.w3schools/csS/css3_object-fit.asp
• https://css-tricks/almanac/properties/o/object-fit/
• https://developer.mozilla/en-US/docs/Web/CSS/object-fit

本文标签： post thumbnailsHow to deal with wordpress images