How to Enable Next-Gen Images with Elementor

Using Next-Gen images with Elementor is possible, but there are a few steps to ensure compatibility, especially if you’re using the <picture> tag method.

Elementor’s Gallery Module

If you frequently use Elementor’s gallery module, the best method to deliver Next-Gen formats is through the rewrite rules option(unless you use Cloudflare/CDN). This ensures that your Next-Gen images display correctly without interfering with Elementor.

Elementor Thumbnails

Elementor creates thumbnails for certain sections of your content, and these thumbnails are stored in a specific folder within your WordPress directory (/wp-content/uploads/elementor/thumbs/). By default, Imagify does not optimize this folder, so Next-Gen formats may not be available for these images.

To fix this:

  1. Go to Imagify Settings and add the Elementor thumbs folder as a custom folder for optimization. This ensures that future images in this folder will be optimized and converted to Next-Gen formats.
  2. If you have existing thumbnails in this folder, navigate to Media > Other Media and optimize them manually. This will apply optimization and create the Next-Gen versions for these images.

By following these steps, you can fully integrate Next-Gen images with Elementor and ensure optimal performance for your site.

Was this guide helpful? :) Great! Glat we could help! Thank's for your feedback
Great! Glat we could help!

Your feedback has been sent to our team We value every bit of feedback we receive as it helps us to improve our products and services. Thank you for your time.