[Resolved] Which plugin or code library would best deliver the Medium site's Blur-Up effect

[Tim]

Hello

Medium has that nice tiny base64 image with CSS blur effect to put in place before a full image is loaded.

Is there a plugin or best practice method for implementing that with GP ?

Thanks

Tim

[David]

Hi there,

not sure about that particular effect but you may want to check some of the lazy loaders out there, or those that are part of a cache/optimization plugin …..

Couple of caveats:
The majority of these plugins seem to only work on page initial load, which can lead to missing images when using Infinite Load / Load more that uses Ajax ( like the GP Blog and WP Show Posts does )….

You want one that allows you to omit images by filename or CSS class so they don’t mess with your logos and other static branding.

[Tim]

Hi David

Thank you for the heads up on the caveats to look out for.

When I first started researching this feature I found one nice write-up on how to get the lazy load and blur-up without using a plugin:

https://akzhy.com/blog/wordpress-lazy-load-images-with-blur-up-technique/

I was also considering the Optimole plugin https://wordpress.org/plugins/optimole-wp/ but it will take some further investigation to see if it is a good fit.

[David]

The code method is nice 🙂 It comes down to whether you want to maintain it….
Thanks for sharing.

[Tim]

Yes, I’m not sure what the implications of maintaining the code would be. Do you foresee any potential issues with it ?

[David]

Nothing jumps out immediately – but you’re changing the standard behaviour of how images are output and filtering the_content() which does introduce possible conflicts with how other plugins/functions operate…..

[Tim]

Yes, perhaps a can of worms running down a rabbit hole situation that I would rather avoid. 🙂

[David]

I hear you there 🙂

[Author]

Posts