LCP · medium impact

Ensure text remains visible during webfont load

Custom fonts hide text while they are downloading (FOIT - Flash of Invisible Text).

Why it matters

This delays the user's ability to read your content and worsens FCP/LCP.

How to fix it in WordPress

  1. Use a performance plugin or theme setting to add 'font-display: swap' to your Google Fonts or local fonts.

Plugin-specific steps

Already using one of these plugins? Follow the exact steps for your setup.

Perfmatters

  1. 1Go to Settings → Perfmatters → Fonts.
  2. 2Enable 'Display Swap'.
  3. 3Save changes.

WP Rocket

  1. 1Go to Settings → WP Rocket → File Optimization.
  2. 2Enable 'Optimize Google Fonts'.
  3. 3WP Rocket automatically applies 'font-display: swap'.

Elementor

  1. 1Go to Elementor → Settings → Advanced.
  2. 2Set 'Google Fonts Load' to 'Swap'.
  3. 3Regenerate CSS in Elementor → Tools.

How to verify the fix

  • Run PageSpeed Insights and verify the 'Ensure text remains visible' audit is passed.

Related LCP fixes

Your main image is lazy-loaded (LCP penalty) →Your main image isn't prioritized →LCP image is too heavy →

Find out which of these your site has.

Free scan with real Google data. Exact fixes for your plugins.