При необходимости изменить размер изображения товара в магазине есть несколько способов: с помощью стилей, настройки в панели администратора, в коде.
Изменить размер изображения товара с помощью стилей:
- Перейдите на страницу товаров;
- Кликните правой клавишей на товар и в появившемся меню выберите «Инспектор кода»;
- В инспекторе кода выберете нужный блок —
li
, который содержит товар; - Скопируйте селектор и затем вставьте его в свой файл
styles.css
и определите свойства ширины.
Изменить размер изображения товара в админке:
- В панели администратора зайдите в WooCommerce -> Settings;
- Кликните вкладку «Товары»;
- Кликните «Отображение»;
- Проскрольте вниз до «Изображения Товара»;
- Укажите свои значения ширины и высоты в поле «Изображение единичного товара»;
- Нажмите «Сохранить изменения».
После изменения размеров не забудьте перегенерировать миниатюры, чтобы изображения с новыми параметрами появились в системе, для этого воспользуйтесь плагином Regenerate Thumbnails.
Изменить размер изображения товара в коде:
Для изменения размера миниатюры товара необходимо добавить фильтр размера, сделать это можно с помощью приведенной ниже функции:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | /** * Установка произвольного размера изображения товара при выводе архива товаров * * @param $size * * @return string */ function custom_single_product_archive_thumbnail_size( $size ) { // определение нового размера для изображения в списке товаров $size = 'full'; return $size; } // вызов фильтра add_filter( 'single_product_archive_thumbnail_size', 'custom_single_product_archive_thumbnail_size', 10, 1 ); |
Сам хук, которым мы пользуемся расположен в плагине WooCommerce по адресу: