如何自定义WordPress发布缩略图？

如何覆盖WordPress中缩略图的默认”自然”大小？我的functions.php和CSS无法正常工作。这会使图像模糊。

Functions.php

// Enable support for Post Thumbnails on posts and pages.
add_theme_support('post-thumbnails');
set_post_thumbnail_size( 450, 250, true );

Style.css：

/*  Featured image thumbnail */
.attachment-post-thumbnail, .size-post-thumbnail, .wp-post-image { 
    width: 450px !important; 
    height: 250px !important; 
}  

Page-blog.php(自定义博客页面)：

       <article id="post-<?php the_ID(); ?>" 
    <?php post_class(); ?>>
              <h2 class=""> 
<a class="blog-title" href="<?php the_permalink(); ?>"> <?php the_title(); ?></a> </h2>
                 <div class="entry-content"> <?php 
          if ( has_post_thumbnail ) {                                            
             the_post_thumbnail();
                                     }
                               the_excerpt();   
                                                    ?> 
                                          </div>
                                     </article>

在Google Dev Tools中, HTML呈现如下。请注意, 它附加了默认的150 x 150(我没有用这种方式进行硬编码)：

   <div class="entry-content"> 
    <img width="150" height="150" src="http://localhost:8888/wordpress/wp-content/uploads/2018/02/feature_nothavingit-150x150.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" srcset="http://localhost:8888/wordpress/wp-content/uploads/2018/02/feature_nothavingit-150x150.jpg 150w, http://localhost:8888/wordpress/wp-content/uploads/2018/02/feature_nothavingit-45x45.jpg 45w" sizes="(max-width: 150px) 100vw, 150px">

#1

更好的做法是通过方法get_the_post_thumbnail_url()使用缩略图的URL。你只需要使用下一个结构, 就可以制作任何自定义缩略图。并且请确保你还有一张具有所需分辨率的附加图像。为了在所有分辨率下正确工作, 最佳实践是使用<picture> </ picture>选择器。

$thumbnail_url = get_the_post_thumbnail_url(the_ID(), 'post-thumbnails');

<div class="entry-content"> 
     <img src='<?php echo $thumbnail_url; ?>'>
</div>