1. Home
  2. Blog
  3. Performance

Convert WordPress Images to WebP Automatically Without a Separate Image CDN

Performance

October 5, 2026

Your homepage hero is a 2.4 MB JPEG that looked fine in Photoshop. On a mid-range Android phone it still paints late. PageSpeed mentions “serve images in next-gen formats.” You open a tab for a separate image CDN, another for a WebP converter plugin, and another for lazy load. Three tools, three dashboards, and the LCP image is still competing with every below-the-fold gallery thumbnail.

That stack is how WordPress performance gets expensive and fragile. You do not need another vendor just to stop shipping 2014-era image bytes.

Lightify is the DaftPlug performance plugin. This post is about Auto WebP on the fly (converted in the background on Pro), plus the media helpers that sit next to it: image lazy loading, video lazy loading, and preload the hero / LCP image. YouTube placeholders can sit nearby as adjacent media work. Not emoji or Heartbeat cleanup, not unused CSS, not cache preload, not speculative loading, not database cleanup, not delay JS, not self-hosting third-party scripts. For the wider vitals picture, keep How to fix LCP, CLS, and INP on WordPress in 2026 open.

What Lightify actually ships here

Stay inside the real feature set:

  • Auto WebP on the fly, converted in the background (Lightify Pro comparison callout)
  • Image lazy loading so below-the-fold photos wait their turn
  • Video lazy loading so heavy media does not block first paint
  • Preload the hero image so LCP lands sooner
  • Brief adjacent mention OK: YouTube placeholders (light embed until click)

This post is not about stripping emoji/dashicons, removing unused CSS, warming the page cache, Speculation Rules, DB sweeps, delaying JavaScript, or self-hosting analytics scripts. Those are other Lightify surfaces. Here the job is media weight: smaller image bytes, smarter load order, less competition for the hero.

Why auto WebP beats “upload smaller JPEGs and hope”

Editors will not remember to export WebP every time. Agencies will not QA every product gallery after a catalog import. A format policy that depends on human discipline fails the week after you ship it.

On-the-fly conversion in the background means WordPress can keep accepting the JPEGs and PNGs people already upload. Lightify Pro converts toward WebP without making media library workflow a second job. You are not manually batch-converting a year of uploads in a desktop app.

Lazy loading stops the browser from downloading every image on a long page before the visitor scrolls. That frees bandwidth for the hero and the first screen of copy. Image and video lazy load are separate toggles for a reason: a muted background video can wreck mobile data even when photos are already deferred.

Preloading the LCP image is the other half. Lazy everything is a trap. The hero should not wait. Lightify’s media pitch is explicit: lazy load what is below the fold, prioritise the LCP image, and (when you use embeds) swap heavy YouTube players for light placeholders until someone clicks.

No separate image CDN required for the format step. Use Cloudflare or Bunny for edge delivery if you want. Do not confuse edge caching with needing five plugins just to serve WebP. Once conversion and lazy/preload live in Lightify, the format step stops being a second vendor.

WebP will not fix a 4 second origin. It will stop a cached page from failing vitals because the hero was an uncompressed JPEG.

How to set this up in wp-admin

Assume Lightify is installed. If you still run a second full caching plugin, deactivate it before you lean on Lightify’s stack so you are not debugging two optimizers at once.

1. Open Lightify media / image optimization

In wp-admin, open Lightify and find the media controls: Auto WebP, image lazy loading, video lazy loading, hero/LCP preload, and any YouTube placeholder toggle. You want clear switches, not a PHP snippet pasted into the theme.

2. Turn on Auto WebP (Pro background conversion)

Enable Auto WebP on the fly. On Pro, conversion runs in the background so the first views are not paying a huge CPU tax while every historical upload converts in the request path. After you enable it:

  1. Hard-refresh a content-heavy page.
  2. In DevTools → Network, filter by Img and confirm responses are WebP where expected (or that the optimized URL pattern Lightify uses is present).
  3. Spot-check a PNG with transparency and a product photo with text overlays. Rare edge images deserve a visual check.

If a page builder injects images in a non-standard way, test that template specifically. Builders love custom <img> markup.

3. Enable image lazy loading (and video if you use it)

