Wordpress LScache Plugin: Header image not optimized or served in next-gen format
Last Updated on: Wed, 15 Apr 2026 00:00:02 Hi all! Getting really good results with LiteSpeed Cache and the image optimisation feature overall, but for some reason the header image on homepage (http://157.230.43.150/wp-content/uploads/2019/10/IMG_2876-1.jpg?id=3550) is not being served in next-gen format or being optimised. Changing to another header resulted in same issue. The header image section itself is created with standard WP Bakery element as a cover image. Not sure how to fix this or if this is a bug instead? This topic was modified 3 years, 1 month ago by payloads. The page I need help with: https://hexabangkok.com Hi @payloads, currently we do not support CSS background image replacement at this moment, you need to move the background-image: url(http://157.230.43.150/wp-content/uploads/2019/10/IMG_2876-1.jpg?id=3550) out as an inline attribute style of the . Ah ok will try that @stanleylitespeed thanks for the above suggestion. Ok, so I created an extra class name page-header for the header section and added following to custom CSS: page-header background:url(https://157.230.43.150/wp-content/uploads/2019/10/IMG_2876-1.jpg?id=3550) background-size:contain background-repeat:no-repeat and after that currently revised also to page-header background:url(https://hexabangkok.com/wp-content/uploads/2019/10/IMG_2876-1.jpg?id=3550.webp) background-size:contain background-repeat:no-repeat does not seem to make a difference though?: https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fhexabangkok.com%2F Hi @payloads, I think the Pagespeed warning is because the image hasnt been compressed, have you run image optimization for this image or compress it manually? Also, a 5472???3648 image is too large for a website, please try to resize it. @stanleylitespeed thanks well noted. I tried with another image and resized the image down to a more reasonable 1440x1120px size at 346kb size (instead of 10mb previously) before running LiteSpeed Cache image optimization. I see from the media list that the image is successfully optimized as WebP through LS Cache (61% optimization). I adjusted the CSS to match with the new file location, but this not seem to fix the issue as the image still produces Serve images in next-gen formats & effiently encode image errors in pagespeed. Double-checking with Google Chrome shows that the .jpg file indeed is still served instead of .webp? The adjusted code as such: page-header background-image: url(https://hexabangkok.com/wp-content/uploads/2019/10/MG_5646s1440v2.jpg?id=4089.webp) background-size:contain background-repeat:no-repeat @stanleylitespeed kindly checking if you had any thoughts on how to fix this? Ive checked your home page is using https://hexabangkok.com/wp-content/uploads/2019/10/cover.jpg?id=4488.webp instead of https://hexabangkok.com/wp-content/uploads/2019/10/MG_5646s1440v2.jpg?id=4089.webp its a non-commpressed version which is 6.5MB, could you check is that image get repaced? Ah ok! I changed the code now with the correct filepath, that did not seem to change anything though? page-header background-image: url(https://hexabangkok.com/wp-content/uploads/2019/10/cover.jpg?id=4488.webp) background-size:contain background-repeat:no-repeat The large image is still existing on some CSS: https://imgur.com/a/4VkE1ea Hi, Im going to mark this topic Resolved, due to lack of activity. If you still need help, please let us know. Well be happy to reopen the topic if necessary. Thanks!
LiteCache Rush: Speed comes from using less, not from doing it faster
Reference