Search code examples
phpwordpressimagewoocommercezooming

Change zoom magnifier product image size in Woocommerce 3


I'm struggling for a very long time to get the magnified or lightbox image set to a different (custom) size instead of the full size uploaded image.

I found out that it is controlled by this line of code in wc-template-functions .php on line 1399:

$full_size         = apply_filters( 'woocommerce_gallery_full_size', apply_filters( 'woocommerce_product_thumbnails_large_size', 'full' ) );

I tried to create a function to change 'full' to "preview' or 'large' but I can't get my code to work. See my code below:

function change_magnifier_lightbox_image_size(){
  echo "De post" , $post;

  $post_thumbnail_id = get_post_thumbnail_id( $post->ID );
  echo "De ID ", $post_thumbnail_id;
  $filemeta = wp_get_attachment_metadata( $post_thumbnail_id, FALSE );
  echo "De filemeta ", $filemeta;

    if ($filemeta['width']>3071 || $filemeta['height']>3071){
      $full_size         = apply_filters( 'woocommerce_gallery_full_size', apply_filters( 'woocommerce_product_thumbnails_large_size', 'preview' ) );
    }else{
      $full_size         = apply_filters( 'woocommerce_gallery_full_size', apply_filters( 'woocommerce_product_thumbnails_large_size', 'large' ) );
    };
};
apply_filters( 'woocommerce_product_thumbnails_large_size', 'change_magnifier_lightbox_image_size' );

$post is set to global.

I don't get any echo at all, also not from the strings and the code is in my child themes functions.php. What am I missing?


Solution

  • There is some errors and mistakes in your code. Try the following instead:

    add_filter( 'woocommerce_gallery_full_size', 'change_magnifier_lightbox_image_size', 20, 1 );
    function change_magnifier_lightbox_image_size( $size ){
        $thumbnail_id = get_post_thumbnail_id( get_the_id() );
        $attachment   = wp_get_attachment_metadata( $thumbnail_id, FALSE );
    
        // Always return a value in a filter hook
        return ( $attachment['width'] > 3071 || $attachment['height'] > 3071 ) ? 'preview' : 'large';
    }
    

    Code goes in function.php file of your active child theme (or active theme). Tested and works.