Как отключить обрезку миниатюр в плагине woocommerce

@Timofey1993 · Регистрация: 11.07.2016

Author24 — интернет-сервис помощи студентам

Всем привет
Я совсем новичок в работе с WP и столкнулся с не очень приятной проблемой, абсолютно все миниатюры на сайте, связанные с WooCommerce принудительно обрезаются, если же обрезку отключить, то большинство миниатюр имеют разные размеры. Порывшись на различных форумах, нашел код, который позволил в списке подкатегорий как раз загнать миниатюры в обертку и добиться нужного эффекта, но как другие миниатюры можно "исцелить" я ума не приложу, поэтому прошу помощи.

Вот куски кода, который я нашел

Function.php

Кликните здесь для просмотра всего текста

PHP

remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_thumbnail', 10);
add_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_thumbnail', 10);
 
 
if ( ! function_exists( 'woocommerce_template_loop_product_thumbnail' ) ) {
    function woocommerce_template_loop_product_thumbnail() {
        echo woocommerce_get_product_thumbnail();
    } 
}
if ( ! function_exists( 'woocommerce_get_product_thumbnail' ) ) {   
    function woocommerce_get_product_thumbnail( $size = 'shop_catalog', $placeholder_width = 0, $placeholder_height = 0  ) {
        global $post, $woocommerce;
        $output = '<div class="imagewrapper">';
 
        if ( has_post_thumbnail() ) {               
            $output .= get_the_post_thumbnail( $post->ID, $size );              
        }                       
        $output .= '</div>';
        return $output;
    }
}
 
function add_image_wrapper_sub_cat_open() { echo '<div class="imagewrapper">'; }
add_action( 'woocommerce_before_subcategory_title', 'add_image_wrapper_sub_cat_open', 9, 2 );
 
 
function add_image_wrapper_sub_cat_close() { echo '</div>'; }
add_action( 'woocommerce_before_subcategory_title', 'add_image_wrapper_sub_cat_close', 11, 2 );

Кликните здесь для просмотра всего текста

style.css

CSS

.imagewrapper {
    margin-bottom: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 300px;
    background: white;
}
 
.imagewrapper img {
    max-height: 300px;
    max-width: 290px;
    width: auto !important;
}

Ниже прилагаю скриншоты

Кликните здесь для просмотра всего текста

Как отключить обрезку миниатюр в плагине woocommerce

@Vlad03 · 10.02.2020, 19:30

Timofey1993, если память не изменяет, в кастомайзере темы отключить обрезку картинок и добавить код в css. Код для function.php вроде бы лишний

@Timofey1993 · 10.02.2020, 20:19 **[ТС]**

Vlad03
попробовал удалить код из function и миниатюры опять поломались, потом почистил от лишних строчек код и оставил только эти

PHP

function add_image_wrapper_sub_cat_open() { echo '<div class="imagewrapper">'; }
add_action( 'woocommerce_before_subcategory_title', 'add_image_wrapper_sub_cat_open', 9, 2 );
 
 
function add_image_wrapper_sub_cat_close() { echo '</div>'; }
add_action( 'woocommerce_before_subcategory_title', 'add_image_wrapper_sub_cat_close', 11, 2 );

и с этими строчками + кодом для css миниатюры для подкатегорий работают. Может миниатюры для виджетов и изображений товара можно как-то адаптировать этот код?

@im_beetle · 10.02.2020, 22:09

В последних версиях внешний вид - настроить - WooCommerce там товар по-моему и там уже будут настройки изображений где отключается легко

@Vlad03 · 10.02.2020, 23:26

Timofey1993, можно и так, а можно и переписать CSS селекторы вашей разметки для соответствия верстки, я бы сделал второе "из любви к искусству"
im_beetle, здесь, и не только, есть желание опустить обработку медиа для сайта, потому что...

@im_beetle · 11.02.2020, 10:14

Как можно опустить обработку, если при обработке идёт обрезка

@Vlad03 · 11.02.2020, 10:21

im_beetle, имелось в виду не тратить время на подгонку картинок под размеры перед заливкой на сайт

@Timofey1993 · 11.02.2020, 12:30 **[ТС]**

Vlad03
не подскажете как переписать селекторы можно? Я в этом деле вообще дуб

Добавлено через 2 минуты
im_beetle
хочется именно в обертку миниатюры поместить, как это получилось в случае с подкатегориями на скриншоте. Странно вообще, что вукомерц не поддерживает такой настройки, а каждое изображение подгонять по размеру тоже не хочется, тем более на сайте используются не только квадратные изображения

@Vlad03 · 11.02.2020, 13:56

Timofey1993, смотрите в консоли браузера, куда цепляется CSS, после удаляете код PHP и меняете в CSS селекторы, что бы получилось тоже самое или оставьте, как есть сейчас

@Vlad03 112 / 108 / 42 Регистрация: 22.01.2017 Сообщений: 452
	10.02.2020, 19:30	2
	Timofey1993, если память не изменяет, в кастомайзере темы отключить обрезку картинок и добавить код в css. Код для function.php вроде бы лишний 0

@im_beetle 9 / 6 / 3 Регистрация: 08.02.2020 Сообщений: 54
	10.02.2020, 22:09	4
	В последних версиях внешний вид - настроить - WooCommerce там товар по-моему и там уже будут настройки изображений где отключается легко 0

@Vlad03 112 / 108 / 42 Регистрация: 22.01.2017 Сообщений: 452
	10.02.2020, 23:26	5
	Timofey1993, можно и так, а можно и переписать CSS селекторы вашей разметки для соответствия верстки, я бы сделал второе "из любви к искусству" im_beetle, здесь, и не только, есть желание опустить обработку медиа для сайта, потому что... 0

@im_beetle 9 / 6 / 3 Регистрация: 08.02.2020 Сообщений: 54
	11.02.2020, 10:14	6
	Как можно опустить обработку, если при обработке идёт обрезка 0

@Vlad03 112 / 108 / 42 Регистрация: 22.01.2017 Сообщений: 452
	11.02.2020, 10:21	7
	im_beetle, имелось в виду не тратить время на подгонку картинок под размеры перед заливкой на сайт 0

@Timofey1993 0 / 0 / 0 Регистрация: 11.07.2016 Сообщений: 4
	11.02.2020, 12:30 [ТС]	8
	Vlad03 не подскажете как переписать селекторы можно? Я в этом деле вообще дуб Добавлено через 2 минуты im_beetle хочется именно в обертку миниатюры поместить, как это получилось в случае с подкатегориями на скриншоте. Странно вообще, что вукомерц не поддерживает такой настройки, а каждое изображение подгонять по размеру тоже не хочется, тем более на сайте используются не только квадратные изображения 0

@Vlad03 112 / 108 / 42 Регистрация: 22.01.2017 Сообщений: 452
	11.02.2020, 13:56	9
	Timofey1993, смотрите в консоли браузера, куда цепляется CSS, после удаляете код PHP и меняете в CSS селекторы, что бы получилось тоже самое или оставьте, как есть сейчас 0