How to optimize WordPress websites & improve the Score using simple codes & free plugins? | Saujan Man Pradhan | Skillshare

Playback Speed


  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

How to optimize WordPress websites & improve the Score using simple codes & free plugins?

teacher avatar Saujan Man Pradhan, WordPress Designer and Graphic Designer

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Lessons in This Class

11 Lessons (1h)
    • 1. Introduction - Optimize and Improve the Gtmetrix Score of your WordPress websites

      2:12
    • 2. Serve next gen image formats, convert WebP using Photoshop

      10:06
    • 3. Properly Size Images & run old Gtmetrix test

      4:25
    • 4. How to Serve Scaled Images and Optimize images for better GTmetrix score

      10:45
    • 5. Recommended FREE plugins for your Website(s)

      4:18
    • 6. Enable SVG, WebP, and ICO upload on your WordPress website

      2:23
    • 7. How to Preload Key requests - Google PageSpeed Insights

      7:52
    • 8. How to improve Add Expires headers score on GTmetrix using .htaccess (no plugin)

      3:15
    • 9. How to correctly configure Cache as recommended by GTmetrix (aso a tip for Cloudflare users)

      2:50
    • 10. How to improve the GTmetrix score for ┬áDefer parsing of JavaScript

      4:42
    • 11. How to resolve critical error or 500 internal server errors while using the codes?

      7:50
  • --
  • Beginner level
  • Intermediate level
  • Advanced level
  • All levels
  • Beg/Int level
  • Int/Adv level

Community Generated

The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.

123

Students

--

Projects

About This Class

Ever wanted to easily improve the Gtmetrix score of your WordPress websites? Then this course is definitely for you. With a few codes and free plugins, you will be able to get a better score at Gtmetrix.

The benefits of having a good score are basically your website will be optimized and will load faster. And of course faster the website the better. In this course, we will cover some basic things that will improve your website score using very little codes and free plugins. However, please note that the optimization of a website depends on lots of factors such as themes you are using, hosting, how things are coded, etc.

Here's what is included:

  1. Learn to serve scaled images and optimize images
  2. Know about some plugins to improve the GTmetrix score (we will be using the free versions)
  3. Improve add expires headers score and leverage browser caching score on GTmetrix without using
  4. any plugins
  5. Learn to correctly configure cache as recommended by GTmetrix and there's also a tip for Cloudflare users)
  6. Get a better score for defer parsing of JavaScript
  7. Resolve critical error or 500 internal server error

We will be working with a LIVE website so that it will give a better insight. The codes are provided in the resources. Please feel free to get back to me if there is any confusion.

Thanks,
Saujan

Meet Your Teacher

Teacher Profile Image

Saujan Man Pradhan

WordPress Designer and Graphic Designer

Teacher

Greetings everyone!

I am a WordPress Developer, Graphic Designer and a Social Media Marketing Expert with a Master Degree (MBA) from Nepal and more than 8 years of experiences in Designing & Marketing.

I have been working as a WordPress Developer for more than 5 years now. I have worked for both back-end and front –end development including WordPress themes and plugins. I do themes customization, designs and many more. Being a Graphic Designer helps me to play with color choices and as well better communicate with the clients as sometimes I use the image form to showcase the actual design before it is made.

For Graphics I mostly use Adobe Photoshop to implement my concepts to reality and also use Microsoft PowerPoint to present the ideas through presentat... See full profile

Class Ratings

Expectations Met?
  • Exceeded!
    0%
  • Yes
    0%
  • Somewhat
    0%
  • Not really
    0%
Reviews Archive

In October 2018, we updated our review system to improve the way we collect feedback. Below are the reviews written before that update.

Why Join Skillshare?

Take award-winning Skillshare Original Classes

Each class has short lessons, hands-on projects

Your membership supports Skillshare teachers

Learn From Anywhere

Take classes on the go with the Skillshare app. Stream or download to watch on the plane, the subway, or wherever you learn best.

Transcripts

