WordPress WooCommerce – IMPROVE SITE SPEED – Install Caching Plugin (W3 Total Cache )

Hi everyone In this tutorial I'm going to show you how to increase your website's site loads paid and this is particularly important for eCommerce stores because every second makes a difference

Just to give you an example, here is a website: fastcompanycom Here is a graphic of people how many people drop off as the site gets slower

So, its abandonment percentage across page load time and just as another example, there is a little statistic in here; let me just find it Here we go Amazon has calculated that a page load slow down of just one second could cost one point six billion dollars in sales each year and Google has done some research showing that if it just slowed down its page, its search page load then that could cost them eight million searches per day So, that's just a very general idea of why page loads speed is important, particularly for an eCommerce site where you are focusing on conversions and, therefore, customer experience By the way if you haven't already checked out my “How to make eCommerce store” tutorial

It's a full step-by-step instructional guide on how to setup an eCommerce store like the one you see here So, anyway, first things first Let’s login to WordPress dashboard Now, in this tutorial I'm going to discuss the installation and take you through the setup of what is known as a caching plugin Now what is a caching plugin or what is a cache

A cache is basically a temporary storage area of your website it's a temporary storage of your web pages and data and allows files to be served to the user much much faster Before I actually install and show you how to configure everything, I'm going to do a speed test so we have something to compare at the end of it So, if I just go in here and google 'pingdom speed test' You can do the same for your eCommerce store just check your URL in there and it will do a speed test there we go So, currently, my website has taken nearly four seconds to load so what I will do is compare that figure with the new load time at the end of this tutorial

After I've installed and configured the caching so let's do that, let's go into plugins add new, search for a plugin called W 3 Total Cache Install that one there Don't forget to activate the plugin ok, now when you activate the plugin you should see a tab in the left hand side bar called performance so let's go into the general settings for now The first thing we want to do is come down to page cache and, just as an overview, each one of these areas here: page cache, minify, database cache etc

they're all going to there is more set up behind the scenes so we'll go into each one of these and set them up So, this is an overall high level

But first thing to do is let's enable what we need to show page cache Yes, I'd like you to enable that one and choose disk enhance that's the best way to set this one up Minify: what medication is it enables the compression of HTML, CSS and JavaScript code to make your website loads faster Now if you're running a CDN then do not enable minification

if you don't know what a CDN is, don't worry, you won't be using one and it's something I might cover in a future tutorial Now, when minification is enabled your site may not work This happens if there's a plugin that is not compatible with minification So, therefore, to be on the safe side, I choose not to enable this But for those of you that do want to test it out, I will show you the settings from minification in a second

down to database cache, let's enable that and ensure that the database cache method is disk Object cache- enable that one as well and ensure the cache method is disk, as well enable your browser cache This enables the caching in your visitors' web browser so that pages are loaded up faster if the access your site for a second time CDN, like I said, don't worry about that I'm gonna cover that in a future tutorial and that's all for now So, click one of the save all settings buttons when you've done that and that will save all of the changes you've made on the page ok

Now, let's dig deeper Let's go into to page cache which we've just enabled Ok, let's ensure that cache front page is enabled Enable cache feeds, enabled the cache SSL Leave this one disabled

Now do not enable the cache for a full pages This is not recommended, so leave that blank we do want to enable the cache request for our site and this tick box basically says that for people that are logged in such as yourself don't cache pages, so you want to be shown a fresh version of the side because often you'll be making updates to your website and you do not want to be showing or you do not want to see the older version similarly, you can choose not to cache pages for people with the following roles: so, you would be an administrator of your website, if you had other people who had the role of editor/ author/ contributor than you could do that and if you don't know what that is, just have a look at my other tutorial on setting up user roles It's not essential, in case you have that setup then you can use this option

If not, don't worry about it Now, go down Cache preload Yes, we want to automatically prime the page cache Leave the update interval and pages interval at the default, like you see there Enable preload the post cache upon publish events

Then go down leave all of this as default, don't change any of that And that's it

So, just make the changes I showed you and leave everything else as default, click one of the 'save all' settings buttons and everything on that page cache setting area will update You may notice a couple of notifications It says here in order for database caching to work with WooCommerce come as you must add this to ignored query strings I will come to that in a second The next thing is minify

Like I said previously, I choose to disable minification If you want to, you can definitely enable that and test how your website works It does create a slight improvement in load times because it compresses HTML, CSS and JavaScript If you would like to use this, here are the recommended settings So leave the rewrite URL structure enabled, keep this one here disabled, go down and enable HTML minify settings

enable inline CSS, enable inline javascript enable the line break removal Now, in this box here ignored comment stems just press enter and put that in: mfunc Now, if you are running eCommerce Sorry, if you're running WooCommerce, then you need to enter that into ignored comments stems in your minify settings

Leave JavaScript as default Leave CSS as default and leave I'm just having a low key just in case there's anything else I need to change and there's not So that means we can save all of the settings

Of course, here it says it's disabled because I have chosen in my general settings not to enable minification But if you want to just click that enable button and use the settings I just showed you The next thing database cache and we have definitely enabled that one Ok, now to start with leave this one enabled Don't cache queries for logged-in users

Leave that as is in the Advanced section, leave the maximum lifetime of cached objects and the garbage collection as default Coming down into the ignored query stems Now there is something that is essential we must add in this box because we are running WooCommerce and that is let me just find it… sorry _w_session_ and you'll notice that the notification that was up in the top area before has not disappeared Basically that notification was just to tell us that, because we are running a WooCommerce, we must import this in the ignored query strings of database cache settings So, make sure you do that

And that's all there is for database cache After you saved that, move on to object cache Ok, leave the settings here as default Actually there's nothing to change on object cache so we're fine Browser cache

Ok Leave 'Set Last-modified Header' enabled Enable this one here 'Set Expires Header' Enable the 'Cache-control Header', enable 'Set Entity Tag' we want to 'Set W3 Total Cache Header' want to enable HTTP(gzip) compression we want to leave this one disabled by default and I leave this one as default as well, that's my personal preference And then click “Save all settings” Let me just check if there's anything else we need to change in this area here No, everything else is all good

Leave them all as default and then, basically we're done CDN is something I will do in a different tutorial That can make a decent improvement in speed as well, but for now, it's not essential and so that's all there is to setting up our total W3 total cache Now, let's just do a website speed test, now that we've done all of that So, if I go back to 'pingdom speed test' Wow! Massive, massive difference! That is under

under one second load time Let's compare that to four seconds before we installed and configured this cache in plugin So, your eCommerce website visitors are going to have a very very fast experience

Look at this website: it is faster than 94% of all tests websites and now, keep in mind, your speed improvement may not be as substantial as I have here You may have more content on your eCommerce store then I have So, it may not be as great but, the point is, it will be a decent improvement from your initial speed, so there you go I'm just showing you in the space of about 10 minutes how to drastically improve your website load time Please, thumbs up this video

Subscribe to my channel, because I'll be putting out more awesome stuff in the future and if you want to learn how to set up an eCommerce store from scratch using WordPress, I've got a link for that video in the description below Thanks Thanks for watching Please leave a comment if you have any questions

Free Email Updates
We respect your privacy.

affiliate marketing instagram

affiliate marketing