Вопрос или проблема
У меня есть одна категория продукта, для которой нужны миниатюры 300 x 300px без обрезки. Все остальные продукты имеют миниатюры 300 x 300px с обрезкой. Это будет на странице магазина и на страницах категорий. Категория касается книг, и обрезанное изображение обрезает верхнюю и нижнюю части обложки книги. Все остальные категории продуктов выглядят лучше с квадратными обрезанными изображениями.
Я добавил этот код в файл functions.php, но он не имеет эффекта. Поскольку стандартное среднее изображение WP уже 300 x 300px, без обрезки на сайте, я использовал “medium” в качестве $size. Я искал больше часа и не мог найти много чего полезного. Правильно ли я движусь в этом коде, или нет? Есть ли какие-либо советы? Спасибо!
/* Установите размеры изображений на страницах категорий для книг */
if ( is_product_category( '2295' )) {
// другой размер для одной категории
remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_thumbnail', 10 );
add_action( 'woocommerce_before_shop_loop_item_title', 'custom_loop_product_thumbnail', 10 );
function custom_loop_product_thumbnail() {
global $product;
$size="medium";
$image_size = apply_filters( 'single_product_archive_thumbnail_size', $size );
return $product ? $product->get_image( $image_size ) : '';
}
}
вы можете использовать фильтр woocommerce_gallery_thumbnail_size, и внутри этой функции использовать if ( is_product_category(2295) ) что-то вроде:
add_filter( 'woocommerce_gallery_thumbnail_size', function( $size ) {
if ( is_product_category(2295) ){
return 'thumbnail';
}
return $size;
} );
вы можете проверить документацию WooCommerce здесь
Ответ или решение
Чтобы изменить размер изображений товаров в одной категории WooCommerce, необходимо учитывать несколько ключевых моментов. Ваша задача заключается в том, чтобы для категории, связанной с книгами, установить изображения формата 300 x 300 пикселей без обрезки, в то время как для других категорий сохранять обрезанные изображения того же размера.
Шаги для достижения нужного результата
1. Определение нужной категории
Для начала убедитесь, что у вас есть правильный ID категории. В вашем примере указан ID 2295, что, очевидно, соответствует категории книг. Вам нужно удостовериться, что это ID вашей целевой категории.
2. Изменение размеров изображений
Согласно вашему коду, вы правильно использовали хуки WooCommerce, чтобы настраивать отображение изображений. Однако, чтобы избежать обрезки изображений, вам необходимо использовать фильтр woocommerce_get_image_size в сочетании с функцией проверки текущей категории.
Ваш окончательный код может выглядеть так:
add_filter( 'woocommerce_get_image_size', function( $size, $image_type ) {
if ( is_product_category( '2295' ) && $image_type === 'thumbnail' ) {
return array( 'width' => 300, 'height' => 300, 'crop' => false );
}
return $size;
}, 10, 2 );Этот код делает следующее:
- Проверяет, находитесь ли вы на странице категории с ID
2295. - Если это так и запрашивается миниатюра (thumbnail), он изменяет параметры размера изображения на 300 x 300 пикселей без обрезки (crop = false).
- Для всех остальных случаев возвращается оригинальный размер.
3. Обновление изображений после внесения изменений
После внесения изменений в код функций необходимо обновить изображения:
- Загрузите и установите плагин Regenerate Thumbnails. Данный плагин позволяет пересоздавать миниатюры для всех изображений в библиотеке.
- Перейдите в раздел Инструменты → Перегенерировать миниатюры и запустите процесс.
Это гарантирует, что все изображения в вашей категории книг будут пересозданы в новом формате, который вы указали.
4. Кэширование
Убедитесь, что отключили кэширование вашего сайта или очистили кэш после внесения изменений в код, чтобы увидеть обновления.
Заключение
Ваша задача состоит в том, чтобы индивидуально настроить размеры изображений для одной категории товаров в WooCommerce. Предложенный код обеспечивает полное выполнение ваших требований без компромиссов по качеству отображения для книг. Данный подход позволит вам иметь контролируемый и однородный стиль страницы магазина, который хорошо отразится на пользовательском опыте и SEO.