Fix Poor Core Web Vitals Scores on Your WordPress Site

· 6 min read · 5 views · Getwebup

If Google Search Console just started flagging your WordPress site under "Core Web Vitals: Poor URLs," you're probably staring at three unfamiliar acronyms — LCP, INP, CLS — and wondering which plugin broke what. The good news: each metric fails for a specific, findable reason, and none of them require a redesign to fix.

What Core Web Vitals Actually Measure

Core Web Vitals are three metrics Google uses to score real-world page experience, and they feed into search ranking as a (small but real) factor. Unlike a generic "page speed" score, each one measures a distinct moment in the page's life:

  • LCP (Largest Contentful Paint) — how long until the biggest visible element (usually a hero image or heading) finishes rendering.
  • INP (Interaction to Next Paint) — how long the page takes to visibly respond after a click, tap, or keypress. This replaced FID (First Input Delay) as the official metric in March 2024.
  • CLS (Cumulative Layout Shift) — how much visible content jumps around as the page loads (images popping in without reserved space, fonts swapping, ads injecting late).
MetricGoodNeeds ImprovementPoor
LCP≤ 2.5s2.5s – 4s> 4s
INP≤ 200ms200ms – 500ms> 500ms
CLS≤ 0.10.1 – 0.25> 0.25

Symptom: Where This Shows Up First

Most customers don't notice slow pages by feel — they notice a drop in Search Console under Experience > Core Web Vitals, or a red "Poor" label in PageSpeed Insights. Two things trip people up right away:

  • Search Console shows field data — real visitor measurements from the Chrome User Experience Report (CrUX), collected over the last 28 days. It lags behind whatever you just fixed.
  • PageSpeed Insights and Lighthouse show lab data — a single simulated test run. It updates instantly, which is why you should trust it while you're actively fixing things, then wait for Search Console's field data to catch up (usually 1–4 weeks) to confirm the fix stuck for real users.

Step 1 — Find out which metric is actually failing

  1. Run your homepage and your worst-performing template (product page, blog post, etc.) through PageSpeed Insights.
  2. In Search Console, open the Core Web Vitals report and click into the failing URL group — it tells you which metric caused the "Poor" label, not just that the page is slow.
  3. Check both mobile and desktop separately. Mobile almost always fails first, since it has less CPU and a slower simulated connection.

Fixing LCP: The Page Feels Slow to "Arrive"

Cause: nine times out of ten, LCP is either a hero image that's too large in file size, or slow Time to First Byte (TTFB) from the server itself.

  • Check TTFB first. If it's over 600ms, the LCP problem isn't the image — it's PHP, the database, or a shared hosting plan under load. Enable a server-side page cache (LiteSpeed Cache on Getwebup's LiteSpeed plans, or WP Rocket) before touching anything else.
  • Compress and correctly size the hero image. A 3000px-wide PNG displayed at 800px wide is pure waste — resize it to the actual rendered dimensions and serve WebP.
  • Preload the LCP image instead of lazy-loading it. Lazy-loading the very image that defines LCP delays it further:
<link rel="preload" as="image" href="/wp-content/uploads/2026/hero.webp" fetchpriority="high">

Add this via your theme's header.php inside wp_head, or through a snippet plugin if you don't want to touch theme files directly.

  • Remove render-blocking CSS/JS above the fold — defer non-critical stylesheets and scripts so the browser can paint the hero content sooner.

Fixing INP: The Page Feels Laggy to Interact With

Cause: long JavaScript tasks blocking the main thread when a visitor clicks a menu, opens an accordion, or submits a form. Page builders (Elementor, Divi) and heavy third-party embeds (chat widgets, ad scripts, video players) are the usual culprits.

  • Audit your active plugins for ones that queue JavaScript on every page, not just where it's used. A booking-calendar plugin loading its full script on your blog posts is a common offender.
  • Defer third-party scripts (chat widgets, analytics, ad tags) so they load after the page is interactive, not during initial render:
<script src="https://example.com/widget.js" defer></script>
  • If you're on a page builder, check for a "lazy load JS" or "delay JavaScript execution" setting — most modern caching plugins (WP Rocket, LiteSpeed Cache) have one built in and it's the single highest-leverage INP fix for WordPress sites.
  • On the server side, make sure PHP-FPM has enough workers and OPcache is enabled — a server that's queuing PHP requests will make every click feel sluggish regardless of front-end code.

Fixing CLS: Content Jumps Around While Loading

Cause: browser doesn't know an element's size until its content (image, ad, embedded video, web font) finishes loading, so it reflows the page around it.

  • Add explicit width and height attributes to every <img> tag — most modern WordPress themes do this automatically, but images pasted directly into the block editor from external sources often lose these attributes.
  • Reserve space for ads, embeds, and social widgets with a fixed-height wrapper div instead of letting them inject and push content down.
  • Use font-display: swap or, better, preload your web fonts so text doesn't visibly re-flow when a custom font finishes downloading:
<link rel="preload" href="/wp-content/themes/yourtheme/fonts/main.woff2" as="font" type="font/woff2" crossorigin>
  • Avoid inserting content above existing content via JavaScript after the initial page load (cookie banners are a frequent, avoidable offender — animate them in from a fixed overlay instead of pushing the page down).

Prevention: Keep the Score From Regressing

Core Web Vitals scores drift — a plugin update, a new hero banner, or a marketing team adding a chat widget can quietly tank a passing score within weeks.

  • Re-run PageSpeed Insights after any plugin or theme update, not just once a quarter.
  • Test new plugins on a staging copy first and check the Lighthouse score before pushing to production.
  • Bookmark the Search Console Core Web Vitals report and check it monthly — it's the only view that reflects real visitors, not a synthetic test.
  • If your host offers a real-user monitoring option, turn it on — synthetic tests catch obvious regressions, but real traffic patterns catch the ones that only show up on slow mobile connections.

Quick Reference

MetricMost Common Cause on WordPressFastest Fix
LCPSlow TTFB or oversized hero imageServer cache + resize/preload hero image
INPHeavy JS from page builders/third-party embedsDefer scripts; enable "delay JS" in caching plugin
CLSMissing image dimensions, late-loading ads/fontsSet width/height; reserve space; preload fonts

Questions people actually ask