How to remove query strings in WordPress?

WordPress is a content management system that helps you collect various resources and present a beautiful layout in the browser. Building a simple WordPress website requires core WordPress software, a theme, and plugins. These elements, in turn, contain HTML, PHP, CSS, and JavaScript source files. Developers typically supported versioning of these source files by adding a query string to the end of the URL. While this helps developers, it can create a lot of problems for website owners in terms of speed and security. In this article, we will take a detailed look at what query strings are, how they can affect your site, and how to remove a query string in WordPress.

Where are query strings used?

Query strings are used in two main ways – front-end and back-end.

  • Frontend – You can find query strings on e-commerce sites like Amazon to find products. Similarly, WordPress forum websites use a query string to serve dynamic content for a specific user session.
  • Backend – WordPress theme and plugin developers use query strings in CSS and JS files for version control. For example, if you are using the version 10 Jetpack plugin, the associated CSS and JS files loaded in the backend will have query strings after the URLs, such as /?v=10.0 .

Frontend – Using Query Strings Dynamically with Slug

The default URL for a WordPress post or page contains a domain name and a label, as shown below:

https://www.webnots.com/this-is-my-slug/

However, you can add some additional parameters to the URL after the question mark in the URL. For example, the URL below will search for the given string on a WordPress site and display the results.

https://www.webnots.com/?s=search-string

These parameters are called query strings and you can use multiple parameters in the same URL to get the desired results. Below is a graphical representation of what a query string would look like in a WordPress URL.

Query string format
Query string format

Typically, the use of a slug query string is required to perform functions such as searching using the default WordPress search, searching for products on e-commerce websites, and serving dynamic content on forum websites. In this article, we do not discuss the dynamic use of query strings with slug.

Backend – Using Query Strings with Static Resources

As mentioned, developers use query strings to keep track of changes and release a new version of a plugin or theme. You can easily view the query strings in CSS and JS by viewing the source code of your WordPress site.

Query Strings in CSS and JS Files
Query Strings in CSS and JS Files

As you can see, the CSS and JS files have a version number at the end, which is the query string. In this article, we primarily discuss query strings used in backend CSS and JS files.

See also  Why and how to disable WordPress channels?

Why Should You Remove Query Strings in WordPress?

While query strings are useful for developers, you may experience the following issues:

  • Previously, browsers did not cache static files with a query string in the URL. Because of this, every time these files are requested from the origin web server, the page load speed slows down. At the time, deleting query strings was one of the problems you often saw with Google PageSpeed ​​Insights and other speed measurement tools. However, Google Chrome and other browsers will cache based on the cache header present on the website and follow the query strings. We still recommend removing query strings because some CDNs and proxies cannot cache file URLs with query strings.
  • In addition to caching, these query strings can be vulnerable to security attacks, allowing hackers to collect sensitive information such as login credentials, tokens, database details, and more. For example, a plugin installed on your site could have security issues. The developer released a new version to fix the issue and posted the details on their website. If you don’t update the plugin right away, any hacker will be able to view the source code of your site and understand that you are still using the old version of the plugin from the query strings of the CSS and JS files.

Removing query strings reduces such vulnerabilities and allows the browser to cache static files. This will protect and also improve the performance of your site. Since page speed is critical to good Google rankings, you should remove query strings from your stats files on your WordPress site.

How to remove query strings in WordPress?

In this article, we will look at several different ways to remove query strings in WordPress:

  1. Remove query strings with a plugin
  2. Manually remove query strings without a plugin

Remove query strings with a plugin

There are several free plugins that you can use to remove query strings in WordPress. These plugins can also help speed up your website by performing various actions. Some of the most popular plugins include:

See also  How to add a mega menu to a WordPress site?

1. Remove query strings with W3 Total Cache

The W3 Total Cache plugin is a free tool for caching websites and reducing website loading times. The plugin also provides the ability to remove the query string for WordPress.

Delete query strings in W3 Total Cache
Delete query strings in W3 Total Cache

You can check out our complete guide on how to properly set up the W3 Total Cache plugin on your site.

2. Remove query strings with WP Performance Score Booster.

WP Performance Score Booster is another free plugin that allows you to perform various actions on your website. You can cache your website, compress it with GZIP and remove query strings. The plugin is easy to set up – just install, activate it to enable the functionality.

Remove Query Strings in WP Performance Score Booster
Remove Query Strings in WP Performance Score Booster

3. Remove query strings using the Hummingbird plugin.

Hummingbird is another plugin that can be used to remove query strings in WordPress. This plugin checks your site for slowdown issues and generates a detailed performance report for you.

Deleting query strings with Hummingbird
Deleting query strings with Hummingbird

4. SG Optimizer plugin for SiteGround

If you are using SiteGround hosting, it comes with the SG Optimizer plugin pre-installed. Go to the “SG Optimizer” menu and then click the “Frontend Optimization” tab. Scroll down and disable the “Remove query strings from static resources” option.

Remove query strings in SG Optimizer
Remove query strings in SG Optimizer

Note: As mentioned, modern browsers and page speed testing tools do not work based on query strings. Consequently, many premium plugins such as WP Rocket and Perfmatters have removed the ability to remove a query string from a static resource.

See also  How to clone or duplicate an entire WordPress site?

Removing query strings with code manually

Alternatively, if you don’t want to use any additional plugins on your website, you can remove the query strings manually using PHP code. To do this, you can insert a block of code in your theme’s functions.php file.

Edit Features
Edit Features
function removeQueryStrings( $src ) {
 if( strpos( $src, '?ver=" ) )
 $src = remove_query_arg( "ver', $src );
 return $src;
}
add_filter( 'style_loader_src', 'removeQueryStrings', 10, 2 );
add_filter( 'script_loader_src', 'removeQueryStrings', 10, 2 );

This method can be tricky as you can easily break your website. While you can use a child theme, we recommend using ” Code Snippets ” instead of editing the functions.php file.

Add code with the Code Snippets plugin

Add code snippet
Add code snippet
Paste code snippet
Paste code snippet

Conclusion

Query strings can be useful for development purposes to support versioning. However, some servers cannot cache files with a query string, and these can also be a security issue. If you want a quick and easy way, use any of the plugins listed above. Alternatively, you can use the code that comes with or without the plugin.

Similar Posts

Leave a Reply

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