Docs

[ykelley]

Hello,

If you see my page http://www.cookwithamber.com you will see that the essential grid thumbnail for “Behind the Scenes…” and “Fizzy Fruit!” are not honoring the aspect ratio of the image, but rather stretching them. Can you help me fix this issue? Thank you.

[Nabeel A]

Hi there,

Thanks for writing in! Please add the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

.esg-layout-masonry .esg-entry-media img {
    width: auto !important;
}

Let us know how this goes!

[ykelley]

Thank you. I did this, and instead of changing the size of the masonry blocks, it cropped the image. I would like it to hnor the image’s aspect ratio – the images of the masonry grid do not have to be all the same size (that’s the point of the masonry grid, I believe.) Please help!

[Rupok]

Hi there,

Thanks for updating. I understand what you are referring but it’s not that kind of Masonry or I’d say not real masonry because here the whole content blocks are arranged as masonry not the images. Unfortunately we can’t control the behavior of a plugin because it’s not by Themeco and we bundle the unmodified version of that.

Cheers!

[ykelley]

Essential Grid’s website defines the Masonry Grid as “Essentially a non-symmetrical grid, where the width of the items will always be the same, but the height of each item will vary depending on the original image’s size ratio. Images may be resized but will never be cropped.”

Essential Grid is part of Theme X, and I just would like to see this basic functionality. Can you help me find a way to get it to work as designed with Theme X?

Thank you,
Yohko

[Nabeel A]

Hi Yohko,

The images you’re using are of high resolution that’s why they are getting cropped to adjust the size with the grid. You can re-size them manually according to the grid width and upload them.

Hope this helps!

[Author]

Posts