How to remove query strings from static resources in wordpress

I ran some tests in Pindgom & found that load times could be improved. The fix was to remove query strings from static resources. Here is a screenshot before optimization:

before remove query strings from static resources - pingdom

I needed to improve the load time and the perf. grade score a bit more to improve SEO ratings.

There are many websites where you can perform a speed test of your website. I would recommend either of the following:

  1. Pingdom: http://tools.pingdom.com
  2. GTmetrix: http://gtmetrix.com

The above websites also provide a ‘Waterfall layout’ which displays the sequential order in which the elements are loaded(starting from the DNS query, the wait times, load times etc). I used pingdom instead of Gtmetrix as I was able to select the server location from which the test was being conducted which made it more flexible. Now, lets gets started!

[Disclaimer: Only attempt this if you know what you are doing and make sure you have a full backup of your website just incase something goes wrong.]

To remove query strings from static resources:

Add the following to your wordpress theme’s functions.php file and save it.

/*** 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 );

After adding the above code, I ran a speed test in pingdom to check if there was any performance improvement. As expected, the perf. grade score increased from 78/100 to 84/100 and the load time reduced to 286ms from 975ms. Yaay!!

after- remove query strings from static resources - pingdom

Also, note that if in the future you update your wordpress theme, the functions.php may also be updated/replaced. So you may need to verify and re-do this step again to make sure its persistent after the theme update.

There are plugins that do the same procedure to make things easier, but I prefer the manual way as installing a lot of plugins can slow down your website.

Have you optimized your wordpress site? Feel free to leave a comment below. Do subscribe for future updates. Happy Blogging!

[Source: Technumero, WordPress forums ]

How to setup Cloudflare CDN with Bigrock (manually) + Screenshots

This is a guide on how to setup Cloudflare CDN with BigRock (similar for Bluehost,Godaddy, Dreamhost, Hostgator) for your website or blog . You can follow the steps below:

Step 1. Create an account with Cloudflare:

Go to https://www.cloudflare.com and click on the “Signup” button.

 

cloudlare signup

Fill in your details, tick on “Agree” and then click on “Create Account“.

cloudflare create account

Step 2. Add your website

Now, in the text box below, type your website address and then click on “Scan DNS Records“as shown below.

cloudflare add site and scan dns

It will take a few moments for the scanning to complete.

 

cloudflare scanning dns records

Once, the scanning is complete, click on “Continue“.

 

cloudflare dns scanning complete

Now, click on “Continue” in the bottom corner:

cloudflare click continue

 

 

Step 3. Select Cloudflare Plan

Now, select the “Free Website” package as shown below and click on “Continue“.

 

select cloudflare free plan

Step 4. Get new name servers

Now, you will see the Cloudflare name servers as shown below. [This may vary for your website]

cloudflare name servers

As you see, for my website it is requesting to change the name server from

dns1.bigrock.in to linda.ns.cloudflare.com
dns2.bigrock.in to rob.ns.cloudflare.com

Also, also to remove the following nameservers:

dns3.bigrock.in 
dns4.bigrock.in 

[Note: The nameservers that you may see in your screen may be different.]

Step 4: Change your name servers to Cloudflare

Now, open up a new tab and login to your domain host panel (i.e. from where you bought your domain name from eg BigRock, Goddady, Hostgator, Bluehost etc). I have my domain from BigRock so I will be loggin in to my Bigrock account.

domain hosting bigrock login

Now, click on the domain you need to change the name servers to.

 

bigrock select domain

Now, click on “Name Servers” 

 

bigrock manage name servers

 

 

And you will see your default nameservers as shown below:

default bigrock name servers

Now, change your nameserver to the ones provided by cloudflare. In my case, after changing the nameserver, it will look like this:

 

cloudflare nameservers update

Now, click on “Update Name Servers“.

domain bigrock nameserver change success

Step 5: Verify in Cloudflare

Now, go back to your cloudflare tab and click on “Continue“.

cloudflare dns nameserver

It should show you show you a green banner with the status: “Active” as shown below.

 

cloudflare cdn active status[NOTE: If you the status does not show as “Active” then you can click on “Recheck Status” and it then should show that its “Active”]

[IMPORTANT: It would take about 24-48 hours for the DNS to get updated.]

And Voila! You have successfully configured Cloudflare CDN for your blog/website and should load faster.

Do check the  performance of your website after 24-48 hours and let me know in the comments sections below if there was any speed improvement.

If this article helped you, then support us by liking us  us on FacebookTwitterGoogle+ and  Tumbler. 🙂

Regards,
ΞXΤЯ3МΞ