Как настроить миниатюры записей WordPress?

Как я могу переопределить «Естественный» размер по умолчанию для миниатюр в WordPress? Мои functions.php и CSS не работают. Это делает изображение размытым.

Скриншот

Функции.php

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

Стиль.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">

person Community    schedule 05.02.2018    source источник
comment
Из документов When using the_post_thumbnail() or related functions, the ‘post-thumbnail’ image size is used by default, though a different size can be specified instead as needed. developer.wordpress.org/reference/functions/the_post_thumbnail   -  person Hackerman    schedule 05.02.2018
comment
Спасибо. Я пробовал код оттуда, но ничего не работало. Посмотрю еще раз или у друга спрошу.   -  person    schedule 06.02.2018


Ответы (1)


Лучше всего использовать URL миниатюры методом get_the_post_thumbnail_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>
person Artem Anokhin    schedule 05.02.2018
comment
Благодарю вас! Это привело меня в правильном направлении и устранило проблему. Однако он странно распечатал число сбоку от изображения. Я смог отладить его с другом. - person ; 06.02.2018