Menu Close

Update preloading CSS on WordPress site


Learn how to add an HTML <rel=preload> tag to the header in WordPress.

A function that I have used to enable preloading CSS effectively is:

 * @snippet       Update preloading CSS on WordPress site
function add_rel_preload($html, $handle, $href, $media) {
if (is_admin())
    return $html;

$html = <<<EOT
<link rel='preload' as='style' onload="this.onload=null;this.rel='stylesheet'" 
id='$handle' href='$href' type='text/css' media='all' />

return $html;

add_filter( 'style_loader_tag', 'add_rel_preload', 10, 4 ); 

Similarly you could try this for JS and Webfonts, but this has only been tested with CSS.

How useful was this post?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?


Posted in PHP, WordPress

Leave a Reply

Your email address will not be published. Required fields are marked *

You can also read...