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

Решено Размытая картинка товара

Karkocha

Форумчанин
1. Всем привет. Сижу незнама что делать. Выставляю товар, прикрепляю картинку и..у нее теряется качество, становиться маленько размытой, захожу в сам товар, потом выхожу обратно и после такой процедуры появляется качество. Использовал regenerate thumbnails, не помогает. С мобильного телефона кстати при заходе качество сразу хорошее, а с ПК гг какое то. Как быть? Знает кто ответ на данный вопрос?
2. Не могу найти где менять размер шрифта цены, цвет поменял а с размером проблема. Использую шаблон Mystile
3. Адрес сайта двери45.рф Спасибо что выслушали
 

Karkocha

Форумчанин
У меня еще не лучшуе..В разделе категории отображалось 8 товаров я реши добавить. Шаблон Mystile зашел в настойки шаблона, раздел woocommerce. Добавил с 10 на 12, и у меня картинки все квадратные стали, мде..Даже в Custom CC код не помогает.
.images img {
width: 270px;
height: 600px;
}
ul.products li.product img {
width: 250px;
height: 350px;
}
 

Karkocha

Форумчанин
С квадратными картинками разобрались, осталась проблема с размытием, толи браузер толи что, не пойму.
 

D&B

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

Karkocha

Форумчанин
Картинки и так большего размера. Плагины Thumbnail не помогают
 

Karkocha

Форумчанин
Ура-а товарисчи, разобрался. Дело было вот в чем, в настройка woocommerce раздел товары нужно ставить размер такой, который указан в картинке, если у меня разрешение было 270х600 то такое нужно ставить и в изображение каталога, и единичного товара. Потом вставляю код
.images img {
width: 270px;
height: 600px;
}
ul.products li.product img {
width: 180px;
height: 400px;
И в каталоге все четко отображается. А до этого в настройках woocommerce где изображение каталога, разрешение стояло в два раза меньше, по этому и давало размытие.
Сейчас головую ломаю как увеличить размер шрифта цены, пробовал плагины, нифига не помогают.
 

rikitiki

Специалист
Местный
Почему у вас картинки в png? Каждая картинка у вас весит ~230 кB. 48 картинок на странице каталога, значит общий вес страницы 0,23X48=11мB. Пользователи мобильного трафика вам спасибо не скажут и такая страница будет долго грузиться.
Переделал в Fastone одну из ваших картинок в jpg немного уменьшив качество. Вместо 250 kB она стала весить 15 kB. При сравненинии неотличимо.
Прикладываю её ниже.
... если у меня разрешение было 270х600 то такое нужно ставить и в изображение каталога,...
Ерунда, что-то вы не то сделали. Woocommerce для того и создаёт уменьшенные копии картинок для категорий, чтобы что бы страница имела меньщий вес.
У вас место в категории по ширине под каждую картинку 170px. Такую ширину в настройках WC для картинок категорий и нужно выставлять, а по высоте пропорционально.
И размеры эти нужно устанавливать не в CSS, а в Настройки-Товары-Отображение-Изображения каталога.
В то же Fastone уменьшил размер картинки до этой ширины и получил 7kB. После этого вес вашей страницы уменьшится в 40 раз с 11мB до 0,3мB.
 

Вложения

Последнее редактирование:
  • Like
Реакции: qwer

rikitiki

Специалист
Местный
Сейчас головую ломаю как увеличить размер шрифта цены, пробовал плагины, нифига не помогают.
Ну, допустим:
Код:
.woocommerce ul.products li.product .price {
    font-size: 2em;
}
.woocommerce div.product span.price, .woocommerce div.product p.price {
    font-size: 2em;
}
Первый код для категории, второй для карточки. Там же и цвет можете изменить.
 

Вложения

Последнее редактирование:
  • Like
Реакции: qwer

Karkocha

Форумчанин
Спасибо за совет, буду переделывать, да что то наслушался в инете, что все картинки для веб должны быть в png.
 
Сверху Снизу