BuddyBoss Home – Web Support Forums Solutions Social MarketPlace Adjust product image sizes on shop and individual product pages

Viewing 10 posts - 1 through 10 (of 10 total)
  • Question

    #64074
    @krutten

    I use a narrower product image than is used in theme templates – on all pages that have product images. I have changed the image size in the Woocommerce display settings and regenerated thumbnails, but I can't figure out how to adjust the css so that the full image shows on the appropriate pages. The only place that the full image shows is in the lightbox. As far as I can tell, the image size I set in the Woocommerce settings is the resulting size of the box that shows on the shop home page, including text. I need the image itself to be that size and the box made bigger (same width but taller) to accommodate that. Help?

    Answers

    #64227
    @vapvarun

    Hi @krutten
    For width following css has been used, you can put the width accordingly.
    At rest of location 100% width is used

    
    .woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
        width: 456px;
    }
    

    Regards
    Varun Dubey

    #64250
    @krutten

    Thanks @Varun … I tried your CSS but it had no effect that I could see. I'm not sure I explained my problem clearly – I use product images that are a horizontal rectangle instead of square (2:3 ratio; ie. 200px wide by 300px tall, etc.). I need the full product photos to be visible on all pages (shop, individual product page, etc.) Currently, the top and bottom of my product images is cut off.

    #64631
    @krutten

    Still need help with this…

    #64637

    Zarko
    Keymaster
    @zarko

    @krutten Try this code:

    add_action(‘init', ‘remove_plugin_image_sizes');

    function remove_plugin_image_sizes() {
    remove_image_size(‘bm-shop_single');
    add_image_size( ‘bm-shop_single', 200, 300, true );

    }

    My suggestion is to use 400×600 images will look better.

    #64638

    Zarko
    Keymaster
    @zarko

    @krutten Use it in child theme functions.php

    #64645
    @krutten

    Thanks @Zarko … I tried your code but it had no effect. I've attached a screenshot of what the product image looks like in my shop. As you'll notice the top and bottom of the photo are cut off. The same is true on the individual product page.

    #64656

    Zarko
    Keymaster
    @zarko

    @krutten Ok, I thought you were taking about large image on single product page, try this:

    add_action(‘init', ‘remove_plugin_image_sizes');

    function remove_plugin_image_sizes() {
    remove_image_size(‘bm-product-archive');
    add_image_size( ‘bm-product-archive', 200, 300, true );
    }

    and than regenerate thumbnails.

    #64663
    @krutten

    Yes!! That did the trick, at least for the shop page. Thanks @Zarko! Now what do I need to do to make the same adjustment for the individual product pages? The code provided earlier didn't work for that.

    #65193
    @vapvarun

    Great, I will close this topic
    Feel free to create new topic for any further queries.
    Regards
    Varun Dubey

Viewing 10 posts - 1 through 10 (of 10 total)
  • The question ‘Adjust product image sizes on shop and individual product pages’ is closed to new replies.