How to Remove Query Strings from Static Resources [WordPress]

This tutorial well help you to Remove Query Strings from Static Resources like JavaScript (.js) and CSS (.css) files on WordPress platform. Why we need to remove that?, if you really care about the speed of your site you have to do this as GTMetrix.com and Google Page Speed may suggest you to remove query string.
Check your blog using GTMetrix now. Just put URL your website in the Text box and gtmetrix will analyze your website. When it has completed, you will see your Page Grade and some suggestions to improve your website speed by doing some tweaks.

One of the recommendations is Remove Query Strings from Static Resources.

According to GTMetrix
Most proxies, most notably Squid up through version 3.0, do not cache resources with a “?” in their URL even if a Cache-control: public header is present in the response. To enable proxy caching for these resources, remove query strings from references to static resources, and instead encode the parameters into the file names themselves.

Right click in your website and choose View Page Source. Press Ctrl+F and type .css or .js. You should see something like this

http://Yoursitename.com/wp-content/plugins/js/some.js?ver=3.4.2
http://Yoursitename.com/wp-content/plugins/css/some.css?ver=1.2.2

1 2	http://Yoursitename.com/wp-content/plugins/js/some.js?ver=3.4.2 http://Yoursitename.com/wp-content/plugins/css/some.css?ver=1.2.2

This is the simple and proven solution to Remove Query Strings from Static Resources

You will need to locate your functions.php file. Usually just go to Appearance –> Editor — > functions.php in your WordPress admin page.

Warning
Be careful when editing functions.php. I suggest to back it up first in case you make a mistake.

Add this following code in bottom of your functions.php just before the ?>

function _remove_script_version( $src ){
 $parts = explode( '?', $src );
 return $parts[0];
}
add_filter( 'script_loader_src', '_remove_script_version', 15, 1 );
add_filter( 'style_loader_src', '_remove_script_version', 15, 1 );

function _remove_script_version( $src ){

$parts = explode( '?', $src );

return $parts[0];

}

add_filter( 'script_loader_src', '_remove_script_version', 15, 1 );

add_filter( 'style_loader_src', '_remove_script_version', 15, 1 );

Go back and do View Page Source again. This time no more query string on your CSS and Javascript URL’s.

http://Yoursitename.com/wp-content/plugins/js/some.js
http://Yoursitename.com/wp-content/plugins/css/some.css

1 2	http://Yoursitename.com/wp-content/plugins/js/some.js http://Yoursitename.com/wp-content/plugins/css/some.css

Check again your website in GTMetrix and you will see the difference.
So in less than 10 minutes we have just improved the speed of a website.
I hope this tutorial is useful and don’t forget to share it 🙂

Facebook Comments