Featured images are not loading properly

[Diptesh Das]

I am using the Flying Images plugin. It’s enabled lazy load on images.

While using while loading image on WordPress with flying images it taking big space the first time then it fits normal size?

Why this causing? what the issue.

Problem video:- https://youtu.be/Up325GgPvWc

[David]

Hi there,

it looks like the placeholder the plugin is generating is using the height of the full sized featured image ( eg. 800px ). Have you spoken to the plugin author how to change / fix that ?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Diptesh Das]

There was an option to change the image loading in the plugin

I am confused about which size is best for the Generatepress theme featured image?

Please let me know.

[Tom]

I’m not sure what that option does, exactly, but I assume it would depend on the size of the featured image you’re using. You can choose the featured image size in Customize > Layout > Featured Images.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Diptesh Das]

My featured image size is 1280 * 800 Pixels.

What size should I select on the featured image under the theme customization?

Please let me know.

[David]

Its not as simple as that.
For example:
your example posts featured image original size is 1200 x 800px.
However it is then scaled down to fit the content and is displayed at 720 x 449px on desktop
On mobile the scaling down reduces it to 373 x 233px on a plus size phone.

So there isn’t a fixed size you can use.
Might be worth looking for a lazy load plugin that calculates the displayed size.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Diptesh Das]

Besides this (Flying Images) plugin do you suggest any lazy load plugin which calculates the display size?

[David]

I tend not to use them.
But i just tested the Lazy Load option in the Autoptimize plugin and it looks like it maintains the correct height

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Diptesh Das]

what about the Wp rocket Lazy load?

Is that good?

Kindly please tell me.

[David]

I am sorry but i don’t have any personal experience of WP Rocket – a lot of our users do use it – but i cannot recall if it loads a correct size placeholder.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts