WooCommerce Single Product Page image too large. How to change image size.

  • Author
  • #122783
    Power User

    Fluida Plus

    How do you keep the image on the Woocommerce single product page from enlarging to 600px x 600px? Our image is 216px x 216px and we want it to stay that size.

    When we change the theme to WordPress default of Twenty Twenty-One, the image does not enlarge.

    Website: sutherlandlodge.org/w/product/donate-any-amount

    Cryout Creations mastermind


    I believe we’ve discussed about this through the support service.

    For anyone else having the same question, TwentyTwentyOne filters each image’s attributes (including products) and adds inline styling to set the maximum size attribute. We don’t do this in our themes because inline styling is generally bad practice.

    If (all) the product images used are rather small, it should be possible to force shrink them with CSS:

    body.woocommerce div.product div.images img {
        max-width: ...px; /* actual image files width or of the smallest of them */

    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
Viewing 2 posts - 1 through 2 (of 2 total)

You need to log in to reply to this topic.