Кадрирование изображений Woocommerce 4.0 ❗ Исправляем баг
HTML-код
- Опубликовано: 7 сен 2024
- Я столкнулась с задачей, когда у меня в мгазине в основном изображения вертикальные, но не одинаковые соотношения сторон. Кадрирование изображения Woocommerce 4 делается принудительно, поэтому это косая обрезка, или не красивый магазин или тратить время в фотошопе. Чтобы всего этого не делать я нашла решение.
Спасибо за просмотр.
*Здесь ты можешь взять кусочки кода - cutt.ly/ThW8pLK
✅Хостинг, который я рекомендую cutt.ly/Prn063M
****************************************
Помочь на развитие канала можно здесь (донат) 🔻:
🔔 Donation - pay.fondy.eu/s...
🔔 monobank - cutt.ly/XfgbPXh
****************************************
Мои соц сети:
📣Instagram► / vel_wild
📣 Telegram► t.me/group_kur...
📣 Мой сайт►
📣 Для сотрудничества ► vel.dyka@gmail.com
****************************************
🐝 Скидка 10% на отели в любой точке мира здесь: www.booking.co...
🐝 Скидка $44 на жилье AIR BNB от хозяейв: www.airbnb.ru/...
✅ Кешбек сервис smarty.sale/13...
ссылка уже не рабочая с кодом. // 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);
Нашел этот видос за 10 минут до дедлайна и успел >_
Большое спасибо за урок! Очень полезный. Смотрю видео вечером, а применять буду с утра, аж руки чешутся. Я не разработчик, думала решить эту проблему каким-то плагином, а тут готовое решение! Вот здорово!
🙂
А где можно взять кусочки кода, не открываются.
Хорошие двери, мне понравились.
🙂
Решение по выравниванию хорошее, но, думаю, с точки зрения скорости загрузки, надо и сами картинки предварительно стандартизировать в минимально возможный с точки зрения дизайна размер. Тоесть сочетать и подготовку картинок, и выравнивание если что то пойдёт не так.
здесь идет речь именно про кадрирование. Само собой разумеется, что нужно уменьшать вес файла
Благодарю за совет 2 й день мучаюсь с этой проблемой . Сейчас попробую воспользоваться Вашим решением .
🙂
Спасибо! спасибо! спасибо!
Попробовал применить код под тему Astra там такая же история с изображениями в вукоммерс, но еще есть проблема с ховером при наведении на товар.
Как можно в этой теме отключить ховер и подравнять все картинки товаров?
Недавно решал такую проблему, помогли флексы в карточке.
P.S: можно было воспользоватся Ctrl+R, чтобы в историю не лезть :)
Спасибо, большое, у меня получилось! За ваш совет!
Шел 2023 год а баг так и не пофикцили
Ссылка на кусочки кода не работает. Где можно взять код?
Спасибо!!!
Несколько дней думал, почему так происходит! На advanshop загружаю все хорошо, на wordpress изображения пляшут. Благодарю!
А я думал, что только я на jQuery джиквари говорю. А вон Валя вордпресс вёрдпрессом называет. Я еще еле научился говорить эко, а не эчё ))))))))))))))
Добрый вечер как можно обратиться к вам для Настройки сайта ?
спасибо! а какой плагин с этой задачей может справиться, порекомендуйте пж
Смотрю не первый урок! Но… Вместо ссылок на коды, ссылки на сайт!! Код самому искать приходится:( А так все круто!
Молодец, так дкржать! =)
🙂
Вы полезные уроки даёте, но мне сложно вас понимать, вы используете в основном профессиональные термины при объяснении
Добрый день! В теме OceanWP это не работает. Блок вставляется выше img.
В Ocean WP свои собственные хуки
спасибо вам за ваши уроки! у меня тут одна проблема возникла после добавление кусочок кода в файл functions.php, возникла критическая ошибка и сайте перестал загружаться. сайт на теме woodmart. не подскажите в чем может быть причина? за ранее спасибо.
Какой код добавляли? Какая конкретно ошибка?
@@VelWild код который вы написали для functions.php
После этого выдаёт ошибку
Если копирование с самой первой строки, то да, ошибка. Удалите первую строку которая начинается с / или допишите ещё один / в начале строки, чтобы строка начиналась с //
@@VelWild огромное спасибо, заработало👌
А на мобильную версию это не повлияет? И можно ли параллельно применить плагин сжатия изображений?
Для мобильной версии можно свои размеры сделать. Сжатие можно
Классное видео, но у меня почему то на Вудморд не сработало, хотя все написал как в видео
Валентина, если не сильно заняты, поможете решить проблему?
Іноді вашу інформацію можна сприймати .але такий великий нюанс як розмита подача зоображення всього відео як через боке . викликае погане сприйняття всбого контенту .може бути шо це баг .але наврятчи . як рішення нормальна камера .
Лайк звісно
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; }