• Resolved maxhrkt

    (@maxhrkt)


    Hi!
    I want to have different thumbnail sizes for different pages on my site. For example, I want to have thumbnails in product grid 150x150px on my homepage, but I want to have larger product thumbnails on my other pages which display product grid.

    I can enlarge images with css, but thumbnails are still 150x150px, and when I set them to be i.e. 600c600px trough CSS, they become blurry.

    I tried to put some things in functions.php, but without any success, so I’d be very grateful if someone knows how to help me! Thanks in advance!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Hello @maxhrkt ,

    I got your point.

    WooCommerce allows you to control the thumbnail sizes with a couple of filters. You can find the available filters here – Changing what image sizes are used in WooCommerce via hooks

    You can use them and combine them with conditional tags either from WooCommerce or WordPress to target a specific page.

    Here, I have tried to change the thumbnail size only for the shop page and kept others to default size –

    add_filter( 'single_product_archive_thumbnail_size', function( $size ) {
    	if (is_shop()) {
    		return 'woocommerce_single';
    	} else {
    		return 'woocommerce_thumbnail';
    	}
    	
    },  100 );

    Please note that, If a theme has custom template files or uses its own functions to output images, these filters may not be in use.

    I will recommend consulting with an expert if you are not sure how to modify the codes based on your need.

    Thank you ??

    Hi there,

    We’ve not heard back from you in a while, so I’m marking this thread as resolved.

    Hopefully, you were able to find a solution to your problem! If you have further questions, please feel free to open a new topic.

    Thank you ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Different product thumbnail size for specific pages’ is closed to new replies.