# Preload Header for Your Theme Stylesheet

> Sends an HTTP Link preload header for your theme's main stylesheet, so browsers, and CDNs that support Early Hints, start downloading the CSS before the HTML has even arrived.

- Type: PHP
- Runs: Frontend only
- Category: [Performance](https://wpide.com/library/category/performance/)
- Tags: preload, headers, css
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/perf-early-hints-link-header/

## Code

```php
// Extra files to preload: URL => 'style', 'script' or 'font'.
$wpide_link_preloads = array();

add_action( 'send_headers', function () use ( $wpide_link_preloads ) {
    if ( headers_sent() || is_admin() ) {
        return;
    }

    $theme  = wp_get_theme();
    $files  = array( add_query_arg( 'ver', $theme->get( 'Version' ), get_stylesheet_uri() ) => 'style' ) + $wpide_link_preloads;
    $values = array();

    foreach ( $files as $url => $as ) {
        $value = sprintf( '<%s>; rel=preload; as=%s', esc_url_raw( $url ), $as );
        if ( 'font' === $as ) {
            $value .= '; crossorigin';
        }
        $values[] = $value;
    }

    header( 'Link: ' . implode( ', ', $values ), false );
} );
```

## Notes

Add more files (for example a key web font) to $wpide_link_preloads; keep the list short, since preloading too much slows everything else down.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Preload Header for Your Theme Stylesheet" 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/