галочка на «Обрезать миниатюру точно по размерам (обычно сохраняются пропорции миниатюр)» стоит?
это если вы не регистрировали свой размер миниатюр в теме.
Нет не стоит, свои размеры не регистрировал.
Если верстка кросбраузерная, то необходимо регистрировать все возможное размеры?
регистрируете максимальный подходящий размер с кропингом, сохраняющим пропорции. и все. уменьшение картинки делаете браузером через css, ну там width: 50%; height:auto;
в любом случае по вашему скрину непонятно, что вы там нахимичили — то ли у вас миниатюра без сохранения пропорций (вот и вырезался левый верхний квадрат), то ли у вас для .img-responsive прописан неправильный код.
Дело не только в белом квадрате, изображение(которое неправильно отображается) стоит то же что и на верстке, с одинаковым размером.
А если присвоить миниатюре класс самого блока:
<?php the_post_thumbnail(array('class' => 'col-lg-6 half bg')); ?>
Будет такое же отображение как и в верстке?
Но ВП же меняет в таком случае название класса на:
attachment-col-lg-6 half bg size-col-lg-6 half bg wp-post-image
что значит с одинаковым размером?
в верстке у вас картинка масштабируется благодаря background-size в css. а в теме вы картинку выводите через функцию миниатюры, которая могла быть сгенерирована ровно с том виде, что на скрине привели.
вы залезьте на ftp в папочку wp-content/uploads и посмотрите в каком виде и в каком размере у вас там миниатюры создаются.
Нарезает так:
gardener1-150×100.jpg
gardener1-640×426.jpg
gardener1-768×512.jpg
gardener1-1000×666.jpg
gardener1.jpg
Могу ли я как-то передать параметры:
/* project background */
#project .half.bg {
background-image: url('../img/unsplash/1.jpg');
background-size: cover;
background-position: right;
}
При помощи <?php the_post_thumbnail(); ?> ?
-
Ответ изменён 8 лет, 1 месяц назад пользователем
divanya.
Прописал так:
<?php the_post_thumbnail( $attr = array(
'src' => $src,
'class' => "col-lg-6 half bg"));
?>
Теперь все встало на свои места кроме ширины — http://prntscr.com/dcypyg …
Очень прошу помощи, я не гуру ВП, а всего лишь учусь.
Все так-же в недоумении… Очень прошу помощи.
-
Ответ изменён 8 лет, 1 месяц назад пользователем divanya.
сложно вам помочь со стилями без сайта.
так то инспектор запустил и посмотрел, что к чему.
а по скрину фиг что поймешь — вот какого размера у вас там картинка растягивается?
Вот ссылка на ВП: http://a0102462.xsph.ru
Должно быть так(HTML верстка): http://prognoz.w-king.club
вы решили свою проблему?
а то смотрю ваш сайт открывается нормально.
Нет, все равно данный класс неправильно применяет css стили. В мобильной версии картинка остается большой.
Сервис отображения на моб. устройствах
не знаю, что там на вашем сервисе, но банальная проверка на обычном хроме выдает более-менее нормальный вид. правда, миниатюры в таком случае выводятся сверху контента:
причем, проверив ваш сайт с верткой — там выводится также.
глюк у вас только с первой картинкой, то стили тут непричем:
<img width="1920" height="1200" src="" class="col-lg-6 half bg wp-post-image" alt="preloader-bg" srcset="http://a0102462.xsph.ru/wp-content/uploads/2014/09/preloader-bg.jpg 1920w, http://a0102462.xsph.ru/wp-content/uploads/2014/09/preloader-bg-150x94.jpg 150w, http://a0102462.xsph.ru/wp-content/uploads/2014/09/preloader-bg-640x400.jpg 640w, http://a0102462.xsph.ru/wp-content/uploads/2014/09/preloader-bg-768x480.jpg 768w, http://a0102462.xsph.ru/wp-content/uploads/2014/09/preloader-bg-1000x625.jpg 1000w" sizes="(max-width: 1920px) 100vw, 1920px">
сама картинка выводится с размерами 1920 на 1200.
Только первая картинка и текст натянуты на ВП, остальные блоки пока еще не трогал и они пока прописаны обычным html.
