Make Woocommerce product gallery images the same size as product image

By default Woocommerce allows you to add a 1 ‘product image’ which fills close to 50% of that product page.

Then when you add more images they have to go in the ‘product gallery’.

These appear as small thumb nails which by clicking on them will show them much larger.

I wish to have it so all these images are shown as large images on the page rather than thumbnails - basically like:

https://www.alexandermcqueen.com/en-gb/new-arrivals/mcqueen-graffiti-hybrid-jacket-659153QRV011000.html

I am using the latest version of Pro and Woocommerce

Thank you

Hello @hyperdrive_boom,

Thanks for writing to us.

Product gallery image always appears as thumbnail and it gets bigger or slides on click event. It is a default nature of the WooCommerce plugin. To change the product gallery image size would require custom development. I would suggest you contact a developer who can assist you with your concern. Please note that we don’t provide custom development support. It is out of the support scope.

In case if you have an idea about coding you may check this article to learn more about how to customize the size of the product gallery.
https://docs.woocommerce.com/document/image-sizes-theme-developers/

Thanks for understanding

Good morning @prakash_s and thank you for the link,

Perhaps I am making this too complex and instead how about moving the ‘description’ panel up to where the product image would normally be?

I could then add images into that panel

Is this something you can add to the functions file on the child theme?

Hello again,

I found that you had answered the above request with something very similar:

I just removed this part you mentioned in the single-product.php child file:

<figure class="woocommerce-product-gallery__wrapper">
		<?php
		if ( has_post_thumbnail() ) {
			$html  = wc_get_gallery_image_html( $post_thumbnail_id, true );
		} else {
			$html  = '<div class="woocommerce-product-gallery__image--placeholder">';
			$html .= sprintf( '<img src="%s" alt="%s" class="wp-post-image" />', esc_url( wc_placeholder_img_src() ), esc_html__( 'Awaiting product image', 'woocommerce' ) );
			$html .= '</div>';
		}

		echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', $html, $post_thumbnail_id );

		do_action( 'woocommerce_product_thumbnails' );
		?>
	</figure>

Thank you again

Hi @hyperdrive_boom,

We’re glad that you’re able to figure it out! If you have any other concerns or clarifications regarding our theme features, feel free to open up a new thread.

Thank you.

No problem - thank you

Hi @hyperdrive_boom,

You’re welcome!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.