This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Post Loop Carousel Awkwardly Crops Images — Can I Change That?

Resolved 6 replies technicalthemetheme-vantage
8 years ago · Last reply by George Glazer 8 years ago

We really dislike how the Recently Added post loop crops images in order to present them as a rectangle, when everywhere else we are encouraged to produce them as squares. Is there a way to fix that?

See the bottom of this page: https://www.georgeglazer.com/

After looking through the forum, I tried this code in our Vantage Child Theme but it didn’t do anything:
/* Page Builder Post Loop Carousel */ .vantage-carousel-wrapper .vantage-carousel li.carousel-entry .thumbnail a { width: 162px !important; height: 162px !important; background-size: 162px 162px !important; }

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

6
  1. George Glazer 8 years, 6 months ago

    I should add that putting that code into the child theme didn’t do anything except distort the image by presenting them as squares and squashing them horizontally. I just want uncropped, undistorted images, and around 150 pixels square, or 162 pixels if that’s what I’d have to have, would be perfectly fine with us.

  2. Alex S Staff 8 years, 6 months ago

    Hi George,

    I would recommend changing to the SiteOrigin Carousel image instead of the Post Loop widget as it’ll give you the option of changing image size.

    Regardless, you can change the Vantage Carousel loop by installing Simple Image Sizes. Once installed, please navigate to WP Admin > Settings > Media and adjust the size of the vantage-carousel size – specifically, set the crop to none. Once you adjusted it, save and then regenerate your image sizes and clear your browser cache.

  3. George Glazer 8 years, 6 months ago

    Hi Alex,

    I tried all your suggestions and got this far: see the “Recently Added” row on https://www.georgeglazer.com/wpmain/

    I tried turning off cropping for vantage-carousel, but then I had distorted, stretched images. So I resized it to a square (182 x 182 instead of 272 x 182) That was better, but the images were noticeably off center in relation to the text beneath them, and cropped on the right. So I switched to the 200 x 200 pixel Shop Catalog image. Better than 182 x 182 but still off center and cropped on the right. (For good measure, I turned off cropping for sow-carousel and shop catalog as well.) Yes, ran the regeneration and cleared browser cache.

    Meanwhile, although I was not focusing on fixing the Related Products on the product pages, they look great now:
    https://www.georgeglazer.com/wpmain/product/figurine-pig-chef-whimsical-floral-design-georgia-vintage-late-20th-century/

    How do I get Recently Added to look like that? I couldn’t figure out where the Related Products settings are so I could see why it was looking better than Recently Added.

    –Helen

  4. George Glazer 8 years, 6 months ago

    Also, we have the same issue with the search results. The square images are cropped into rectangles, which looks terrible. When everywhere in the template we are meant to make product images square, I can’t figure out why it would be set up that way! I have no idea where to fix that, either.

  5. Alex S Staff 8 years, 5 months ago

    Hi George,

    The images are off centered in the recently added section due to CSS added to your custom CSS. Please navigate to WP AdminAppearanceCustom CSS and remove:

    .sow-carousel-thumbnail a,
    .sow-carousel-thumbnail a span.overlay {
      width: 200px !important;
      height: 200px !important;
    }

    The search images are your post thumbnails. Please navigate to WP AdminSettingsMedia and disable the Cropping for Post Thumbnails and regenerate your images/clear your browser.

  6. George Glazer 8 years, 5 months ago

    Thanks a lot for your assistance! Those things helped. I do get confused sometimes between the various places where SiteOrigin pages can be edited. I am trying not to end up with code in various places, but it’s easy to.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread