Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #1447547

    Hi is there a bit of css that I can use to get all the shop images to shrink to fit the square boxes? Currently they are cropping out parts of the image that don’t fit in the box.
    Many thanks

    #1447611

    Hey fanlokbun,

    Thank you for the inquiry.

    You may need to adjust the size of the thumbnail in the Appearance > Customize > WooCommerce > Product Images panel. Adjust the value of the Thumbnail width based on the usual size in which you upload the image, and set Thumbnail cropping to Uncropped.

    Best regards,
    Ismael

    #1447729

    Many thanks Ismael I’ll give that a go.

    #1449038

    Hi I can’t get it to work. See the image below for how I have it set.
    Many thanks
    Rob

    #1449150

    Hi,
    Please link to the page with the screenshot so we can see if the image is truly cropped or if the image can be corrected with css ” background-size: contain”

    Best regards,
    Mike

    #1449153

    See below:

    #1449532

    Hi,
    Thanks, I see that the image is truly cropped because the your thumbnail size is cropped. Your image is not a square image so the 450×450 thumbnail will crop it.
    So if you want your product catalog to have a uniform look you can create a new image that is square instead of portrait and upload your new image, then the book will be centered in your 450×450 thumbnail.
    or if your shop is going to be a book store and all of your thumbnails will be a portrait shape image, you can try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

    function override_post_thumbnail_size($size, $post_id) {
        if (is_archive()) {
            return 'full';
        }
        return $size;
    }
    add_filter('post_thumbnail_size', 'override_post_thumbnail_size', 10, 2);

    this will show the full size image instead of the thumbnail.

    Best regards,
    Mike

    #1450298

    Hi Mike yes I know uploading square pictures would resolve the issue. The shop is going to be run by old aged pensioners with very little technical expertise. I want to make it as easy as possible for them so I was hoping there would be a “fit to longest side” CSS command for the thumbnails. I thought it was something we had achieved in the past but may be mistaken.
    Thanks
    Rob

    #1450365

    Hi,
    CSS will not work here because the image is cropped. Try the code that I posted to show the full sized image instead of the thumbnail, in my test this works.

    Best regards,
    Mike

Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.