• Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!
  • Темы озаглавленные с маленькой буквы или капсом удаляются без предупреждения!

Изменить размер изображения в карточке товара

my-baby

Новичок
Здравствуйте! Не могу разобраться после обновления Вукомерс, где изменить размер товара в карточке, сейчас он очень большой (максимальный размер загруженного фото товара), даже не умещается на странице. Вот пример: https://my-baby-style.ru/product/chepchik-goluboj-s-mashinkami/
 

Вложения

ADv

Гуру
Местный
Здравствуйте! Не могу разобраться после обновления Вукомерс, где изменить размер товара в карточке, сейчас он очень большой (максимальный размер загруженного фото товара), даже не умещается на странице. Вот пример: https://my-baby-style.ru/product/chepchik-goluboj-s-mashinkami/
Внешний вид - Настроить - WooCommerce и где-то там размер миниатюр.
 

my-baby

Новичок
К сожалению, в новой версии (3.5.7) этого больше нет. Безымянный1.pngБезымянный.png

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

Есть настройка в customize.php Безымянный2.png Но я уже несколько раз меняла значения, размер изображения в карточке, да и в каталоге не меняются. Единственное, что меняется, так это качество отображения (я уменьшаю эти значения и, как я понимаю, эти маленькие миниатюры растягиваются до этого же размера, поэтому качество очень страдает). Нужно поменять размер самого окна под изображение.
 

my-baby

Новичок
CSS:
.woocommerce div.product div.images img {
    width: 350px !important;
}
Спасибо огромное! Изображение уменьшилось. Но проблема не полностью решилась... Мучаюсь уже несколько дней, не могу уменьшить отступ текста от изображения Безымянный.png и уменьшить дополнительные картинки товара (в слайдере под товаром - они размытые, наверное так же маленькое изображение растянуто на больший размер, и возможно проблема именно в них). Безымянный0.pnghttps://my-baby-style.ru/product/kostyum-kofta-s-kapyushonom-shtany-goluboj/
Похоже на то, что что-то отвечает за размер главного изображения товара и его вариаций, и даже когда они меняются, место под уже заранее определенное отображение остается. Плагин стоит YITH WooCommerce Zoom Magnifier, но в нем нет настроек размеров главного и дополнительных изображений. Все уже перепробовала, осталась надежда только на Вас))) И вукомерц с вордпрессом насоздавали кучу вариаций изображений каждого товара, по 16 штук на каждый, не понимаю, как свести все к использованию хотя бы части из них, чтобы не переводить память на хостинге. С этой проблемой наверняка уже сталкивались многие, как-то она решается? Как определить те, которые действительно используются и можно ли удалять те, которые не нужны?
 
Последнее редактирование:

tuxfighter

Гуру
Местный

my-baby

Новичок
Спасибо! Плагин удалила)

Картинка уменьшена, но отступ так и остался (тот размер большого фото товара так и остался, просто теперь около картинки "пустота")Безымянный2.png

Лупа не приближает, если прописываю в css код .woocommerce div.product div.images img {
width: 350px !important;
}
Безымянный1.png

https://my-baby-style.ru/product/shapochka-s-babochkoy/

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

Заранее спасибо!
 

tuxfighter

Гуру
Местный
попробуйте
CSS:
.woocommerce-page div.product div.images {
    max-width: 48% !important;
    width: 350px !important;
}
.woocommerce-page img.attachment-shop_single{
    max-width: none !important;
}
 

tuxfighter

Гуру
Местный
попробуйте так:
CSS:
.woocommerce-page div.product div.images {
    max-width: 30% !important;
}

.woocommerce #content div.product div.summary,
.woocommerce div.product div.summary,
.woocommerce-page #content div.product div.summary,
.woocommerce-page div.product div.summary {
    width: 67%;
}
Но только вам я уже говорил, что нужно всю сетку нормально переверстать. Как вылезут вот эти костыли - мне не известно.
А самый лучший вариант - взять ту тему, которая уже устраивает по верстке. Это вообще самый основной параметр , на который нужно обращать внимание при выборе темы.
 

Ed777

Опытный
попробуйте так:
CSS:
.woocommerce-page div.product div.images {
    max-width: 30% !important;
}

.woocommerce #content div.product div.summary,
.woocommerce div.product div.summary,
.woocommerce-page #content div.product div.summary,
.woocommerce-page div.product div.summary {
    width: 67%;
}
Но только вам я уже говорил, что нужно всю сетку нормально переверстать. Как вылезут вот эти костыли - мне не известно.
А самый лучший вариант - взять ту тему, которая уже устраивает по верстке. Это вообще самый основной параметр , на который нужно обращать внимание при выборе темы.
Работает спасибо!
Я первый раз в этой теме пишу, по сетке ничего не говорили, но принято.
 

tuxfighter

Гуру
Местный
Я первый раз в этой теме пишу, по сетке ничего не говорили, но принято.
 

Илья2712

Новичок
Великий Гуру) Подскажи, пжлст, проблема аналогичная, но решить ее не получается.
Есть картинки вертикальные, есть горизонтальные. Как сделать так, чтобы ограничить их по высоте в карточке товара, скажем в 500px, но при этом не растягивать, а сохранять пропорции.

Пробую такие свойства:
.woocommerce-product-gallery__image {
max-height:500px;
}
.woocommerce div.product div.images img {
max-height:500px;
width:auto;
margin:auto;
}

Но либо картинки выходит за рамки DIVа, либо лупа не работает, либо и то и другое)
 
Последнее редактирование:

tuxfighter

Гуру
Местный
Картинки нужно заранее готовить под размер. Тогда все работать будет
А в настройках Вуу поставить что бы обрезалось не?
 

Илья2712

Новичок
Картинки нужно заранее готовить под размер. Тогда все работать будет
А в настройках Вуу поставить что бы обрезалось не?
Ну готовить под размер это понятно и правильно. Но не всегда есть возможность обрабатывать картинки, когда речь идет о загрузке большого количества партнерских товаров. Обрезать тоже не вариант, есть вероятность отрезать что-то важное.
Самое правильное - это вписывать во всю область контейнера, отталкиваясь от максимальной либо ширины, либо длины, в зависимости от ориентации изображения.
Как это сделать, не знаете получается?
 

gumruslan

Новичок
Доброго времени суток. Помогите пожалуйста разобраться. Обновил на сайте версию PHP с 4.х до 7.0, вордпресс с 4.х до 5.4.1, вукоммерс с 3.х до 4.1.1 и получил неприятную проблему. В карточке товара превью фото начали формироваться в соотношении 1:1 (100х100 px) и обрезать оригинальное фото.
Screenshot_3.jpg

Настройки -- Медиа файлы указал такое:
Screenshot_1.jpg

В настройках Внешний вид -- Настроить -- WooComerce -- Изображение товара указанно следующее:
Screenshot_2.jpg

Сегодня с 9 утра воюю с этой проблемой и обратил внимание, что нагрузка на ЦП с момента как я начал этим заниматься - под 100%. Как я понимаю это сейчас идет процесс пересоздания новых миниатюр фото.
Screenshot_4.jpg


Подскажите пожалуйста что я делаю не так и что мне нужно сделать, чтоб в карточке товара выводились фото превьюшек в соотношении сторон 2:3 и не обрезало.
 

gumruslan

Новичок
Как вы резко... А тема-то какая? Без ссылки на сайт вам к экстрасенсам
Так уж случилось, что сайт давно никто не обновлял. Тема theretailer1. Скорее всего это какой-то ручной кастом. Настройка темы выглядит так.
Сайт https://theshoes.com.ua
 
Сверху Снизу