最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

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

programmeradmin0浏览0评论

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.

Share Improve this question asked Nov 6, 2018 at 18:28 kushalkushal 11 silver badge1 bronze badge
Add a comment  | 

2 Answers 2

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;
}
  1. 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.

发布评论

评论列表(0)

  1. 暂无评论