Main product image cropped - by yaronfa - on WordPress WooCommerce support

This topic has 13 replies, 3 voices, and was last updated 6 years, 8 months ago ago by Rose Tyler

  • Avatar: yaronfa
    yaronfa
    Participant
    March 4, 2018 at 10:25

    In the single product page, the main image appears cropped, but if I hover with the mouse I can see the whole picture. How can I fix this?

    I have sent a url in the private content section

    Thank you
    Yaron

    Please, contact administrator
    for this information.
    12 Answers
    Avatar: yaronfa
    yaronfa
    Participant
    March 4, 2018 at 10:28

    Here is another example (in private content)

    Please, contact administrator
    for this information.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 5, 2018 at 08:12

    Hello,

    Zoom effect shows the real size of images, if you don’t want the zoom you can disable it in Theme Options > E-commerce > Single Product Page.
    If your WC version 3.2.6, this article can be useful for you –
    https://docs.woocommerce.com/document/fixing-blurry-product-images/ To change the size of the product images go to WooCommerce > Settings > Product > Display > Image settings + don’t forget to regenerate thumbnails after changes (use Regenerate thumbnails plugin).
    Feel free to ask if you have any other questions.

    Regards

    Avatar: yaronfa
    yaronfa
    Participant
    March 5, 2018 at 12:03

    By your reply I understand that my incident is not clear, so I will explain it again:
    Regardless of the zoom – the image is not displayed fully.
    Look at this product:
    In the main image there are 2 phones. The smaller phone on the right is not displayed fully.
    The original image contains the two phones.

    What do I need to change to see the whole picture when not zooming in?

    It is the same problem on all prictures

    Thanks
    Yaron

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 5, 2018 at 13:53

    Hello,

    Could you please provide temporary wp-admin access in Private Content?

    Regards

    Avatar: yaronfa
    yaronfa
    Participant
    March 5, 2018 at 15:26

    temporary admin access is provided in private content
    Thanks

    Please, contact administrator
    for this information.
    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    March 6, 2018 at 16:51

    Hello,

    Go to Tools > Regenerate thumbnails > Regenerate all the thumbnails http://prntscr.com/innoya

    Regards

    Avatar: yaronfa
    yaronfa
    Participant
    March 14, 2018 at 10:27

    Thank you

    a. Can you please tell me what you did? this is a multisite – so I need to do it on all the websites

    b. In product category page, when we see a list of products, the thumbnail is too small until I click the next thumbnail arrow and then click back. Do you have an idea how to fix this?

    Thank you
    Yaron

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 14, 2018 at 14:56

    Hello,

    a. Single product image size was changed in Woocommerce > Products > Display > Product images http://prntscr.com/ir3mu4
    b. I’ve changed image size in http://prntscr.com/ir3n76 but to fix the problem we need access to FTP.

    Regards

    Avatar: yaronfa
    yaronfa
    Participant
    March 19, 2018 at 15:32

    FTP details are in private content. This is a multi-site.

    Thank you
    Yaron

    Please, contact administrator
    for this information.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 20, 2018 at 09:06

    Please delete this custom css code http://prntscr.com/itnl9j
    and add a new one:

    .products-grid .product .product-image-wrapper {
        display:  -webkit-box;
        display:  -webkit-flex;
        display:  -ms-flexbox;
        display:  flex;
        -webkit-box-align:  center;
        -webkit-align-items:  center;
            -ms-flex-align:  center;
                align-items:  center;
        -webkit-box-pack:  center;
        -webkit-justify-content:  center;
            -ms-flex-pack:  center;
                justify-content:  center;
    }

    Regards

    Avatar: yaronfa
    yaronfa
    Participant
    April 4, 2018 at 14:02

    Thanks, That partially worked as there are images that the height is bigger than the width and other images where the width is bigger, so we didn’t find a perfect solution.

    Another question:
    The ajax search box results are shown as links, and the link works only when you click on the text.
    Is there an option to change it so that when you hover with the mouse the whole area’s background color is changed and the whole search result item is clickable?

    Thank you
    Yaron

    Please, contact administrator
    for this information.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    April 4, 2018 at 15:35

    1. Please try to add this code also:

    @media only screen and (min-width: 992px) {
        .product-loop .product .product-image-wrapper img {
            height: 180px;
            width:  auto;
        }
    }

    2. Sorry, but there is no such possibility. This request additional customization.

    Regards

  • Viewing 13 results - 1 through 13 (of 13 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.