Size of thumbnail images in store catalog (6 posts)

  1. mako2
    Posted 2 years ago #


    I am having trouble with the size of images in store catalog.

    In this page I have set up the image size as 150px × 250px http://bit.ly/RjSOiq

    However, the images show in a different size and when I examine the image properties it says

    150px × 250px (scaled to 258px × 430px)

    Where does that 258px × 430px come from? How do I change it or remove it?

    Thanks a lot!


  2. ManusH
    Posted 2 years ago #

    There are a few different sources that effects the image sizes.

    First one is WordPress image thumbnail setting.
    Second is Woocommerce settings.
    Third is theme settings.
    And finaly some plugins.

    In your case, that (258px × 430px) values are not coming from any given value in that exact pixels. It is generated because of the (width: 100%;) style property.
    In order to fit 4 images in a row, every image's width is (width: 22.05%;)

    So that 100% declaration makes the images to fit that area and makes the width 258px.

    A new css style declaration will fix it; just disable that 100%.

  3. ManusH
    Posted 2 years ago #

    Btw, to mention your site being an "xxx-adult site" would be fine before looking for help.

  4. mako2
    Posted 2 years ago #

    Thank you so much! How do I do a new CSS declaration to change the sizes?

  5. ManusH
    Posted 2 years ago #

    In order to edit your styles, you can change the values in your themes style.css file. But it will not be permanent, will be overwritten / changed back to original in any future updates of your theme.

    To prevent from future updates / overwriting the changes there are some simple methods, like using a custom.css file or creatina a child theme.

    You can look for those methods. Most common way is to create a child theme and making all changes within that child theme and prevent all of your style and fuction changes from original theme updates.
    These are well-documented in WordPress site, you can follow those sections for your own site.

  6. mako2
    Posted 2 years ago #


    I am already using a child theme for all my websites.

    Where in the CSS I need to change to make the image sizes of the store catalog smaller?

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WooCommerce
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic