Проблема с миниатюрами

[tuxfighter]

А что такого в нём страшного?))

страшное - в конечном результате.

 

[Mixon14]

страшное - в конечном результате.

Я может быть оказался непонятым. Но, конечный результат - это фото товара с непропорциональными размерами, которое полностью отображено на странице каталога без обрезанных краёв. Также, как если бы изначально это было фото с нужными параметрами.
В данном случае речь, о квадратных фотках, но также относится и к прямоугольным (в зависимости от того, кто какие размеры в каталоге использует.

Ну, да ладно...

 

[tuxfighter]

это говорит о том, что то фото нужно предварительно подготавливать, что бы он отображались хорошо.....
а не как у нас сейчас принято: сфотал на мобильник, переслал по ватцапу, а потом удивляемся, что фотки плоха выглядят....

 

[Mixon14]

это говорит о том, что то фото нужно предварительно подготавливать, что бы он отображались хорошо.....
а не как у нас сейчас принято: сфотал на мобильник, переслал по ватцапу, а потом удивляемся, что фотки плоха выглядят....

Человеческая лень - двигатель прогресса). А вообще, суть вопроса в том, что меня, например, устраивает, когда прямоугольное фото в лайтбоксе открывается на весь экран. Но хочется, чтобы в каталоге это же фото было квадратным без обрезки.

 

[MishaKov]

Mixon14 полностью с тобой согласен, woocommerce классный плагин но с настройкой изображений, тоже все бьюсь и ни как не могу победить такую же проблему, и причем дополнительхых отдельных плагинов тоже не могу найти, также не хватает возможности для разных категорий разные размеры изображений, например в одной категории у подкатегорий изображения были одного размера (например 50*50) а в другой категории (например 150*150)
Но надеюсь что это когда нибудь решиться, очень надеюсь))

 

[tuxfighter]

также не хватает возможности для разных категорий разные размеры изображений, например в одной категории у подкатегорий изображения были одного размера (например 50*50) а в другой категории (например 150*150)
Но надеюсь что это когда нибудь решиться, очень надеюсь))

Вы уже не первый раз это упоминаете.
Так, как вы первый у кого возникло такое желание, то и решать вам ее предстоит самостоятельно......
изучайте. И да, как у вас с php?

 

[freet]

Если отключить жётскую обрезку, то в каталоге товаров картинки будут не по сетке (квадратными), а в оригинальных пропорциях. Это смотрится некрасиво.

Я хочу так:

Например, у меня для страницы магазина заданы размеры фото 400х400. Если загружать фото 500х600, то лишние 100px будут обрезаны под квадрат.
Например, в фото-редакторе, которым я сейчас пользуюсь, чтоб сделать фото квадратным, есть опция smart filling, т.е. делая фото квадратным, оно не обрезается, а просто заполняется фон под нужную пропорцию (в данном случае под квадрат).
Вот я и хочу, чтобы не редактировать каждое фото для заглавного изображения под квадратные размеры, узнать, можно ли что-то активировать, чтобы изображение просто подгонялось под 400х400 не в обрезанном виде, а целиком. Соответственно, чтобы просто по центру вставало.

Вот вам пример: http://mehano.ru/catalog/startovye_nabory

Видно, что прямоугольные фото вмещаются в квадратные размеры, а лишнее пространство просто заполнено белым фоном.

Я не специалист, но предполагаю, что это не очень сложно технически сделать. Только не знаю как.

Присоединяюсь к вопросу автора. Как сделать что-бы картинка поместилась целиком в квадрат (или прямоугольник) ?
Что-бы была отцентрирована по вертикали (если горизонтальная) либо по горизонтали (если вертикальная).
Что-бы справа-слева (или сверху-снизу) поля были заполнены белым цветом.

У Woocommerce есть 100/500 расширений. У Wordpress - 1 млн. плагинов. Может существует решение ?

 

[tuxfighter]

Может существует решение ?

да. Это решение очень простое: необходимо подготовить картинки перед публикацией (а иногда еще и после), что бы они выглядели именно так, как вам нужно

 

[freet]

