Intereting Posts
Как сделать плагин другим плагином? Как использовать TOC с ACF? Как включить кнопку редактирования в настройке пользовательского интерфейса темы? get_home_path () возвращающая ошибка 500 Элемент управления Customizer использует другие настройки по умолчанию. API JSON и уведомление о регистрации Параметр периода Jetpack – stats_get_csv Как получить идентификатор продукта wp из permalink и перенаправить на мою собственную страницу продукта темы? Обеспечение загрузки или запуска плагина в последний раз? Расширение auth_cookie_expiration на основе роли пользователя Получить первый URL-адрес изображения из пользовательского сообщения с разбивкой на страницы Сайт не работает, когда PHP изменился на 7.1 Могут ли пользователи менять язык локали? Действительно ли этот код эффективен – или есть лучший способ? Как перевести несколько установок на одну установку Multisite?

установка миниатюрного изображения в div

Я хочу, чтобы загруженное изображение соответствовало 100% внутри div. Проблема в том, что загруженное изображение имеет разный размер. Например, я загрузил изображение, а wordpress создал миниатюру размером 150×150. Я хочу показать это миниатюру в div, который равен 200×150. Все в порядке, что профайлы изображения будут искажены, но я не могу этого сделать. Я пытаюсь:

<?php the_post_thumbnail( array(200,150) ); ?> 

Он показывает только 150×150.

PS. Я не хочу добавлять размер другой копии изображения, используя set_post_thumbnail_size. Вместо этого я просто хочу сделать миниатюру подходящей в div, растягивая ее.

Solutions Collecting From Web of "установка миниатюрного изображения в div"

При настройке размера изображения в массиве с использованием the_post_thumbnail как вы, документация заявляет, что функция «crop» не работает с WordPress 3.0. Чтобы выполнить то, что вы хотите, вам нужно будет сделать следующее.

В файле functions.php сделайте вызов add_image_size , который позволяет вам указать как размеры изображения, так и его обрезание.

 //set image size add_image_size( 'my-custom-size', 200, 150, true ); //use in theme the_post_thumbnail( 'my-custom-size' ); 

Кроме того, вы можете просто использовать CSS для установки размера изображения, что заставит его искажать и растягиваться до нужного размера, но метод WordPress, приведенный ниже, будет правильным. ПРИМЕЧАНИЕ. add_image_size() создает копию всех изображений в указанных размерах. Он также применим только к недавно загруженным изображениям. Изображения, уже сохраненные в базе данных, не затрагиваются.

Пытаться

 the_post_thumbnail( 'post-thumbnail', array('width'=>'200', height=>'200') ); 

Второй (необязательный) аргумент – это массив атрибутов, которые должны применяться к тегу <img> .

Альтернативно, вы можете сделать это через css …

  .my-thumb-ctr img {width:200px;height:150px;} 

Используйте этот плагин для генерации эскизов динамически. http://swiftthemes.com/swiftdynamicthumbs-plugin-to-generate-thumbnails-dynamically-when-needed/

Используя этот плагин, миниатюры будут сгенерированы с точными размерами, которые вам нужны, без искажений.

в functions.php:

 function yourTheme_thumbnail($size) { if( has_post_thumbnail() ) { GLOBAL $post; // get thumbnail url with given size. $url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), '$size' ); // return it as an CSS property. $backgroundImage = 'background-image: url(' . $url[0] . ');'; echo $backgroundImage; } } 

в почтовом цикле:

 LOOP START <a href="<?php the_permalink() ?>"> <div class="post-thumbnail" style="<?php yourTheme_thumbnail('medium') ?>"> <h2 class="caption"><?php the_title() ?></h2> </div> </a> LOOP END 

и в конце добавьте следующие правила в свой CSS:

 .post-thumbnail { background-image: url(images/bg.png); background-color: rgba(0, 0, 0, .7); background-repeat: no-repeat; background-position: center center; background-origin: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } 

и bg.png – изображение по умолчанию в случае отсутствия набора миниатюр.