1. Introduction - Optimize and Improve the Gtmetrix Score of your WordPress websites: Greetings everyone. My name is Saujan Pradhan and today I will share some simple ways to improve the GT metrix score for your WordPress websites. The primary objective of this course is to get a better score for your site at gtmetrics.com. Using some simple codes and free plugins, we will massively improve your website score. So what will we learn in this lesson? In this course, you will learn about analyzing your website on GTmatrix and simple codes and free plugins to get a better score. We will learn to optimize images, install and setup free plugins for better performance of the websites, and use codes and functions.php, and that will improve the overall site score. Here's the brief course content: Learn to serve scaled images and optimize images. know about some plugins to improve the GTmetrix score, we will be using the free versions. Improve, add expire headers score and leverage browser caching score on Gtmetrix without using any plugins. Learn to correctly configure cache as recommended by Gtmetrix. And there's also a tip for Cloudflare users. Get a better score for defer parsing of JavaScript and resolve critical error or 500 Internal Server error. What skills or coding knowledge is required for this course? Everything is simplified in this course. You will only need some basic knowledge of WordPress. No coding skills will be required. We will use some codes. However, it will be clearly explained how you can use it. Additionally, we will also learn to gain access to the website in case of critical or internal server error. Conclusion After this lesson, you will learn about some codes and plugins to improve your overall website score. You will have a better website in terms of speed and optimization, which will be reflected by the Gtmetrix score. So let's get started. 2. Serve next gen image formats, convert WebP using Photoshop: Greetings everyone. In today's tutorial, we will quickly learn to resolve serve images in next in formats. On Google pays inside RGT matrix. We will convert JPG and PNG images to WebP format online and also by using Photoshop. We will then upload WebP images on our WordPress website without using any plug-ins. Let's get started. Let's open up our browser and go to our demo site hill, it's learned something.com slash demo. So this is our demo site. Let me quickly run Google PageSpeed and analyze the website. Now if I scroll down, you can see serve images in next-gen format. We will resolve this. This is for the mobile version. And even if I check the desktop version, you can see serve images in next-gen format. Let's fix this. Simply open all images and save them in a folder. I'll save it to deck stop and create a folder JPEG images. And lead save them all. So we have saved all the images. So here are all the images we need to convert to wear PPE format. Please note, if you have a small side or starting a new website, then you can manually convert all images to Wave B and upload it to your WordPress website. But if you have many images that needs conversion, then you can use various plugins like P express E www image Optimizer and convert images to wear PPE format. However, in this tutorial, we are doing the conversion manually without using any plug-ins. Anyway. So these are the images. The edges method is if we search JPEG to WebP and go to this side, I have been using this site and works pretty well. Choose an email. Let me choose one. Upload. Convert to Wave B. You can see there's not much difference in the quality of the MAs. And simply save it. Show in folder if I open this e-mail. So it's now in WebP format. So this is how you can do it online. You can do it for all the images. For now, one image is done. Let me cut the images and put them here together. I'll just rename it. Now this is doing online. If you want to work it with Photoshop, by default, you cannot. Let me drag an e-mail. And let's try to save it in webpage. Photoshop does not allow to save it, nor so is the WebP images as we kept it in the same folder. Now, in order to enable this feature on Photoshop, first, let's close Photoshop. I'll close this to. Now, open the browser and go to the side. Here, Let's learn something.com. Once you are here, simply search for Photoshop. Click here. So here are a couple of links to download. The plugin is available for both Mac and Windows. We will do it for Windows, download it for Windows. It has been downloaded. So in folder, I'll keep it in the deck star. So this is the plugin which will help you to work with WebP images on Photoshop. So to install this, go to Start Menu type Photoshop. Here is it, right-click on it. And Open file location. Once this has opened its assault God, so right-click on it, go to Properties and again go to Open file location. So this is the folder or you can directly go to C drive Program Files, Adobe Photoshop. Anyway. So now find and go to plugins folder. So this is the folder. So you just need to cut or drag the file over here. That's about it. Let me close this. After this is done, simply open your Photoshop. Now we are here. Let me try and open an email. So let's go to the JPEG folder. You can see it can now read where P format. Let's convert this one. You can make necessary changes to the images as you want. Just double-click on the background and make changes. Anyway, I will save it. And now you can see where P format give it an appropriate name. And you can choose the quality. The default is 75, which should work pretty good. And okay, and do this for all the images. So we have done all the necessary conversions. Let me just keep it in a folder wave P, and paste all the images to the folder. So here are all the images. And here our JPEG. So here you can see the size of all the GPS images, which is above 600 kilobyte. Let me check the size of WebP images. So the WebP images are nearly 2.5 times smaller. Anyway, after converting the images. Let's upload to our WordPress website. Let me close this out and go to WP admin and enter your username and password. Now let's go to media. And let's try to upload images. Again. By default, WordPress does not allow you to upload images. We can't even see them. If I choose all files and tried to upload it, it will display an error as you can see. So in order to enable wear PPE uploads, go to Appearance and Theme Editor, and go to themes function. Scroll down. And all you have to do is copy this code and paste it at the bottom. So this code will automatically work. You do not need to change anything. Simply update file. It's done. So let's go to media. And let's try to upload images. Now you can see these are JPEG and these are wave B. Let me upload them all. If you click on emails, you can also see full preview. And it's YP. So it's the web API as in the URL to. After all medias are uploaded, let's go to the pages and make necessary changes to the images of your site. Let me quickly change the images. Instead of uploading on media, you can directly upload while working on the basis. Also, please make sure that all images have appropriate alt-text. This is for the SEO purposes. Anyway, it's done. So let me update. Let me also clear the cache. And let's analyze the website. So if we scroll down, it simply forgot to change this one. Rest of them has been resolved. Let me quickly change it to and again, analyze the side. Now you can see everything has been resolved even for the deck stop its result. So this is how you can fix next-gen emails and get a better score. This works on both GD matrix and Google pays insights. Thank you very much. 3. Properly Size Images & run old Gtmetrix test: Hello everyone. In today's tutorial, we will quickly learn to find the proper size of the images for your WordPress website. We will also bring back the old GT metric stays, that is legacy reports as Z2 matrix has also switch to the Lighthouse. To get started, let's open our browser. Our demo site is L, it's learned something.com slash demo. Let me quickly open GT matrix.com and analyze a website. If I scroll down, it says properly size, amazes and tells about the images to be resized. But it does not tell us what is the correct size which used to be given by the old GT metrics report. So let's switch our test to all the D matrix and as well find the details of the images that we can resolve it in order to get the old ligase digital metrics, we need to create an account with DD metrics. Simply click on Sign Up, give you details. I will just use dummy names and e-mails. For email. I will use ten-minute email.com, which gives a temporary ten-minute email, but please use a genuine one, give a password. I agree. And create an account. Once the account has been created, simply go to the account. Scroll down. And you can see enable legacy reports done this on. If you want, you can choose it as default as well. And then save settings. The settings have been saved. Since we are using a free version, there is some limitation, that is 50 per week for on-demand test, you can, of course run the previous test. Anyway. Let's again go to GT matrix. If I directly analyze the side, it will use the new lighthouse to use the older one, go to the analyses option and turn legacy report on what is done. Let's again analyze the website. As you can see, this is our old GT metrics report. Now, here's serve skill images, which will give you the required sizes for all the images. You can go through each of the images to find the right dimensions. You can then properly resizes images manually to dimension, height and width, and re-upload to your website. Geometrics, however, recommends to double the size of the image is recommended over here. By decreasing the size of the images. It will also increase your website speed anyway, the old GT matrix also gives you the optimized version of each image. For Wordpress image optimization. You can check the optimized version of the images and also take the original version and compare the difference between images. However, it is recommended to serve images in Nixon format, that is wave B. Please check the other video on how you can manually convert images to wait be using Photoshop or other online tools and upload it to WordPress without using any plug-ins. Let me close this all. So this is how you can take decide on all geometrics. If you want the older report. You can simply turn this legacy option. If it's turned off, it will give the new lighters report as a logged user, you can also choose the countries for the test. However, browser opsins are only for the pro users. You can also customize the connections and then you can analyze the website. So if the legacy report is turned off, the new report will be from the lighthouse. I really hope this lesson was helpful to you. Thank you very much. 4. How to Serve Scaled Images and Optimize images for better GTmetrix score: Hello everyone. In this video tutorial, we will learn how to serve skill images and optimize images for better geometric score without using a plugin, all the updates are done manually. So it's ideal for website with few images. So here the score for search skill images and optimize images is 0. As you can see, the score has been improved. Let's get started by opening our sample website, which is, hell, it's learned something.com slash table. So this is our sample site. Let's check this score adjective metrics. Copy this URL and paste it and taste a website. So as you can see, the score for subscale images is f 0. Optimize images is also f 0. So we are going to improve the score for this. Let's click on service Cal images to understand it briefly. This is the image that needs to be resized. The size of this image is 900 by 1200 pixels. So basically this is the Anyways. So what dd metrics is suggesting us is that instead of serving images of this size, which is big, it has been reduced using CSS or something. We can actually use this smaller images. So if we resize the image and upload what geometric suggests, this issue will be resolved. However, a GT matrix, the best way to do is by doubling what is suggested by digital metrics. So for that, let's open our calculator. So we will resize the image to 387 into two, which is 774. Likewise, 516 into two, which is 1032. So open your photos are or any tool you can use go to File New. So we need an email size of 7741032. Let's create. So this is the ideal size for geometrics. The image link is here, which is opened. Let me save this image. Let's create a folder. Service scale images, and save it. Do it for all the images as required. The first three images are all of same size. Let me save them all. So here are all the images. As you can see, all the recommended size for these images are same. So the fastest way will be dragging them on Photoshop and drop it here. Plays, plays, done implies. So now the image size is double of what was recommended. Let me save them. I replace them and saved at inequality. So the first thing is, is if I look at the pixel size is 774,032. Likewise, let's quickly work on the other images. Doubled the size of the images on Photoshop. All those images have been resized. However, these images are not optimized. To optimize these images, let's open the browser and go to tiny PNG.com. You can drag 20 images at a time, each five MB for free. So I will simply drag the images. You can download all. Let's open the zip file. These are all the optimize images. Let's close this. I will simply drag and replace the other images. So all images are resized and optimized. I will also rename them. It's your call. Anyway. Now let's go to a website dashboard, WP admin. So let me close all this. Log in to the dashboard. Let me check the website. Home-based. Please note every base builder maybe different as per the theme you use. I will quickly replace the resize and optimize images. So all the images have been replaced. Let me open the URL. As again see, there's not much of a difference. Looks the same. With digital metrics. Let's analyze a website. So now as you can see, serve skilled images is a 100%. Initially we had f. The score now is a 100. So this is how you can serve scale images. Let me close this as is done. Now let's optimize images. There are lots of images to re-optimize, some from Google, which cannot be done. But it matters very lays. The good thing about gt metrics is it shows the original images link, which is this. And then as will give us the optimized version, which is this one. You can check the difference. Now click on the optimized version. This is from Google, can't be optimized, but doesn't play a significant role for the score. Let's focus on other pages. Saved them all in a folder. I will call it optimized images. Give the erases a name and save them. Here are the optimized them is you will have to replace all of them from our existing website. So let's open the website. And then ADT home base. As mentioned earlier, each websites based below will be different. Please change the areas accordingly. So it's done. Let's update pays. Now that all images have been chains, open gt metrics again and run the day is to copy the URL based and analyze. So as you can see, they score has improved. So the optimized score is lot more better. The excellent links are very difficult to optimize, but it has normally a very less impact on this score. So all other home business images have been optimized and the score is 92 from 0. So we have improved the score from this. And this. If you are making your website or updating any pieces with images, you can optimize images simply by going to tiny PNG.com. Wagner images, optimize them and upload it accordingly. You can also use tiny PNG WordPress plug-in, or use smart plug-in for this purpose. Free versions, however, do have some limitations of this lesson was useful. Thank you very much. 5. Recommended FREE plugins for your Website(s): Hello everyone. In this video tutorial, we will use to free plugins to improve the geometric score. Of course, there are loads of free plug-ins, but these plugins have been used by us on many of our websites and it has served us very well. So our sample website is here. Let's learn something dot-coms last demo. So this is the demo website. Let's analyze this core with TD matrix desktop website. So this is the current score. Let's see how much improvement we can bring to this website using free plugins. For that, let's go to the dashboard, WPS admin. Enter your username and password, and go to plug-ins and add new search for a plugin ought to optimize and style it. As you can see, this plugin has more than 1 million uses. Activate the plugin. Now let's go to the settings. I would like to optimize JavaScript code, optimize CSS code, optimize HTML code, and save changes and empty cache. For images. You can use this free CDN, but the free quota expires very soon, so I don't use it much. I would like to lazy load and save images. This requires API is extra, so let's live it. Anyway. After this is done at another plugin, go to plug-ins and add new search for WP rocket. This is the one, lazy load, install it and activated. Go to settings. I like to click on this and then save changes. So let's see the newest score, open G, D matrix. This is the URL of our sample website based and desk. So as you can see, just by using those plugins, the score has improved. For the optimize images. You can do it manually for these images. External links, such as Google maps can be done. Here's the optimized version. You can replace them on the website. For add expires. Extolling such as Cloud via Google funds, Facebook, etc, can be optimized easily. For the cookie Free Domain, especially for those using Cloud phi, like this one will normally have this issue. We can resolve this by getting a new domain and then changing the WP Content shores of ever personally, I don't worry much about it. And as we'll face Couple of issues, so I'll ignore it. So anyway, just by using those two plugins, you can improve the score. This was the old score. As you can see, the score has drastically improved. Please note, if we are too much of external links, such as Facebook, as Google, YouTube is extra, These will be very difficult to optimize. These are from Google Ads, YouTube, et cetera. So one be easy at all anyway. But you can see using this plug-in, the score will be improved. I've tried this on many websites and it has given a positive result. I hope this lesson was useful. Thank you very much. 6. Enable SVG, WebP, and ICO upload on your WordPress website: Greetings everyone. In today's tutorial, we will learn how you can enable SBC way be an ICU upload on your WordPress website using missing no plugin. Wordpress does not allow uploading these files, but all this serve better quality at lower sizes. Additionally, all populists light scanner suggest to serve images in Nixon format. If a Google, what is serve images in Nixon format? You can see the most common file for it is wave P, which workers does not allow to upload. So let's enable this to start with. Let's go to the dashboard of our sample website and let's learn something.com slash demo into the credentials. Now, I am in the WordPress dashboard for this tutorial, I already have all three formats, images ready? We have dot ICU images, SVC, and wave P. Let me try to upload them first. Go to Media, Add New select files. So by default, you cannot see YP and SVC images. Please note, some servers do allow ICO files while some dont let us change to all files. So now all files are visible. Let's try to upload them. So you cannot upload any of these even ICO files due to security reasons. Now to enable the upload and go to Plugins and Add New and search for enable asp, easy way P and ICU upload. Install Now and activate the plugin. After the plugin is activated, go to the settings and choose what you don't want to enable. By default, all are enabled and we'll leave it like that and save changes. Now let's go to Media, Add New and select files. And they, you can see all the images. Let's try to upload them. And it works all great with previews of this lesson was helpful. Thank you very much. 7. How to Preload Key requests - Google PageSpeed Insights: Greetings everyone. In today's material, we will quickly learn how to fix preload key requests on a WordPress website. We will do it manually, that is, using a code and with a free website optimization plugin auto optimize. Basically from this, Do the past audit like this. So let's get started. Let's open our browser and go to our demo site, which is, it's learned something dark homes last table. This is just a demo theme from n-fold. Anyway, let's run the Google base speed test. Click here, and then let's analyze the website. If I scroll down, you can see preload key request for these particular TDF fund. This is a mobile analyses. Let's check the digital version. You can see there's pre-load key request. Please note in this tutorial, we will only focus on preload queue request, and not others. Anyway, let us fix this. In order to fix it, you need to login to your WordPress dashboard, that is WP admin. Enter the credentials. Once you are in the dashboard, go to Appearance and team a deta, and go do functions.php. Now you need to scroll down and copy this code. This code will be provided. Simply copy this and paste it at the bottom. After this, we need to add a specific link over here. So go to the inside. This is the one. Right-click on it and click on the Copy link address and go to functions.php and then simply paste it Control plus v. And you can remove the website URL, keeping from slash WP das contained. Basically like this. After this is done, all you need to do is update the file. So it's updated. Now again, analyze the website. The site score seems improved. Anyway, scroll down. There are no preload key requests as against C. And if I look into the past audits, so you can see preload key requests over past audits. This was for the mobile. Let's check the depth of analysis. There are no preload request. And if I look at the past audits, So here is it. We can see it is in the past audits. So this is how you can do it manually. Now suppose if you have W0 ff file to preload, all you have to do is copy the same link over here after the URL, simply replace this fund. Last week, I WO, F2 for w OFF. So that's about it and you need to update the file. So this is by using the codes manually. Let me remove this code and update the file. It's done. Let me quickly analyze aside. If I scroll down. So preload keys are again here, which needs to be resolved. Now the other way of fixing it is by using a plug-in. If you already haven't, then we recommend using the auto optimized plugin. This works great for the WordPress websites speed and optimization. And as well, we'll resolve preload keys request. If you already have the auto optimized plugin, then it's very simple to fix it. If you did not, then go to plugins, add new, and search for auto optimize. So this is the plug-in. Simply install it and activate. Plugin has been activated. Let me close this all. Click on settings. So with auto optimized, there are lots of settings to improve the website speed. We have been using this plug-in for quite a long time. Anyway. I will not go into the details, but you can do these simple settings. Take on optimized JavaScript, tick on optimized CSS, optimize as HTML and save changes and empty cache. These sittings should improve your site's score. But please double-check your website if anything has been broken, usually it does not. But please double-check anyway for preload key's requests and go to extra. And here you can see preload specific request. In our case, this is the link. Simply copy the link address and paste it here. Sorry, not here, but here. As it says, if there are other preload request, you can simply add them and use a comma to separate them, just like this. So after this, Save Changes and don't forget to delete the cache. Once it's done. Let's again analyze the site. So you can see this score has also improved for both Next up and mobile. And just a reminder, after optimizing codes, please do check your site if there are any issues, you can simply untick the options one by one. Anyway, let me scroll down. So the earlier preload request is gone. But you can see this another one. Again. Then copy the link address and then add it here, separate it with a comma, and save changes. Again, clear, catchy. And let us check the website again. And allies. So the score also has improved and preload request is gone. Let me check on past audits. So it's all done for mobile and even for the deck stuff. So it's fixed to further dig stuff. So this is how you can fix preload keys request manually with codes and ought to optimize plug-in. Please remember, while optimizing the JavaScript, the CSS code as HTML code. After saving changes, please check your website if it's working All good or not for us. If I check the website, it's working All good. I hope you learned something new. Thank you very much. 8. How to improve Add Expires headers score on GTmetrix using .htaccess (no plugin): Hi guys. Today we will learn how we can improve at expires headers score on G D matrix using dot SSD access. For that, let's open the browser and go to GT matrix.com. This is it. The website we are going to test? Is this one. I will just copy the URL and run the desk. As you can see, the YSlow add expires, headers score is 0. We are going to improve this score by simply adding some lines in the dot as d axis. So let's go to the dashboard of this website, slash WP DSM into your username and password. Go to plug-ins. We will be using WP File Manager to access the files. If you don't have this, go to Add New such File Manager installed and activated. Anyway, after this, you can simply go to WP File Manager and look for dot SSD access file. Right-click on it and click on code editor. So I have the code here. Simply copy this code will be provided and paste it over here. Above you. Below this mixture is vested in the right place. Save changes. Please note you do not need WP File Manager to access dot SCSS files. It can also be accessed via cPanel or file manager. Also understand that if you make any mistakes here, the site may not work. So you will have to access cPanel File Manager and look at your website and make changes to the dot as d access file. Please make sure that this is opened and closed. Opened and closed. That is the only thing you have to keep in consideration. This is done. Now let's get back to Judy matrix. In fact, let's open it in new browser. Copy the URL of the website, and taste the site. As you can see, the score has improved. This was the old score. The old score for leverage browser caching. It has also improved. For YSlow, it's 89, which was 0. Please note that this code will not do anything to Google services, alcohol, coffee. If you are using Google Adsense, YouTube, Google funds, etcetera, this may not be changed. Anything that comes from your website will possibly be improved. You would not need any plug-in to do this. Hope you enjoyed the relation. Thank you very much. 9. How to correctly configure Cache as recommended by GTmetrix (aso a tip for Cloudflare users): Hello everyone. Today we will learn how we can correctly configure a catchy as recommended by the duty metrics. And there's a tip for cloud FE uses as well. So for that, let's go to the WordPress Dashboard. Wps admin. Enter your username and password. Go to Plugins, Add New. Search for WP fastest scattering. So this is the plug-in we are using. With more than 1 million active users, install the plugin. Activated. After the plugin is activated, Go to the savings. This space needs to be configured. So let's open GT metric space. This is the configuration recommended by G2 metrics, as you can see here, other useful things as well, if you want to check that later. So here's the sitting C1 to make tick what is recommended by duty metrics. And select, as mentioned. For those using Cloud fear. Click on CDN and go to CDN by cloud FE, human need to get an API key for it. So login to your cloud video count, cloudflare.com. Login into your username and password. Click here and go to my profile. Click on API tokens, and click on global API key into your password and make the verification. Here's your API. Simply copied this and pasted here. Use the same email address you have used with cafe. Click on Next, Next again, Next. And then Finish. If for any case you want to revoke the configuration, click here and remove the integration. As you can see, it's gone. To reconfigure, follow the earliest steps. Thank you very much. 10. How to improve the GTmetrix score for  Defer parsing of JavaScript: Hello everyone. In this video tutorial, you will learn to improve the GD metric score for default parsing of JavaScript using simple quotes on Francis dot PHP. We will only be focusing on defer parsing of JS and will not be using any plugins. However, there's a plug-in citation at the end if this goat does not work for you. So as you can see, this is the current score for our website, f 0. We will be improving the score using simple codes. Here. The scores improved to 90 to 892. As you can say. Let's get started opening our browser and our demo website, which is here, let's learn something dark arms last table. So this is our website. It's the default theme from Wilco. Nothing has been changed. Now let's open gt metrics. Copy this URL and basically to analyze. So as you can see, the default parsing of GAS score is very bad. That is 0, f, we will be improving the score for this, as mentioned earlier, this tutorial is only for JavaScript score. We will let alone how to serve skilled images and optimize images, et cetera. But for now, let's only focus on GAS score. Anyway. In order to improve the score. Let's go to the dashboard of our website, WP it as admin. Then enter your username and password. Please note, we are not using any plugins to improve the GAS score. So let's go to Appearance and theme editor. And go to Themes, functions, functions dot PHP. I'm not using a child theme for anyone using child theme will also do the same. Going to appearance and themes editor like this one. Also note if you're using the colon parent theme, this might be Gone With The theme is updated, so better use a child's limb. But since this is for the demo purpose, I am using it on the main theme, Francis dot PHP. Anyway, scroll down the first dot PHP file. Here's a very simple quote for that, which will be provided. Copy this and then paste it at the bottom. Please make sure you have copied the code from this end to this end. Anything in between closing and opening of slabs and asterix are only nodes. Update file. So the file has been AT did successfully. If you are not allowed to add quotes to function dot PHP from here, you might have to use a cPanel, go to file manager, look at your website files and find the functions dot PHP inside your themes folder, and add the code over there. So now let me open gt metrics in new base. And then for the website URL, copy this. I haven't closed this. Simply paste it and let's test the website. As you can see, the default parsing of JavaScript score has improved to a 92, which is pretty good. So this was our old score. As you know, it was f, And now it has improved to a with 92. So this is how you can improve the GAS score by adding a very simple code in your thieves connoisseurs dot b at v. After adding the code, please check your website because if anything is messed up, you can always revert back by deleting the code. The other method is you can also use a plugin called AP sync JavaScript. If this code did not work for you, you can use a plugin absent JavaScript forward risk. This is the plugin. You can try installing it and activating it. I personally had many such broken, so I had to install this plugin. But definitely, you can give it a try. You can see it has a good ratings and there are more than 1000 downloads. So do give it a try and let us know. Hope it was a good license for you. Thank you very much. 11. How to resolve critical error or 500 internal server errors while using the codes?: Hello everyone. In this video tutorial, you will learn how to regain access to your website if in case there's any Iran dot S dx's file or functions dark BHB. So basically some arrows like this, critical era or either 50, five internal server error. These are normally caused by some mistake codes on dot S dx's file or fonts dot PHP. Let's get started by opening the browser and going to the dashboard, that is WBD S admin, enter your username and password. And the earlier tutorial we added, add expire haters quote via WP File Manager. Lets go to WP file manager. This is the dot as the access file where we added the code for add x-bar Haidt is right-click and edit code editor. Let's suppose we made a mistake here while adding the add x-bar haters code. Assume we forgot to copy this bracket. So if we save this and try to open our website, we will receive Internal Server eater. Now since we already have made a mistake, we cannot even log back to our dashboard. Like if I go to the dashboard, there's an error. I cannot revert back and save this as well. So basically, I lose control of the website. In order to get back to the site, we need to access the files either via cPanel or after B. So let's go to our cPanel. Enter your username and password and login. After login to your cPanel, go to file manager, and then look at where your website files are, usually under public underscore HTML, or it could also be outside somewhere. Find it. So this is all of our website files, dot txt files is not visible here. So go to Settings and click on. So hidden files. So dot as the XES file, easier, right-click, unaided, click on Edit. So as you know, I missed a bracket. So if I add one here and Save Changes and then try to open the website, it's working fine. I can even log into the dashboard. If I refresh this. As you can see, I can easily log in. So this is when, you know where you made the mistake. Suppose this is the mistake and you completely do not know where the IRA was. I close this. Now the site one we work in. In this case, you can do is simply download and backup SESS file for safety purposes. And really me to like dot SCSS one. After doing this, what happens is the website will automatically create another dot x dx as file. However, all codes will be God. If I open the side, it's working all good. You can login to your dashboard or WAV file manager, etc. So if we do not know the era, this is the trick. New SESS file will be created after some time. So you can edit the all SESS file and identify the mistake. So this info are already normally there. Remember this opening and closing. These are normally there. These are the codes we added four x-bar head is, if you are not sure where the e-reader was, simply open the expire haters code, copy them and replace them. What do you need to make sure is this is open and this is closed. Likewise, this is open. This is closed, opened and closed. Save changes. I will just rename it to dot SDSS and try to open the website. And it's working normally after renaming or deleting dot docx file, the website, we'll create another one after some time. So this might replace the one and override all the codes if you added new SESS file immediately. So double-check and later make the changes with the backup if required. The other case could be either Infosys dot PHP. If I go to appearance and themes editor. And foxes dot PHP. If I made a mistake here, normally function dot PHP will not take wrong goods. However, in some circumstances, let's go to finance dot PHP via File Manager. Wp does contain themes, and it could be either parent theme or child theme, depending what you are using open paren theme. And here you can see foxes dot PHP. So if I edit this and find the mistake and code and save it, the website will work. But if you're not sure what mistake it is, first, backup by downloading it and replace it by your themes from x1 dot PHP. Let me make a mistake here. Open it first and then add a wrong code. Unsaved changes. Then open the website. Is the ear. The site one work because of this critical era. For this example, you know where the mistake is, so you can rectify it as we exactly know. But sometimes we may not know the mistake. Let me close this. Keep a copy of function dot PHP file. Always have a backup before doing anything. Now whatever theme you are using, in my case, this is a theme I'm using. If I scroll down, here's my themes proxy dot BHP, I will drag it to the next up. So this is my themes default function dot PHP, renamed the old fox dot PHP. And now upload the themes default function dot PHP. And then go back to my website and refresh it. It's working fine. And now what you need to do is compare the old fox dot PHP with the themes default and add goods added by your designer from the old to new one. You can also edit it. And if there are any wrong codes, for instance, if I have this, look for the syntax euro and then make a corrections as required. So this is how you can gain access to the website for eras while copying, add expires, or defer parsing for GS goods. I hope this was a good lesson for you. Thank you very much.