Remove Jetpack CSS from WordPress

Quick little tip to speed up WordPress: remove Jetpack CSS script from loading. Just add two lines of code to the WordPress functions.php file and you are done.

Quick little tip to speed up WordPress: remove Jetpack CSS script from loading. Never heard of Jetpack? Jetpack is a plugin made by the WordPress folks and is an amazing plugin that is jam packed with features. Even the free version of the plugin! But If you are like me, you might find that you use lots of the features of core JetPack plugin but none of the MASSIVE amount of CSS that the plugin loads. So why not stop the JetPack CSS file from loading?

With JetPack, you can select the specific features that you want to use on your website. Use the analytics to show your site’s stats. Get free downtime monitoring or quick and easy email subscribers on your site. But, the JetPack plugin will load all the CSS each features and toss it onto your site. Even if you are not using those features. Total bummer, am I right?

So I usually like to remove the Jetpack CSS from my to speed it up to get a better user experience. That JetPack CSS file can get pretty large, and lower your website’s loading time.

remove Jetpack CSS to speed up WordPress

In the screenshot above, you can see the JetPack.css file is bout 13KB and can take around 250ms (1/4 a second to load). With such a quick win to help speed up WordPress, why not do it if you don’t need it to load?

How to remove Jetpack CSS using functions.php

You can remove Jetpack CSS from loading on your WordPress website by adding some very simple lines of code to your theme.

Either open the built-in theme editor in the WordPress admin panel or open your favorite code editor. Navigate the the WordPress themes directory (/wp-content/themes) and open the directory for your active theme.

Locate your theme’s functions.php file and load that sucker into your editor. At the top of the php file (below the opening php tags of course), simply add these simple lines of code:

add_filter( 'jetpack_sharing_counts', '__return_false', 99 );
add_filter( 'jetpack_implode_frontend_css', '__return_false', 99 );

Save your functions.php file and test your website again on PageSpeed Insights.

Please note: if you are using a caching plugin on your website, you will likely need to clear your cache before the page speed will get better. And if you are using a plugin that minimizes your CSS or JavaScript like Hummingbird, then you will need to clear the cache of minified CSS as well.

Default image
Indie developer with about 10 hours a week to work on dev projects. Currently working on (a personal finance app) and (an open source url shortener).
Articles: 9

Join the Mailing List!

Get quality code and dev tips delivered directly to your mail box.
(usually about once a month)

Leave a Reply