New Woocommerce Shop Gallery Thumbnails Suddenly Smaller Than Previously Created Thumbnails

[ppe29]

Has anyone looked into why this is happening yet? It’s still an issue for me. Meanwhile, can I get some assistance on how to target this class that’s saying the min width for woo thumbnails is 300? I need to change it to 350 so the images match the width of the label. I have tried to do this in Appearance>Customize>Woo>Product Images, but there is something else over-riding it b/c changing the size to 350 has no effect.

You can see in the third screenshot that changing it to 350 gets the job done.

[christian]

@ppe29, We currently don’t have a solution. We do not have a CSS solution either.

I’d recommend you do the previous suggestion which is to:

1. take note of your orders
2. contact your web host to revert your site to a previous working state

Thank you for understanding.

[Neil_Randle]

Changing

$thumb = ‘shop_catalog’;

To

$thumb = ‘woocommerce_thumbnail’;

framework/legacy/functions/plugins/woocommerce.php

Seems to have fixed it for me, But not 100% sure I know what I’m doing.

Added the below to the Child functions.php so I did not have to edit the theme file.

// Thumb Fix
function b_woocommerce_shop_product_thumbnails() {

  GLOBAL $product;

  $id     = get_the_ID();
  $thumb  = 'woocommerce_thumbnail';
  $rating = ( function_exists( 'wc_get_rating_html' ) ) ? wc_get_rating_html( $product->get_average_rating() ) : $product->get_rating_html();

  woocommerce_show_product_sale_flash();

  echo '<div class="entry-featured">';
    echo '<a href="' . get_the_permalink() . '">';

      echo has_post_thumbnail() ? get_the_post_thumbnail( $id, $thumb ) : '<img src="' . x_woocommerce_shop_placeholder_thumbnail() . '" class="x-shop-placeholder-thumbnail">';

      if ( ! empty( $rating ) ) {
        echo '<div class="star-rating-container aggregate">' . $rating . '</div>';
      }

    echo '</a>';
  echo "</div>";

}

add_filter('init', function() {
  remove_action( 'woocommerce_before_shop_loop_item_title', 'x_woocommerce_shop_product_thumbnails', 10 );
});

add_action( 'woocommerce_before_shop_loop_item_title', 'b_woocommerce_shop_product_thumbnails', 10 ); 

//End

If you could let me know if this is ok to use or provide a better solution would be grateful.

Before (fix):

After (Fix):

Now using the 1:1 Woocommerce cropped thumbnail

[ruenel]

Hello @Neil_Randle,

Thanks for sharing this very useful code. We really appreciate it.

Cheers.

[ruenel]

Hello @Neil_Randle and @ppe29,

The updated PHP code to fix the issue is this:

// Woo Thumbnails Fix
// =============================================================================
function b_woocommerce_shop_product_thumbnails() {

  GLOBAL $product;

  $id     = get_the_ID();
  $thumb  = 'woocommerce_thumbnail';
  $rating = ( function_exists( 'wc_get_rating_html' ) ) ? wc_get_rating_html( $product->get_average_rating() ) : $product->get_rating_html();

  woocommerce_show_product_sale_flash();

  echo '<div class="entry-featured">';
    echo '<a href="' . get_the_permalink() . '">';

      echo has_post_thumbnail() ? get_the_post_thumbnail( $id, $thumb ) : '<img src="' . b_woocommerce_shop_placeholder_thumbnail() . '" class="x-shop-placeholder-thumbnail">';

      if ( ! empty( $rating ) ) {
        echo '<div class="star-rating-container aggregate">' . $rating . '</div>';
      }

    echo '</a>';
  echo "</div>";

}

function b_woocommerce_shop_placeholder_thumbnail() {

  $placeholder = x_get_option( 'x_woocommerce_shop_placeholder_thumbnail' );

  if ( empty( $placeholder ) && function_exists( 'cornerstone_make_placeholder_image_uri' ) ) {

    $sizes = wp_get_additional_image_sizes();
    $image_size = apply_filters( 'single_product_archive_thumbnail_size', 'woocommerce_thumbnail' );
    $size = isset($sizes[$image_size]) ? $sizes[$image_size] : array( 'height' => 300, 'width' => 300 );
    $placeholder = cornerstone_make_placeholder_image_uri( 'transparent', $size['height'], $size['width'] );

  }else{

    $image_url = cs_resolve_image_source( $placeholder, 'woocommerce_thumbnail');
    $placeholder = $image_url;

  }

  return $placeholder;

}

add_filter('init', function() {
  remove_action( 'woocommerce_before_shop_loop_item_title', 'x_woocommerce_shop_product_thumbnails', 10 );
});

add_action( 'woocommerce_before_shop_loop_item_title', 'b_woocommerce_shop_product_thumbnails', 10 ); 
// =============================================================================
//End

This has been reported as a bug so that our developers are aware of the issue. Hopefully this can be fixed in the newer versions of the theme.

Thanks for your understanding.

[ppe29]

I will play around with this solution started by @Neil_Randle and @ruenel, but let me also share that this bit of CSS code was helping too.

[class*=woocommerce] li.product .entry-featured img {
min-width: 350px;
}

[tristup]

Hi @ppe29,

Thanks for sharing that too.