Но если картинок огромное кол-во. Не ужели все картинки необходимо редактировать вручную ?
И не ужели нету автоматизированных решений на программном уровне.
Я как то в свое время увлекался VBA for Application. И решал подобную проблему с картинками в прайс-листах Excel.
Решение было найдено такое - я скрестил VBA for CorelDraw и VBA Excel. Написал код который берет картинки из папки, доводит их до нужных пропорций по разным алгоритмам в зависимости от размеров картинки и вставляет картинки в таблицу прайс-листа.

Я не знаю PHP, но предполагаю, что у него есть функции работы с изображениями. Впрочем, может для такой задачи у него функций и нету.

 

[tuxfighter]

Но если картинок огромное кол-во. Не ужели все картинки необходимо редактировать вручную ?

Если вы хотите получить отличный результат - да. Я часто даже те миниатюры, которые движок создает, переделываю.

И не ужели нету автоматизированных решений на программном уровне.
Я как то в свое время увлекался VBA for Application. И решал подобную проблему с картинками в прайс-листах Excel.

Еслиб и было такое решение, то я бы им не пользовался и ни кому не советовал

 

[freet]

Согласен на счет качества. Я даже выставил пропорции миниатюр 0x0 в настройках Медиа, чтобы Wordpress не трогал оригиналы.

 

[ali]

Нате. Придется немного повозитсья с установкой, инструкция внутри.

Рекомендую использовать с EWWW Image Optimizator. В этом случае для установки потребуется только пункт 2 из инструкции.

В настройках появляется пункт, там разберетесь уже.

 

[ali]

Проблема действительно серьезная. Ладно если картинки заносятся вручную, а если поступают при импорте из 1С. Решеине сильно усложняется. На мой взгляд это очевидный и важный недостаток Wordpress, не понимаю почему его игнорят разрабы.

Кстати, пробовали разместить плагин в репозитории Вордпресс, получили отказ, мол слишком маленький функционал. Вот такая приколюха.

 

[ali]

Обновленная версия, исправление ошибок, связанных с обновлением WooCommerce

 

[dmcamforma]

Обновленная версия, исправление ошибок, связанных с обновлением WooCommerce

Плагин не запускается, вызывая фатальную ошибку

 

[ali]

Плагин не запускается, вызывая фатальную ошибку

Стучитесь в ВК https://vk.com/danil_trubitsyn Отправлю исправленную версию.

 

[agrotrade]

Нашел более менее компромиссное решение (правда под шаблоном WoodMart, но принцип должен быть ясен).
Прописываем:
.product-element-top {
padding: 50%;
}

img.attachment-woocommerce_thumbnail.size-woocommerce_thumbnail {
position: absolute;
margin: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
Это уменьшает и ставит в середину (добавляя отступы сверху и снизу) широкие картинки (не помещающиеся в квадрат). Высокие картинки, немного обрезает(. Но их у меня почти нет.

Да, если нужен фон (вместо рамки), обозначающий квадрат - делаем псевдокласс (к примеру):

.product-element-top>a::before {

1. content: '';
2. position: absolute;
3. top: 0;
4. left: 0;
5. right: 0;
6. bottom: 0;
7. background-color: rgba(0,0,0,0.09);
8. z-index: 1;

}

 

[Chuvak]

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

Посмотреть вложение 613 Посмотреть вложение 614

Все установленные в настройках WC размеры для картинок имеют квадратные пропорции, но разные размеры.
При этом размеры картинки в настройках WC для страниц товаров стоит - 600x600, но в реале получаются всегда шириной 300, то есть так как указано в настройках для медиафайлов в самой WP.

Ниже страница товара с выключенной и включенной обрезкой.

Посмотреть вложение 615 Посмотреть вложение 616

Во всех случаях после каждого изменения, картинки перегенерировались заново.

А как Вы отключили обрезание миниатюр? У меня нет вкладки "WooCommerce - Настройки - Настройки изображений. ". Можно узнать ее точное расположение?

 

[Chuvak]

Придумал как оставить изображение не больше определенного. А по ширене оно не будет шире колонки. Вот так:
.woocommerce-loop-product__link img {
width: auto !important;
max-height: 200px !important;
}