Кадрирование изображений Woocommerce 4.0 ❗ Исправляем баг
HTML-код
- Опубликовано: 7 дек 2020
- Я столкнулась с задачей, когда у меня в мгазине в основном изображения вертикальные, но не одинаковые соотношения сторон. Кадрирование изображения Woocommerce 4 делается принудительно, поэтому это косая обрезка, или не красивый магазин или тратить время в фотошопе. Чтобы всего этого не делать я нашла решение.
Спасибо за просмотр.
*Здесь ты можешь взять кусочки кода - cutt.ly/ThW8pLK
✅Хостинг, который я рекомендую cutt.ly/Prn063M
****************************************
Помочь на развитие канала можно здесь (донат) 🔻:
🔔 Donation - pay.fondy.eu/s/numz5jwZ
🔔 monobank - cutt.ly/XfgbPXh
****************************************
Мои соц сети:
📣Instagram► / vel_wild
📣 Telegram► t.me/group_kurs_website_on_wo...
📣 Мой сайт►
📣 Для сотрудничества ► vel.dyka@gmail.com
****************************************
🐝 Скидка 10% на отели в любой точке мира здесь: www.booking.com/s/34_6/4a8c42b5
🐝 Скидка $44 на жилье AIR BNB от хозяейв: www.airbnb.ru/c/1a55f8?curren...
✅ Кешбек сервис smarty.sale/1354029
А где можно взять кусочки кода, не открываются.
Большое спасибо за урок! Очень полезный. Смотрю видео вечером, а применять буду с утра, аж руки чешутся. Я не разработчик, думала решить эту проблему каким-то плагином, а тут готовое решение! Вот здорово!
🙂
Нашел этот видос за 10 минут до дедлайна и успел >_
Спасибо! спасибо! спасибо!
Попробовал применить код под тему Astra там такая же история с изображениями в вукоммерс, но еще есть проблема с ховером при наведении на товар.
Как можно в этой теме отключить ховер и подравнять все картинки товаров?
Хорошие двери, мне понравились.
🙂
Спасибо!!!
Благодарю за совет 2 й день мучаюсь с этой проблемой . Сейчас попробую воспользоваться Вашим решением .
🙂
Добрый вечер как можно обратиться к вам для Настройки сайта ?
спасибо! а какой плагин с этой задачей может справиться, порекомендуйте пж
Ссылка на кусочки кода не работает. Где можно взять код?
Решение по выравниванию хорошее, но, думаю, с точки зрения скорости загрузки, надо и сами картинки предварительно стандартизировать в минимально возможный с точки зрения дизайна размер. Тоесть сочетать и подготовку картинок, и выравнивание если что то пойдёт не так.
здесь идет речь именно про кадрирование. Само собой разумеется, что нужно уменьшать вес файла
ссылка уже не рабочая с кодом. // Add the opening div to the img
function add_img_wrapper_start() {
echo '';
}
add_action('woocommerce_before_shop_loop_item_title', 'add_img_wrapper_start', 5, 2);
// Close the div that we just added
function add_img_wrapper_close() {
echo '';
}
add_action('woocommerce_before_shop_loop_item_title', 'add_img_wrapper_close', 12, 2);
Молодец, так дкржать! =)
🙂
спасибо вам за ваши уроки! у меня тут одна проблема возникла после добавление кусочок кода в файл functions.php, возникла критическая ошибка и сайте перестал загружаться. сайт на теме woodmart. не подскажите в чем может быть причина? за ранее спасибо.
Какой код добавляли? Какая конкретно ошибка?
@@VelWild код который вы написали для functions.php
После этого выдаёт ошибку
Если копирование с самой первой строки, то да, ошибка. Удалите первую строку которая начинается с / или допишите ещё один / в начале строки, чтобы строка начиналась с //
@@VelWild огромное спасибо, заработало👌
Добрый день! В теме OceanWP это не работает. Блок вставляется выше img.
В Ocean WP свои собственные хуки
А на мобильную версию это не повлияет? И можно ли параллельно применить плагин сжатия изображений?
Для мобильной версии можно свои размеры сделать. Сжатие можно
Несколько дней думал, почему так происходит! На advanshop загружаю все хорошо, на wordpress изображения пляшут. Благодарю!
А я думал, что только я на jQuery джиквари говорю. А вон Валя вордпресс вёрдпрессом называет. Я еще еле научился говорить эко, а не эчё ))))))))))))))
Недавно решал такую проблему, помогли флексы в карточке.
P.S: можно было воспользоватся Ctrl+R, чтобы в историю не лезть :)
Спасибо, большое, у меня получилось! За ваш совет!
Шел 2023 год а баг так и не пофикцили
Вы полезные уроки даёте, но мне сложно вас понимать, вы используете в основном профессиональные термины при объяснении
Классное видео, но у меня почему то на Вудморд не сработало, хотя все написал как в видео
Валентина, если не сильно заняты, поможете решить проблему?
Смотрю не первый урок! Но… Вместо ссылок на коды, ссылки на сайт!! Код самому искать приходится:( А так все круто!
koda net, druqaya stranicha
Іноді вашу інформацію можна сприймати .але такий великий нюанс як розмита подача зоображення всього відео як через боке . викликае погане сприйняття всбого контенту .може бути шо це баг .але наврятчи . як рішення нормальна камера .
Лайк звісно
/ Add the opening div to the img
function add_img_wrapper_start(){
echo '';
}
add action ( 'woocommerce_before_shop_loop_item_title', 'add_img_wrapper_start', 5, 2);
//Close the div that we just added
function add img wrapper close () {
echo '';
}
add action ( 'woocommerce_before_shop_loop_item_title', 'add_img_wrapper_close', 12, 2);
ввел этот код в теме Астра - вызвало критическую ошибку на сайте. Он не подходит к данной теме?
в первом эд экшн пишет синтаксическая ошибка
Достаточно отключить обрезку в настройках и в стилях прописать:
.woocommerce ul.products li.product a img { height: 300px; }