Images CSS - by slw250@hotmail.com - on WordPress WooCommerce support

This topic has 8 replies, 3 voices, and was last updated 5 years, 7 months ago ago by Olga Barlow

  • Avatar: slw250@hotmail.com
    slw250@hotmail.com
    Participant
    August 7, 2018 at 17:20

    Hello,
    is there any CSS for images so they spears same on website shop pages. My images are not same size when I upload them on website before i was using your theme and those images were appeared same size on the shop pages. now after i am using your theme it appears at different size as I upload before. How can i adjust them so they apeared the same size. here is the url for one of the page: https://alhamrah.com/product-category/general-merchandises/lighters-and-accessories/lighter-fuel/

    Please help

    7 Answers
    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    August 8, 2018 at 09:14

    Hello,

    1) Go to Appearance > Customize > WooCommerce > Product Images and set the most suitable for you image settings. Regenerate thumbnails after that.
    2) Add the following code in Theme Options > Styling > Custom CSS

    .content-product .product-content-image img {
        min-width: 1px;
        width: auto;
    }

    3) Also, some of your images are so small 88x88px https://alhamrah.com/wp-content/uploads/2016/06/CAKLJ6VP.jpg We would recommend uploading images no less than 600px width or height for every product to have the nice grid.

    Regards

    Avatar: slw250@hotmail.com
    slw250@hotmail.com
    Participant
    August 8, 2018 at 15:47

    Thank you

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    August 8, 2018 at 17:07

    You are welcome!

    Regards

    Avatar: slw250@hotmail.com
    slw250@hotmail.com
    Participant
    August 9, 2018 at 00:08

    Can you please give me same for categories and sub categories also

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    August 9, 2018 at 09:31

    Hello,

    That code should work for all the products. You are using the cache plugin. Add the code and flush the plugin and browser cache after that.

    Regards

    Avatar: norbert.s
    norbert.s
    Participant
    August 9, 2018 at 09:48

    Hi I have the same problem. I set my Thumbnail cropping 1:1 and product isn´t fit to these square. I tried your custom ccs code but nothing has changed.
    Please help me.

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    August 9, 2018 at 10:13

    Hello, @norbert.s

    Seems you either did not set the 1:1 proportion or did not regenerate thumbnails after that.
    Also, we would not recommend you to use very long images like you have at present. Use the graphics editor to create squared images before uploading them to your dashboard, it will be the best solution. Because if you crop existing image user won’t understand what you sell, the image will look ugly.

    Some workaround for you can be CSS limit for the height, for example, replace that code by the following:

    .content-product .product-content-image img {
        min-width: 1px;
        width: auto;
        max-height: 300px;
    }

    But I prefer using of the good images at the start.

    Regards

  • Viewing 8 results - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.