You might have come across this page after testing your website on Pingdom or GTmatrix. And if I am not wrong, it seems like you are looking for a solution to Remove Query Strings from Static Resources like CSS & JavaScript (or URLs) in WordPress with/without the plugin.
You have landed on right page pal! In this tutorial, we will discuss,
(1) What are the Query Strings in website code structure?
(2) Why you should Remove Query Strings from Static Resources?
(3) How you can Remove Query Strings from URLs to increase your PageSpeed?
(4) Learn how to Remove Query Strings in WordPress with/out plugin?
So, without any delay, let’s begin…
PageSpeed is an extremely essential aspect of a website or blog. It helps you to deliver a satisfactory and effective user experience to your visitors.
Also, Site speed helps you to get higher rankings in Google Search, and as a result, you will notice an increase in overall traffic on your website.
As Google had announced that site speed affects your search engine ranking. And nowadays, since the mobile first concept came, search engines like Google considering PageSpeed as one of the most important parameters for search ranking.
What are the Query Strings?
First of all, let’s discuss What are the Query Strings?
Query Strings are the URLs which contain “?” or “&”.
for example, technumero.com/script.js?ver=1.6
It is similar to the CSS and JS files of your website, which usually have the file version at the end of their URLs.
Therefore, these query string resources would be the resource URLs with a “?” or “&”.
And as most of the proxy servers do not cache CSS and JavaScript resources with query strings, even if you have optimized the public Cache-Control headers.
Most of the popular CDNs (Content Delivery Networks) also do not cache resources with query strings i.e KeyCDN, Cloudflare and others.
Now, you must be thinking then why query strings are being used by default.
Actually, the query strings are used to versioning a file, which differentiates the resource files from one to another. It is extremely useful for developers to avoid caching problems.
And if you are in the development phase of your website, then I would suggest you to only remove query strings from URL, once you are done with the site development/theme customization.
Further, before we remove the query strings from urls, let’s take stock of the baseline result. That will help you to understand, how query strings are impacting on your website.
- You should first check your webpage source code for Query Strings.
- Then, test your website on speed test tools like GTmatrix or Pingdom.
- And identify URLs with Query Strings – “?” or “&”. These URLs should look like the below-given screenshot.
Now, as you have identified the resources with query strings, you will notice that these are the CSS, JavaScript, and Image files of your site.
- Best Free CDN to Speed Up your WordPress site
- Which Free DNS Hosting Provider can help you get Superfast PageSpeed
How Removing Query Strings from CSS and JS will increase PageSpeed
Leveraging Browser Cache of Static Resources like CSS and JavaScript plays an important role in page loading time. Query strings prevent caching of static resources on browsers and proxy servers.
By Removing Query Strings from Static Resources like CSS & JavaScript you can enable caching of static resources. Resulting in that, you can achieve a significant improvement in PageSpeed of your site.
Should you Remove Query Strings from URLs?
As I have explained above that query strings prevent caching of static resources like CSS and JavaScript on proxy servers and CDNs, which results in slow loading speed of a website.
So, if you want to enable caching on proxy servers, you must have to remove query strings (which contains “?” or “&” in their URLs) from static resources of your website.
And once you remove these strings, you will definitely notice a significant increase in page speed.
I tested my own website on GTmatrix and Pingdom, Results you can see in figures.
How to Remove Query Strings from Static Resources?
To remove query strings from your site resources, you only need to add the following filter hook in the functions.php file to modify static resource URLs.
Filter hooks (add_filter) are used to modify various types of internal data in WordPress.
Steps to Remove Query Strings from Static Resources are following…
- Navigate to Appearance → Theme Editor on WordPress dashboard.
- Open the functions.php file of your WordPress theme.
- Copy and Paste the given-below code at the end of functions.php file.
- That’s it. You are done.
Add the following code in your functions.php file to remove query strings from URLs
//* TN - Remove Query String from Static Resources
function remove_css_js_ver( $src ) {
if( strpos( $src, '?ver=' ) )
$src = remove_query_arg( 'ver', $src );
return $src;
}
add_filter( 'style_loader_src', 'remove_css_js_ver', 10, 2 );
add_filter( 'script_loader_src', 'remove_css_js_ver', 10, 2 );
But, before you modify the functions.php file of your WordPress theme, I would highly recommend you to take a backup. Also, you must use a child theme for such a modification in the core theme file.
Otherwise, there are various plugins available in the WordPress Repository for free use. You can use one of the following plugins if you do not wish to use code to remove query string from URL.
Do you know that Deferring JavaScript properly can help you get top scores on Google PageSpeed Insights? Also one of the major recommendations of PageSpeed is Remove Render Blocking of JavaScript which can be implemented easily using these guides.
Remove Query Strings From Static Resources – WordPress Plugin
Below, I am going to share a couple of different plugins to remove query strings from URLs. However, I always recommend that you should only use plugins when it is unavoidable to use.
If you are using a paid theme and updating your theme frequently for latest updates by theme publisher, in that case, it would be better to use a plugin instead of adding PHP code. Because your PHP code might get deleted automatically after theme update if you are not using the child theme.
#1. Remove Query Strings From Static Resources – WP Plugin
Query Strings can be removed by using the Remove Query Strings From Static Resources plugin [1]. I would recommend this method to beginners, who don’t want to mess up with coding stuff.
Install and activate this plugin. There is no setting panel, so just activation of the plugin will do the trick. Test your PageSpeed time TWICE and you will find significant improvement.
#2. W3 Total Cache – WP Plugin
Remove query strings from URLs in WordPress with W3 Total Cach plugin [2]. Many WordPress users already using caching plugins like W3 Total Cache and WP Super Cache.
I would suggest you to use this guide on W3 Total Cache plugin settings optimization to improve PageSpeed. This plugin is one of the most popular caching plugins in the WordPress ecosystem, which dramatically increase your website loading speed.
And if you are not using this plugin, I would suggest you give it a try, you won’t regret using it.
W3 Total Cache plugin offers an option to remove query strings from static resources.
You only need to UNCHECK (if already checked) an option and it will remove query strings from 90% of the URLs.
Steps to Remove Query Strings from URL with WordPress plugin
- Install and Activate the W3 Total Cache Plugin.
- Go to Browser Cache tool tab and find “Prevent caching of objects after settings change” option.
- UNCHECK it from ‘General Settings’ and don’t forget to click on ‘Save Settings’ button.
- Now ‘Empty all Cache’ and you are done.
Check your page loading speed TWICE and your page loading speed will definitely increase.
#3. Speed Booster Pack
Another popular WordPress plugin on this list is Speed Booster Pack [3]. This plugin is quite popular and offers much functionality to optimize the PageSpeed.
To remove query strings from URL in WordPress using the Speed Booster Pack plugin. Go to the plugin settings, Turn On the Remove Query String option on the General Tab.
#4. WP Remove Query Strings From Static Resources
There is another lightweight WordPress plugin called WP Remove Query Strings From Static Resources [4]. Download this plugin from the WordPress plugin repository for free.
Install the plugin and Activate it. There is no configuration or setting page. Activate it and you are good to go.
Purge all the cache and check your website on Pingdom. All the query strings will be removed automatically from static resources.
Conclusion
Removing query strings from static resources like CSS & JavaScript is important if you want to enable Caching of static resources on proxy servers and CDNs to increase your PageSpeed.
I have implemented the code to remove query strings from URLs on this site (technumero.com) and have noticed a dramatic improvement in PageSpeed Grades on GTmatrix and Pingdom.
You can see the improved results in the figures given below.
Now, just scroll up and see the baseline test data, my score for query string has been increased from 5 to 78, which quite good. Similarly, page load time after the implementation of this code also has been improved.
You may find these result outdated, but believe me, it is working fine till date. You can check the results by yourself if you want to.
Hope you‘ll find this post helpful. Share your PageSpeed Results and your experiences on the above topic in the comment section below.
Are you using any other plugin or PHP code to remove query strings in WordPress?
Which solution you like most and which one works best for you or you might have any other recommendation for readers. Do share your thoughts with us in the comment section below.
In addition to that, you might be interested to read the following–
- How to Lazy Load Images in WordPress to Speed Up Your Website
- Cache Gravatar Images in WordPress for WP Optimization
- Enable Gzip Compression in WordPress
- Minify JavaScript and CSS in WordPress to Increase PageSpeed
Hey Saurabh,
Thank You for this really easy to understand tutorial. Though the time decrease was just a few milliseconds but it was still beneficial. Thank You again 🙂
Regards,
Ashwani Kumar Singh
Thank your for the tutorial, where the actually put the code of 3rd one.
Hey Usman,
Glad that you found it informative. You should use the code at the bottom of function.php. As I advised in the post choose this method only if you know well what you are doing. And before making any edit/change, don’t forget to backup your files and content.
Technumero, thanks a lot. I think I will go with w3 total cache.
Hey Chieyine,
Glad that I could help. Thanks for nice response.
Thanks for the post,
What i learnt from this post is there is no way to “Remove query strings from static resources” completely. I am stuck at 84 for my website.
Thanks
Avinash
Hey Avinash,
Glad that I could help. That’s really a nice score. Although 75+ is a decent and acceptable score. Thanks for the awesome feedback.
This was really helpful! I’ve been scratching my head for a long time, your php code worked as dream. Thanks!
Hey,
Glad that I could help.
Thanks for your awesome feedback.
Yes indeed! Good points and good post…I tryed for my website as well and improved the perfection grade on gtmetrix. Best Regards
Hey,
Glad that I could Help.
Thanks for your feedback.
Hello,
Thank you for sharing this script. It worked at one point until my theme got updated. There is now a syntax error on the first line. Any ideas? Thank you for checking.
Hey Samantha,
Glad that you find it useful. Looking forward to listen more from you.
Thanks for dropping by.
Hello Saurabh,
Nice tips though. You have mentioned a plugin which has not been updated since a year, there are also other plugins for removing query string, what would you prefer? An updated one or old one?
Thanks,
Karan
Hey Karan,
Glad that you find this useful.
You can use other methods like W3 Total Cache which is good plugin and also gets regular updates or can do via function.php.
thanks for your response.
Hi Saurabh,
Your code worked to remove some query strings, but I couldn’t remove some strings added by Jetpack plugin’s Photon Module!
Anyways, very informative post!
Thanks for Sharing! 🙂
Hey Adithya,
Glad that you find it useful. Looking forward to listen more from you.
Thanks for your response.
Add to my functions.php and now the site is broken showing a 500 error. Any idea on how to UNDO this?
/*** Remove Query String from Static Resources ***/
function remove_cssjs_ver( $src ) {
if( strpos( $src, ‘?ver=’ ) )
$src = remove_query_arg( ‘ver’, $src );
return $src;
}
add_filter( ‘style_loader_src’, ‘remove_cssjs_ver’, 10, 2 );
add_filter( ‘script_loader_src’, ‘remove_cssjs_ver’, 10, 2 );
Hey Dennis,
If you are not able to log-in to WordPress, you can log-in to your Web Hosting account and can navigate to function.php file under your WordPress site folder. And can remove the unwanted code from there. To avoid such situation it is always advisable to create a back before editing core WordPress files. Hope, this will help. Looking forward to listen more from you.
Thank you so much, your code worked like a charm.
Hey Mariam,
Glad that I could help.
Thanks for your response.
Great explaination Saurabh
In Method 3 , the code has to be inserted in the end or at starting ?
Hey Aman,
Glad that you find it useful.
Code is to be placed in side the php tags of function.php. It is recommended to create a Back up before making any changes in core WordPress files or theme files. So that you can revert back if something went wrong.
Thanks for feedback.
I had tried solution 3 but Gtmetrics don’t find any changes in speed By Page score speed still 96% what should I do ? should I go for solution 1
Hey Manjesh,
if I was you, I must try that.
Anyway thanks for feedback if you had not commented to make a link only.
The “Remove Query Strings From Static Resources” worked perfectly on my VPS bringing it from 34% to 90%. Thank you so much for sharing this method.
That is a good score. Glad that I could help.
Solution #3 works excellent if you’re using a low number of plugins. For a heavy plugin loaded site (one of my sites uses 45 plugins) you have to balance between performance grade and page speed.
In my case I’ve increased performance grade BUT page speed went down significant (by more than 1 second). This was because too many query strings had been removed each time a page was loaded causing too much PHP performance load. Too get a better Google rank I’ve decided to offer visitors a better page speed.
Just my recommendation: always watch the more important metric – in my case it was page speed.
For a low plugin site I’ve got perfect results with this solution. Thanks!
Glad that you find it useful.
The Code Working well on my site.
Thank You
Glad that I could help.
Awesome , Third method worked perfect for me !!
I think improving the wordpress load speed is very useful. Very good advice.
Saurabh, I found your page by accident when I was looking for WP article to improve my beta test web page. After implementing the changes recommended in your blog article I was able improve my page speed by 500%. Thanks a lot
Great improvement man. Glad that I could help.
Worked for me to remove query string. Thanks
Hey Purva,
Glad that I could help.
Thanks for stopping by.
Disable photon and most of the query strings will go away
Yep. You are right, but still a considerable amount of query strings will left as it is and affect the performance. I would suggest you to use the code.
hi Saurabh K says
thanks for sharing
i like to use Solution # 3 but it is not working my site
i add code at the bottom of function.php file.
pls help
thanks
Hi,
Any solution for users who are using wp super cache?
Hi,
The code is already there in functions.php and “Prevent caching of objects after settings change” option is also unchecked but the problem is not resolved. I can’t put more burden on my shared hosting so I don’t want to install “Remove Query Strings From Static Resources” plugin.
Hey there,
Thanks for the solution – the ‘Remove Query Strings From Static Resources’ plugin worked like charm.
hey saurabh,
I run DesignrsDen(dot)com and i searched my site for pingdom and it showed me to Remove query strings from static resources.
i tried the code and the preformance score just improved from 41 to 52 but it is still in the red area.
– i cannot use W3 Total Cache, WP Super Cache as my server is “wordpress powered by godaddy” and it dosent allow these plugins to install
-I also tried Remove query strings from static resources plugin but still the pingdom shows the same issue.
please let me know how can i resolve this issue
I think solution 2 will work more effective than solution 3. unchecking the bos is more easier than inserting a code. I had personally use soultion 2 to my site and it really work.
Thanks for the info.
Thanks brother for your great tutorial. I have try this on my site.
SUPERB!
Keep up the good work!
Thanks
Good stuff Saurabh… if you have time maybe you can offer feedback on our free plugin also? It can accept custom “args” for query string removal:
Remove Query Strings
Anyway thanks for your consideration!
Hey Chris, Thanks for stopping by, i would love to share my feedback on your plugin.
thank you for making a complex issue so simple. The func.php code is working fine
Hey Moumita,
Glad that I could help.
Thanks for stopping by.
Hi Saurabh,
Thanks for a great article, and your suggestion for adding the code to the php file works well. That said, it causes a problem for me as I have this line of code in functions.php
wp_enqueue_style( ‘google-fonts’, ‘//fonts.googleapis.com/css?family=Lato:300,300italic,400,400italic,700,900’, array(), CHILD_THEME_VERSION );
Is there a way to modify your code to exclude this font?
Best wishes,
Dave
Hi Deve, This code should work fine with Google Fonts.
However, if you are experiencing issue with Google Fonts. You can hook the following code in wp_footer. And remove the Google fonts code from functions.php
Find your code here..
https://fonts.google.com/?query=lato&selection.family=Lato:300,300i,400,400i,700,900
This code will increase your PageSpeed.
There are lots of great Web Safe Fonts available, you can use these instead of using Google Fonts.
https://technumero.com/use-web-safe-fonts-over-web-fonts/
nice article about remove qurey string
Code works! I tend to over complicate things when it comes to WP. lol
Cheers,
AriBaa
For W3 Total Cache, the query strings can be removed by activating the option:
‘Remove query strings from static resources’
which can be found in the ‘Browser cache’ section
Even when I used W3 total cache plugin, still some static resources have some query strings.
Hi can php be put into
code snippets “ plugin?
Also… I only saw query strings appear the other day as I started to get comments on my blog. Getting rid of avatars and gravitars wouldn’t help and Easy load Comments would not remove them either!
Howard
It works for but not enough. Still, my Remove query strings from static resources Score is F(30). I am using W3 Total Cache. Please help me.
You can use the code along with W3TC plugin.
amazing post and 3rd method is actually great where we don’t need any pluggin….
Keep writing such a wonderful article…
Thanks for sharing
Thank you! Saurabh K
I just used W3 total cache and loading speed has reduced from 3.82 to 2.23 seconds. But there are still many of these query strings. Is there a way I can remove all of them and reduce my loading speed even more?
Many Thanks
Hi Ondari,
You can use the code along with the W3TC plugin. It should minimize the no. of query strings.
Thank you for stopping by.
1st plugin not work for my site but w3 total cache is fantastic to remove query string and caching.
Thanks for this
Thanks a lot bro……
Great Post But Please Change The W3 Cache Method Because i could Not found the File, You Said and Showing Picture in Post, So Please Change and Tell me Basic Method, How i Remove Manually 100%
Use the code instead.
Doesn’t cut it; code adding is risky cuz you might break your website, and those mentioned plugins have annoying side effects.
Very nice tutorial! Thanks for Technumero
Hi Saurabh K , i want to remove qurey string from my website i read your article its nice and make sense , but i couldn’t function.php in my opencart 2.3.0.2, do you have any idea where i can look for it
Thanks in advance
Ahhh that pop-up. Shoulda liked this when I had the chance, now I have to search for like us on facebook button -_-
Great content buddy, makes perfect sense, now all I need to do is to put it to use. Thank you and wish me luck!
Hi Milos, Hope you have implemented the hacks. Let me know if any support required, i would be happy to help.
Thanks for stopping by.
Frankly, I think that’s absolutely good stuff.
really helpful post for me
Once again you have save me from the low speed of my page from this your contents I am so so much grateful to you please keep it up thanks and God bless you.
Great to see that you find the information useful. Thanks for stopping by.
Really very nice. Thanks.