woocommerce offtopic - How to change product thumbnail size in storefront theme

admin管理员组

文章数量:1335082

I was trying to display product thumbnails in 230px (as per recommendations by GTmetrix).

Since, I am using storefront the default value is declared in storefront/inc/class-storefront.php

The code is as follows:

add_theme_support( 'woocommerce', apply_filters( 
'storefront_woocommerce_args', array(
'single_image_width'    => 416,
'thumbnail_image_width' => 324,
'product_grid'          => array(
'default_columns' => 3,
'default_rows'    => 4,
'min_columns'     => 1,
'max_columns'     => 6,
'min_rows'        => 1

) ) ) );

I tried assigning single_image_width with the value of 230 and it made no difference. So, I marked out the line and added the following code in my functions.php file:

add_theme_support( 'woocommerce', array(
'thumbnail_image_width' => 230
) );
}

This doesn't seem to make a difference either. What am I doing wrong?

For reference this is the images I am trying to resize. I used woocommerce shortcodes to display it in the site.

I would really appreciate the help.

Thank you, - KG.

I was trying to display product thumbnails in 230px (as per recommendations by GTmetrix).

Since, I am using storefront the default value is declared in storefront/inc/class-storefront.php

The code is as follows:

add_theme_support( 'woocommerce', apply_filters( 
'storefront_woocommerce_args', array(
'single_image_width'    => 416,
'thumbnail_image_width' => 324,
'product_grid'          => array(
'default_columns' => 3,
'default_rows'    => 4,
'min_columns'     => 1,
'max_columns'     => 6,
'min_rows'        => 1

) ) ) );

I tried assigning single_image_width with the value of 230 and it made no difference. So, I marked out the line and added the following code in my functions.php file:

add_theme_support( 'woocommerce', array(
'thumbnail_image_width' => 230
) );
}

This doesn't seem to make a difference either. What am I doing wrong?

For reference this is the images I am trying to resize. I used woocommerce shortcodes to display it in the site.

I would really appreciate the help.

Thank you, - KG.

• woocommerce-offtopic
• thumbnails

Share Improve this question asked Nov 6, 2018 at 18:28 kushalkushal 111 silver badge11 bronze badge

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 1

I can't take credit for this one, but I found the answer at themebynumbers

In my storefront-child folder I have added this to my functions.php file:

add_filter( 'woocommerce_get_image_size_thumbnail', function( $size ) {
  return array(
    'width'  => 150,
    'height' => 150,
    'crop'   => 1,
  );
});

Despite this is an old question I'll try to provide more in depth answer (in case someone is struggling).

1. First of all you shouldn't modify storefront/inc/class-storefront.php Use a child theme instead.

2. Secondly, use proper filter in your child theme. (this should work):

add_filter( 'storefront_woocommerce_args', 'storefront_args_override', 10, 1 ); 
function storefront_args_override( $args ) {
    $args['thumbnail_image_width'] = 230;
    return $args;
}

3. And finally - REGENERATE THUMBNAILS

when you add new image sizes to wp, all already uploaded images wont regenerate automatically. You need to upload images again or simply regenerate thumbnails.

本文标签： woocommerce offtopicHow to change product thumbnail size in storefront theme