Turn on image lazy loading so below-the-fold photos defer. If the site uses HTML5 video or heavy media blocks, enable video lazy loading too. Then verify the hero is not lazy. The LCP element should load with priority, not with loading="lazy" fighting you.

Watch sliders: if slide one is lazy, fix that first. Leave the rest deferred.

4. Preload the hero / LCP image

Enable preload the hero image so the browser discovers the LCP candidate early. After enabling:

  1. Run a field-like check on mobile (real phone or a throttled profile).
  2. Confirm the preloaded URL matches the image that actually paints as LCP (same crop, same size variant).
  3. Avoid preloading three competing heroes. One candidate. The real one.

If you also use a page cache, purge the key templates after changing media settings so HTML reflects the new preload hints.

5. Optionally lighten YouTube embeds

If posts embed YouTube heavily, turn on YouTube placeholders so the page ships a preview until click instead of the full player on every scroll position. This is adjacent to image work, not a substitute for WebP. Do it when embeds show up in the network waterfall next to your photos.

6. Re-check Core Web Vitals on real templates

Pick homepage, a long article, and a product gallery if you have one. Compare mobile LCP and transferred image kilobytes, not only the lab score. If LCP barely moves, fix TTFB or hero discovery before you blame WebP.

What good looks like

  • Uploaded JPEGs/PNGs still work for editors; WebP is served to supporting browsers without a manual export ritual.
  • Network panel shows smaller image payloads on content pages.
  • Below-the-fold images and videos wait; the hero is prioritised and preloaded.
  • YouTube-heavy posts stop downloading multiple players on first paint (if placeholders are on).
  • No second image-CDN account required just to get next-gen formats.
  • LCP on mobile improves on image-heavy templates, or at least stops failing because of a multi-megabyte hero.

If editors say the gallery looks soft, check quality and srcset behaviour before disabling WebP. Softness is usually a variant choice, not proof WebP is broken.

Pitfalls (the ones that bite)

Lazy-loading the LCP image. Instant own-goal. Hero stays eager; everything else can wait.

Preloading the wrong URL. A preload that points at a desktop crop while mobile paints a different file wastes the hint.

Stacking three image optimizers. WebP plugins plus a CDN image rewriter plus Lightify will fight. Pick one format owner.

Judging only desktop lab scores. Image pain is a mobile story. Test a phone.

Forgetting page builder templates. Custom image widgets often bypass “normal” content filters. Spot-check them.

Expecting WebP to fix CLS. Layout shift is dimensions and fonts. Set width/height; do not confuse format with stability.

Never rechecking after a redesign. New hero art needs the same preload discipline.

Practical checklist before you call it done

  1. Enable Auto WebP on Pro and confirm background conversion is active.
  2. Verify WebP (or Lightify’s optimized image URLs) in the Network panel on a real page.
  3. Turn on image lazy loading; add video lazy loading if you ship video.
  4. Confirm the hero is not lazy; enable preload for the real LCP image.
  5. Purge cache on homepage, article, and product templates.
  6. Optional: enable YouTube placeholders on embed-heavy content.
  7. Re-measure mobile LCP and total image transfer size.
  8. Spot-check PNG transparency and text-in-image product shots.
  9. Remove competing image-format plugins you no longer need, then have an editor upload one new photo and confirm it still looks sharp.

Takeaway

WordPress does not lose Core Web Vitals because editors love JPEG. It loses because the stack keeps shipping heavy originals, lazy-loads the wrong image, and splits media work across a CDN, a converter, and a lazy-load plugin that do not talk to each other.

Lightify puts Auto WebP on the fly (Pro, converted in the background) next to image and video lazy loading and hero LCP preload in the same performance dashboard. Convert formats where uploads already happen. Defer what is below the fold. Prioritise the one image Google grades you on.

One Pro membership unlocks Lightify plus Progressify, Generatify, Rankify, and Snapshotify. New Pro plugins join existing memberships. Plans differ by site count only (Pro $37.99 for 1 site, Pro Plus $74.99 for 5, Pro Max $138.99 for 100), with a 14-day money-back guarantee. See pricing when you are done paying for a separate image CDN just to serve WebP.

Turn WebP on. Protect the hero. Lazy-load the rest. When mobile LCP stops blaming a 2 MB JPEG, you closed the media half of the vitals problem without another vendor login.