Hi guys, welcome back to my channel!
This is Boilie. Today, I am going to show you guys how to speed up your WooCommerce store using a free plugin that is called "W3 Total Cache."
W3 Total Cache is one of the good cache plugins that you can use to speed up your online store.
It will improve the search engine optimization or SEO and user experience of your site by increasing website performance and reducing load times by using features like content delivery network or CDN integration and the latest best practices.
But before, we get started, I want to welcome back all my subscribers. I appreciate you all. But, for those who are brand new to my channel, my name is Boilie. I create tutorials about e-commerce web designs focusing on user experience using WordPress. Alright, with that being said, let's jump right in.
All right, let's go to "get matrix.com" to do a speed test of the demo store before we install the W3 Total Cache plugin. Let's go back to the back end to copy its URL and go back to "gematric" to paste the URL in the box and then click the test your site button. Here's the result. Well, my demo site doesn't have lots of files for testing yet, and as of right now. It takes about 2.1 seconds to be fully loaded. It's not that bad at all in the real world; especially, it gets a grade of A.
When you scroll down a little bit more at the bottom, you'll see some top issues that you could take a look at to fix them. It will tell you if the issues are serious or they have a low impact.
All right, let's go back to the demo store to install the W3 Total Cache plugin to improve the demo store performance. Go to "Plugins." Click "Add New" button on the top. Type on the search box "w3 total cache." That's the plugin we're gonna install, click the Install button, and then click the Activate button.
You should be redirected to the main plugins page. Scroll down a little bit to find the W3 Total Cache plugin and then enable the auto-update feature to your right. Click the "Settings" right here to go to its dashboard or go to "Performance" on the left panel and click "Dashboard." And here's its dashboard. We're going to do the quick setup guide first.
Select either "Accept" or "Decline" here to let them collect your usage data.
But first off, don't forget to subscribe to my channel if you haven't yet, and turn on that notification bell so you won't miss any future uploads about e-commerce web designs from me. All right, click "Next" for the Page Cache." Click the test page cache button.
You'll see the options that you could choose for this setting.
Select "Disk Enhanced" as recommended for the best option here. If your server has the Memcached feature, you could select that option too. But for the page cache setting, using the Memcached doesn't improve its performance as the percentage numbers in the green highlights indicated. Click "Next" for "Database Cache." Click "Test Database Cache" using the Memcached is the best option for this setting but if your web hosting provider doesn't have this feature, just leave it as "None" as for now.
We're gonna come back to this setting later on in this tutorial. Make sure to give this video a thumbs up, if you find it helpful somehow so you can help other people to find my content too. I would appreciate your support a lot. Thank you and then click "Next" for the Object Cache. Click "Test Object Cache" as you could see here.
The best option is to select "Disk" for the Object Cache. You could see the green highlight percentage the object cache is used to view pages, but it doesn't reuse them for future page requests. Select "Disk." Then select "Next" for the browser cache.
Click "Test Browser Cache" as you could see here this option is already enabled as a default option so just leave it alone this will make sure that a browser will request your updated website files correctly if needed then "Click" next to go to "Lazy Load.
Check the lazy load images option and then click next to go to more caching options as of right now. The quick setup guide is complete. But, we need to go over the general settings again because there are some settings that I need to make sure we configure them correctly. All right, click "Dashboard" to go back to the main page. This page gives you a quick look at the overall performance of your website and click the button "Empty all caches" on the top.
Then click "General Settings" on the left menu panel scroll down to the minify section and enable it by checking the box "Enable." A pop-up box shows up to warn you about file minification. Click "I understand the risks" to minify your website files or to reduce load time by decreasing the size and number of CSS and jess files. It will also remove unnecessary data from CSS, jess, feed, page, and post, HTML. By the way, if you want to support my channel, I add all the links in the description box below.
Thank you so much for your support. All right, let's get back to the video. Next, scroll down to the database cache section check the enable box. As for the database cache method, select "Disk" if you don't have the Memcached feature in your server. Next, scroll down to the object cache section.
Click the enable box to turn it on.
Select "Disk" for the object cache method if your server doesn't have the Memcached feature.
Click "Save all settings," then scroll down a little bit to the CDN section in this section if you already have a CDN account with any providers that have partnered with the W3 total cache as the following on this screen. You may be able to connect it right here. But I am not going to cover this section in this tutorial. Well, let me know in the comments below if you guys use this plugin to improve your website performance and how it helps your website or online store so far allrightniks', let's scroll down to the user experience section. Check the box to disable emoji to remove emoji support from your website. Next, let's scroll down to the fragment cache section at the bottom. Scroll down a little bit to the fragment cache section.
Select "Disk" if your server doesn't have the Memcached feature.
It's because if you enable the fragment cache it will reduce execution time for common operations in your website so scroll down a little bit more to click the save all settings button. Once everything looks good, then scroll up to the top of this page. Click the Empty the page cached button and then also click the Empty the minify cached button. It's all done. All right, let's go back to "gematric" to do a speed test again. This could take a couple minutes Here comes the results! All right, we get 1.5 seconds load time after. It's not that much to compare since before it took about 2.5 seconds to fully load. Then you could scroll down to see more details of the top issues and more especially about the file sizes that you can work on to optimize further. But, if we connect the site with the CDN network, the speed of the website will be a lot faster than this. That's it for today's tutorial, thanks for watching. Don't forget to subscribe for more e-commerce web designs focusing on WordPress tutorials and turn on that notification bell.
So, you won't miss any future uploads. Have a wonderful day wherever you are! I'll see you in my next video, bye now.
CloudFunnels Specialdeal
No comments:
Post a Comment