# Preload the Featured Image on Single Posts

> Tells the browser to fetch the featured image of the current post or page right away, which improves Largest Contentful Paint when it is shown at the top.

- Type: PHP
- Runs: Frontend only
- Category: [Performance](https://wpide.com/library/category/performance/)
- Tags: performance, images, core-web-vitals
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/preload-featured-image/

## Code

```php
// The image size your theme shows at the top of single posts.
$wpide_preload_image_size = 'large';

add_filter( 'wp_preload_resources', function ( $resources ) use ( $wpide_preload_image_size ) {
    if ( ! is_singular() || ! has_post_thumbnail() ) {
        return $resources;
    }

    $image_id = get_post_thumbnail_id();
    $image    = wp_get_attachment_image_src( $image_id, $wpide_preload_image_size );

    if ( ! $image ) {
        return $resources;
    }

    $resource = array(
        'href'          => $image[0],
        'as'            => 'image',
        'fetchpriority' => 'high',
    );

    $srcset = wp_get_attachment_image_srcset( $image_id, $wpide_preload_image_size );
    if ( $srcset ) {
        $resource['imagesrcset'] = $srcset;
        $resource['imagesizes']  = (string) wp_get_attachment_image_sizes( $image_id, $wpide_preload_image_size );
    }

    $resources[] = $resource;

    return $resources;
} );
```

## Notes

Skip this if your theme shows the featured image lower on the page; preloading an image that is not above the fold wastes bandwidth.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Preload the Featured Image on Single Posts" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/