Как добиться одного формата миниатюры товара

[Mr.Alexandr]

Знаю, что про это много раз спрашивали на форуме, но толкового ответа так и не нашел.
Как привести миниатюру товара к одному формату? Необходима чтобы товар на миниатюре полностью помещался, независимо от соотношений сторон картинки. Только не говорите, пожалуйста "фотошоп в помощь". Как Сейчас все выглядит

Настройки отображения

 

[ArtemZhyg]

Знаю, что про это много раз спрашивали на форуме, но толкового ответа так и не нашел.
Как привести миниатюру товара к одному формату? Необходима чтобы товар на миниатюре полностью помещался, независимо от соотношений сторон картинки. Только не говорите, пожалуйста "фотошоп в помощь". Как Сейчас все выглядит Посмотреть вложение 1505

Настройки отображения Посмотреть вложение 1506

Отпишите если нашли решение

 

[Mr.Alexandr]

Отпишите если нашли решение

Решение найдено, оказалось все просто. Нужно добавить код в style.css.
Значит в класс самой картинке товара добавил

    .product-image .front-image img {
width: auto!important;
    min-width: 0px;
    margin: auto;
    max-height: 250px;
    display: inline-block;
    vertical-align: middle;}

В родительский класс добавил

.product-image .front-image {
    height: 250px;
    display: table-cell;
    width: 250px;
    vertical-align: middle;
    text-align: center;}

width и height можете свои задать. Если что-то не получилось - просто дайте мне адрес вашего сайта и я скажу куда и что добавить.

 

[ArtemZhyg]

Решение найдено, оказалось все просто. Нужно добавить код в style.css.
Значит в класс самой картинке товара добавил

    .product-image .front-image img {
width: auto!important;
    min-width: 0px;
    margin: auto;
    max-height: 250px;
    display: inline-block;
    vertical-align: middle;}

В родительский класс добавил

.product-image .front-image {
    height: 250px;
    display: table-cell;
    width: 250px;
    vertical-align: middle;
    text-align: center;}

width и height можете свои задать. Если что-то не получилось - просто дайте мне адрес вашего сайта и я скажу куда и что добавить.

не могу найти куда добавить http://geekbull.com.ua

 

[Kitanaell]

не могу найти куда добавить http://geekbull.com.ua

я добавила для .woocommerce ul.products li.product a img

 

[ArtemZhyg]

я добавила для .woocommerce ul.products li.product a img

А что именно ты туда добавила? Если не сложно покажи код ато у меня что то не получается.

 

[Mr.Alexandr]

не могу найти куда добавить http://geekbull.com.ua

Уберите в настройках, галочки жесткая обрезка.
В конец файла хранящегося по адресу http://geekbull.com.ua/wp-content/themes/modality/style.css добавте код

.woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img {
    box-shadow: none;
    background-color: #ffffff;
    width: auto!important;
    min-width: 0px;
    margin: auto;
    max-height: 250px;
    display: inline-block;
    vertical-align: middle;}

В конец файла хранящегося по адресу http://geekbull.com.ua/wp-content/plugins/woocommerce/assets/css/woocommerce.css добавте код

.woocommerce ul.products li.product a {
    height: 250px;
    display: table-cell;
    width: 250px;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;}

Скачайте плагин Regenerate Thumbail, установите и активируйте. С помощью плагина регенерируйте миниатюры.

 

[ArtemZhyg]

В конец файла хранящегося по адресу http://geekbull.com.ua/wp-content/plugins/woocommerce/assets/css/woocommerce.css добавте код
.woocommerce ul.products li.product a {
height: 250px;
display: table-cell;
width: 250px;
vertical-align: middle;
text-align: center;
text-decoration: none;}

Не помогло, после вставки 2го кода вот что случилось

 

[Mr.Alexandr]

Не помогло, после вставки 2го кода вот что случилось

Хорошо, тогда второй код не добавляем, а все остальное оставляем. Зашел на ваш сайт , посмотрел на скрин. Понимаю проблема решена? Картинки вписались в бокс. Или нет? Тогда опишите подробнее, что еще меняем.

 

[ArtemZhyg]

Хорошо, тогда второй код не добавляем, а все остальное оставляем. Зашел на ваш сайт , посмотрел на скрин. Понимаю проблема решена? Картинки вписались в бокс. Или нет? Тогда опишите подробнее, что еще меняем.

С картинками у меня было все нормально, проблема в том что из-за разного количества строк названия товара плитки товара разные. После вставки кода и использования плагина ниичего не изменилось. Мне нужно чтобы размер плитки товара не зависил от количества строк названия товара.
Я уже прошерстил весь инет и не нашел внятного ответа.

 

[searchingman]

С картинками у меня было все нормально, проблема в том что из-за разного количества строк названия товара плитки товара разные. После вставки кода и использования плагина ниичего не изменилось. Мне нужно чтобы размер плитки товара не зависил от количества строк названия товара.
Я уже прошерстил весь инет и не нашел внятного ответа.

Обсуждалось и приводились примеры как сделать одинаковый размер не зависящий от количества строк названия товара.

 

[rikitiki]

Мне нужно чтобы размер плитки товара не зависил от количества строк названия товара.
Я уже прошерстил весь инет и не нашел внятного ответа.

Не получится, так как только от длины заголовков зависит высота блоков.
Можно сделать фиксированную высоту блока, но тогда под короткими заголовками будут пробелы, а длинные заголовки будут неприятно обрезаться.
Гляньте в моём блоге на компромиссное решение: http://innka.info/shirokoformatnaya-vitrina-woocommerce/