Increase Your WordPress Loading Speed With This 2 Plugins [Recommended]

In this article I’ll show you two plugins that I use to increase my WordPress loading speed. You can use this plugins for free.

There are so many plugins out there which you can use to increase your WordPress loading speed, but I’ll show you this two plugins that I have used in some of my blogs.

This plugins will help you to minify your: HTML pages, javascript files, CSS stylesheets, images, and videos.

Content Delivery Network (CDN) which one of the plugins will provide freely for you will help your web page content to load faster to your users no matter the location they are, the browser they are using or the device they are browsing with.

CDN reduces delays in loading web page content by decreasing the physical amount of space between the server and the end user.

I’ll show you a caching plugin which will automatically create temporary storage files in your visitor’s browser when they visit your web page.

This will increase your WordPress loading speed by fetching some information from the user’s browser instead of getting it from your web server.

I’m going to show you a plugin you can use to perfectly lazy load your images, videos, iframes etc. This plugin has animation effects for rendering your lazy load images.

Now let’s dive into the sea of practical’s and secreenshots. ? ?

The Two Plugins I’ll Be Teaching With

1. Autoptimize plugin – This plugin serves as a caching plugin and helps to minify your HTML,CSS, JS & images.
2. Smush Plugin – To lazy load your images, widgets, iframes, contents etc.

I’m going to show you a detailed guideline on how you can properly use this plugins to increase your WordPress loading speed.

I love using optimized screenshots to teach my noble readers. So even if you’re a novice, you will easily grab the knowledge I’m giving out.

Keep reading below!

How To Setup Autoptimize Plugin To Increase WordPress Loading Speed

Step 1: Install Plugin

From your WordPress dashboard, go to Plugins > Add New > serach for “Autoptimize” in the search field provided.

Install and activate the plugin.

Step 2: Customize Plugin

When you have successfully installed and activated the plugin, from your WordPress dashboard > go to Settings > Atoptimize.

To set your JavaScript optimizing successfully, follow the “Check boxes” that I marked in the image below to setup your own plugin.

Step 3: Setup your CSS Options

To properly optimize your CSS using the Autoptimize plugin, follow the checked options in the image below to set yours.

Step 4: Setup HTML Options

Check the two boxes in the “HTML Options” section. See image below

Leave other options such as: CDN Options, Cache Info & Misc Options as default (don’t make any changes here).

Note: Remember to save changes after applying your settings.

Step 5: Image optimization

In the image tab, check the box that ask you to optimize images.

In the Image Optimization quality, set it as “Glossy”. Glossy is the medium size of the optimized images.

Leave other options that asks about lazy loading images empty. Do not thick this boxes. See image below

Note: I’ll use the second plugin to set lazy load for images.

I’m doing this because Autoptimize lazy load settings for images annoys visitors. My visitors complained about the way my images loads; when I was using Autoptimize plugin to lazy load my images.

How To Setup Smush Plugin To Increment WordPress Loading Speed

Step 1: Install Smush Plugin

From your WordPress dashboard, go to Plugins > Add New. Type “Smush” in the search field, then install and activate it.

Step 2: Setup Smush Plugin

From your WordPress dashboard left side menu, look for Smush plugin. It is usually located just above the “collapse menu” selector.

Click on Smush. When it opens, click on Lazy Load located at the left side menu of the Smush plugin.

Use the settings in the below image to setup your Smush plugin

Step 3: Setup your image Display & Animation

Here you can set how you want your lazy loaded images to be displaying to your visitors.

Smush plugin has four (4) options for setting your image display. They are

1. Fade in
2. Spinner
3. Placeholder
4. None

You can choose any of the four listed options to set how your non-loaded images should look like before they display to your visitors.

I recommend using “Fade In” and setting the “Duration” as 200 ms and “Delay” as 500 ms. This display & animation effect has been tested and it looks amazing to visitors.

I’ll use three different images to show you how you can setup your non-loaded images using different styles.

Note: Check caption below each image.

Step 4: Setup Include/Exclude

Here you can disable lazy loading for specific pages, posts or image classes that you wish to prevent lazy loading on.

See image below

Step 5: Save Changes

Leave other Options as default and click on “UPDATE SETTINGS” which is located at the right side of the footer.

Conclusion

By setting up this two plugins successfully, your website will be optimized and your WordPress loading speed will increase.

This two plugins have actually helped me in my WordPress websites. So I decided to share this hack with you.

Spread this knowledge to people that may need it by sharing it.

Also follow us on our social media handles – Facebook, Twitter, Instagram & Pinterest.