1

I'm using Woocommerce for a 1800+ product e-shop. Woocommerce comes with a built-in PrettyPhoto lightbox plugin. By default it loads the original Wordpress image size when you click to zoom the image in the lightbox.

Woocommerce calls for this original image in the template 'product-image.php'. I can modify that one. The variable $image_link calls the original size. I would like to call a custom size that I already made. I just don't know how to call it, I've looked for over a day in docs, forums and sites but can't find it.

I need to modify $image_link so that it calls my custom image size (that I added via add_image_size). But how? I know this is Wordpress basics but I'm unable to get it done...

Example of my site (click to zoom, it shows a reduced image of 1600px wide image, but I want a smaller one): http://www.affichesmarci.com/shop/the-railys-cycling-act/

<?php
    if ( has_post_thumbnail() ) {

        $image              = get_the_post_thumbnail( $post->ID, apply_filters( 'single_product_large_thumbnail_size', 'shop_single' ) );

        $image_title        = esc_attr( get_the_title( get_post_thumbnail_id() ) );
        $image_link         = wp_get_attachment_url( get_post_thumbnail_id() );

        $attachment_count   = count( $product->get_gallery_attachment_ids() );

        if ( $attachment_count > 0 ) {
            $gallery = '[product-gallery]';
        } else {
            $gallery = '';
        }

        echo apply_filters( 'woocommerce_single_product_image_html', sprintf( '<a href="%s" itemprop="image" class="bigbox woocommerce-main-image zoom" title="%s" rel="prettyPhoto' . $gallery . '">%s</a>', $image_link, $image_title, $image ), $post->ID );

    } else {

        echo apply_filters( 'woocommerce_single_product_image_html', sprintf( '<img src="%s" alt="Placeholder" class="bigbox" />', woocommerce_placeholder_img_src() ), $post->ID );

    }
?>

<?php do_action( 'woocommerce_product_thumbnails' ); ?>

2 Answers 2

1

You can use single_product_large_thumbnail_size Woocommerce filter as shown in following code to apply custom image size for product.

In the above code replace this

apply_filters( 'single_product_large_thumbnail_size', 'shop_single' )

with this

apply_filters( 'single_product_large_thumbnail_size', 'custom_thumbnail_size' );
1

If you can modify the code in your question, use wp_get_attachment_image_src instead of wp_get_attachment_url. You can specify the image size you want as the second argument.

$image = wp_get_attachment_image_src(get_post_thumbnail_id(), 'your_custom_size');
if ($image) {
  list($imageUrl, $imageWidth, $imageHeight) = $image;
  // do stuff with $imageUrl, etc
} else {
  // couldn't find the image, act accordingly
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.