- Posts
Hello,
We are using the W3 Total Cache plugin on [redacted] website.
When we enable the Page Cache option of W3 Total Cache all the images of the website don’t show and if I disable that option all the images works fine.
Please help us to resolve this issue.
Waiting for your reply.
Regards,
Yogesh Bhade
Hello Yogesh-
Sorry to hear about the trouble. Occasionally, this issue can be caused by using two caching/minifying plugins at the same time. If you are, make sure that HTML Minification is turned off in your other optimization plugin.
If that’s not the case, we’ll need a little more information to troubleshoot. Do you see errors in your console about the assets that aren’t loading? Here’s a video explaining how you can use the browser console to check for errors:
Hello Jesse,
We are not using any plugin for minifying.
Also, there is no error in the console.
I found one thing when we enable Page Cache Image data-src=”encoded Image URL” attribute added in the image tag. When we hover on data-src it shows a blank image, not the actual image. that’s why the images not load.
Regards,
Yogesh Bhade
Hello Yogesh-
From what you’ve described, it sounds like there may be a conflict with Lazy Loading images.
One way you can test this is to navigate to the Performance > General Settings > User Experience section, and disable the check mark for Lazy load images.
We’ve tested this feature with the new feature of WordPress Core to lazy-load images, but if you’re running another plugin that lazy-loads images there may be an issue causing the data-src attribute to be different from the src attribute.
Can you provide an example of the data-src URL vs. the Image src URL, and double-check if any other plugins are providing image lazy-loading?
Hello,
I have tried as you suggested but the issue is still there.
We are using only W3 Total Cache plugin for cache and only it is providing Lazy Load option.
I am providing before Page Cache option Enable and After HTML code changes for the Image tag, please have a look.
BEFORE
<img src="https://WEBSITE_URL.co/wp-content/uploads/2020/03/earth1.png" alt="" width="512" height="512" />
AFTER
<img src="https://WEBSITE_URL.co/wp-content/uploads/2020/03/earth1.png" alt="" width="512" height="512" />
Please help us to resolve this issue ASAP.
Regards,
Yogesh BhadeHi Yogesh-
Thanks for the additional information. Since you left W3 enabled this time, I was also able to see the issue when I checked out your website.
One thing that I noticed is that the images that are affected by this issue are also using animations from the Fusion Builder as well as lazy loading.
Another thing that I noticed is that there are warnings in the console about the animations:
[Violation] 'requestAnimationFrame' handler took 90ms
So two possibilities occur to me- the first is to disable minification and see if the animation Javascript works. It’s possible that the Javascript that creates your image animations is not compatible with minification.
The second possibility is to add the class skip-lazy to your images to see if the WordPress Core lazy-loading is conflicting with your animations.
- The topic ‘Images not loading after Page Cache enabled.’ is closed to new replies.
