Image aspect ratio distorted

Additional info:
We’re not using any caching plugin.
I tried chrome and firefox. Both in private/incognito-mode, too.
An employee and a customer also told me about that strange behaviour.

The image height seems ~ doubled, while the width is still normal.

edit:
for comparison, here an old screenshot (before the plugin-update):
https://www.screenpresso.com/=RPG1f

• This reply was modified 3 years, 5 months ago by nyks-barton.
• This reply was modified 3 years, 5 months ago by nyks-barton.

Hello,

Please check which image size you select? I see the image size showing 700 x 700 px so the image destroys.

Set width 300x 300px like this https://prnt.sc/15ejgez

We improve the code as per the Google Page Speed rule added image width and height property also remove the layout shifting issue.

Thanks

I dont have an option for 300×300; there is just a 200×200 ratio.

I switch to 200×200 now … but, now the thumbs are too small. Of course, its less worse than the stretched images. But still doesnt look good ?? (like in the previous plugin version)

Hello,

300×300 px WordPress default size. All theme has this size. Can you tell me the available size show in your site.

Or you can use the previous size 700×700 px but it is bigger than the grid size that will make the site slow. Need to write a CSS

Write this CSS in Appearance => Customize => Additional CSS
Next version I will update this CSS

.rt-tpg-container .layout1 .rt-holder .rt-img-holder img {
    height: auto;
}

Thanks

Thanks for your replies ??

My avaiable image sizes:
https://www.screenpresso.com/=UTN8e

And … following google’s principle “Mobile first”, most phones have ~ 800-1280px width, and the grid is displayed among each other. Doesnt that need a higher resolution (than 300px)?

• This reply was modified 3 years, 5 months ago by nyks-barton.

I see your theme override the default image size

You can use the size 700×700 px

Write this CSS in Appearance => Customize => Additional CSS

Next version I will update this CSS

.rt-tpg-container .layout1 .rt-holder .rt-img-holder img {
    height: auto;
}

Thanks

Thank you, this CSS works great! ??

Just for your info: The preview (in grid-editing) is still broken.

PS: Great support ??

• This reply was modified 3 years, 5 months ago by nyks-barton.
• This reply was modified 3 years, 5 months ago by nyks-barton.

Regarding load speed, I’ve notice another issue (found by lighthouse):
Is the external loading of “the-post-grid/font-awesome” really nessesary?

Lighthouse measured 4,8s and says:
https://www.screenpresso.com/=kU4Eg

• This reply was modified 3 years, 5 months ago by nyks-barton.

Hello,

Thanks for the notice.

Yes your site need to optimize mobile score only 7

See most of the Cache plugin has font preload option add the URL in that option.

I noted in next version I will add rel=”preload”

Thanks