Less bells and whistles is more #WordPressOptimization #SpeedUpWordPress #OptimizeWordPress

Better design, faster production, and easier development has led to poor WordPress optimization. This article is designed to show you 29 tips for optimizing the speed of your WordPress website.

We will start with basic caching options, resizing images properly, compressing images and connecting to a content delivery network (CDN) for a complete optimization overall.

Many of the tools that we use are professional WordPress caching plug-ins. We expect to spend some money to achieve faster load times. Our preferred optimization plugins are Imagify and WP Rocket combined with MaxCDN. However The biggest improvements to WordPress optimization come from technique‘s.

Best techniques to increase WordPress Optimization

The biggest improvement to WordPress optimization comes from resizing images properly. By referencing an image size guide by columns we can scale images correctly.

Google does not necessarily reduce your page rankings because of slow performance. However, they will not rank your website as high as it could be. Ironically the second biggest savings in speed come from removing third-party widgets and embeds on the homepage. These include Google Maps, YouTube videos, Facebook widgets and other social media banners. A simple technique is to take a screenshot, place it on the page, and link the screenshot to a new page or the social media account.

So let’s get started with our WordPress optimization tips using WP rocket caching plugin.

File Optmization

WordPress Optimization WP Rocket File Optimization Part 1

In the video you will see we’ve checked the minify HTML combined Google font files and remove query strings from static resources on the CSS. For the JavaScript, if you want to, you can check these but if you experience any issues you want to uncheck them. I’ve already unchecked my minify CSS files. I still have my optimized CSS delivery checked and then on the JavaScript files I’ve unchecked those because I did experience some issues with those.

Cache, Mobile, User, Lifepages

WordPress Optimization WP Rocket Basic Cache Options Part 2

We’re looking at WP rocket basic cache options. On the optimize screen you want to look at your mobile cache. We want to enable caching for mobile devices, and we want to separate the cache files for mobile devices. Under user cache I usually leave this option unchecked. And for the cache lifespan I usually try to follow the 10-hour limit. You can change that to 10 and click Save Changes.

WordPress Optimization WP Rocket Rollback Part 3

We’re looking at how to roll back to a previous version. You’re going to go to your settings for WP rocket and then over on the left side of the second column, you’re going to click on tools. At the very bottom you’ll see your roll back. You can just click this button. This will reinstall the previous version and that’ll roll you back to that version.

Media Settings

WordPress Optimization WP Rocket Media file settings Part 4

Click on WP rocket then media files. So in our media we’re going to turn on lazy load that we’re checking the enable for images enable for iframes and videos I’m leaving off the replace YouTube iframe with the preview image I can do that manually on the site I am disabling the emoji and I’m also disabling the WordPress embeds this is WordPress in 60 seconds or less WordPress optimization with WP rocket media file settings.

CDN

WordPress Optimization WP Rocket CDN settings Part 5

WordPress optimization with WP rocket. We’re looking at our CDN settings here this is very straightforward you’re going to check this box to enable content delivery network. And, then in your CDN CNAME you’re going to put your secure if you have a secure website HTTPS you could have put that secure CNAME into this field here this is an a temporary number that I just made up for them sake of this video so you’re going to put that full number in there if you want to know how to find that secure CNAME to put in there watch our WordPress optimization video on MaxCDN again this is WordPress in 60 seconds or less with WordPress optimization and WP rocket CDN settings.

use the inspector to compare the image size to the natural image size

WordPress Optimization How to check the size of an image being displayed Part 6

How to check the size of an image being displayed. Take your mouse and right-click on the image that you want to check. Click on inspect then when the code comes up you want to hover over the URL of the image and you’ll see a little pop up. This image was originally a natural size of 3000 pixels wide. It’s being displayed in an area that’s only 320 pixels wide. Therefore, you should resize this image down to 320 pixels wide or something close.

How to find the default image sizes you want to go to settings and then media and then on the media settings you can see the different sizes that WordPress will automatically generate when you upload an image these are the default settings so when you upload an image WordPress will automatically create an image that is 150 pixels wide 300 and 1024 if your image is smaller than one of these then it’ll only generate the images that are smaller so this is very useful because once you know what the default sizes are then you can resize the images on your page without doing anything further this is WordPress in 60 seconds or less how to find the default image sizes.

WordPress Optimization find the scaled size of an image Part 8

This is WordPress in 60 seconds or less how to find the scale the size of an image you want to go to your media library click on the image and then you want to click on edit image then over on the right side where it says scale type in one of the default width sizes like 300 and then you can automatically see what the height is gonna be so if this image was resized it would be 300 by 231 the other default size is 1024 and if we did that we could see that the height would be 787 so this is WordPress in 60 seconds or less how to find the scale the size of an image.

WordPress Optimization use a default scaled image URL Part 9

How to use a default scaled image URL you can see here that we’ve got our image module open, and we are going to click and kind of scroll to the end this image is using the default size which is 3000 pixels wide we’re gonna type in a – and then 300 because we know that’s the default width and X, and then we discovered that this particular image is 230 pixels tall and you can see that the preview works so it’s accessing that default generated image it’s a – 300 X 231 this is WordPress in 60 seconds or less WordPress optimization how to use a default scaled image URL

use correct image sizes

WordPress Optimization Divi image size guide Part 10

WordPress optimization – image size guide if you Google the image size guide you will find elegant themes ultimate guide to using images with Divi once you find the article scroll down till you see the chart on the columns which is here and this will tell you exactly how many pixels wide an image should be based on the number of columns that you are using in your layout so for example earlier in our tutorials we were using a one third column which recommended at 320 pixel wide image by default WordPress generates a 300 pixel wide image so you could use those 300 pixel wide images in a 3 column that would not fill the column that would be real close and it would be more optimized than just using the default image size. view the image guide

WordPress Optimization creating additional default image sizes Part 11

WordPress optimization – creating additional default image sizes install the plugins simple image sizes and then click on settings then click on add new size of thumbnail add your name and click on validate image size name then in the max width type in your maximum width I’m using 510 by 300 for my Divi layout and then I’m going to tell it to crop it from the center and click validate.

optimize theme files

WordPress Optimization optimize theme images with imagify Part 12

WordPress optimization – how to optimize theme images with imagify. We’ve already got the plug-in installed we’re gonna scroll down and go to settings then imagify once we’re on the imagify settings page we’re going to scroll down and on the right side we’re gonna click the button next to add the themes to optimization and you can see once we’ve done that it’s added my Divi theme and my Divi child theme to the optimization we’re gonna scroll down and click Save and go to bulk optimization.

WordPress Optimization use imagify to optimize a library image Part 13

WordPress optimization – how to use Imagify to optimize a library image You’re gonna go down to the media and then click on library what’s the library load you’re gonna look to the right and you should see a button for each image that says optimized just simply click the blue button that says optimized and the optimization shall occur and imagify will do the rest this is WordPress in 60 seconds or less WordPress optimization how to use and imagify to optimize a library.

WordPress Optimization Restore original image size using Imagify Part 14

WordPress optimization – how to restore the original image size using a Imagify. You are going to go to media and then click on library. Once your media library loads on the far right side for an image that’s already been optimized you can look over underneath the bottom and it’ll say restore original you can click that and then it’ll be restored this is WordPress in 60 seconds or less WordPress optimization how to restore the original image size using Imagify.

WordPress Optimization Imagify re-optimizing theme images to another compression level Part 15

Over on the left side you want to go to media and then click on bulk optimization scroll down the page make sure that custom folders is checked and then over on the right side you can change your compression level I’m going to change mine to ultra and then at the very bottom I’m going to click imagify them all there we go so this is WordPress in 60 seconds or less WordPress optimization. Re-optimizing theme images to another compression.

WordPress Optimization Removing youtube videos from the homepage Part 16

In this particular case the YouTube video as you can see from the GT metrics is 1.1 MBs for the JavaScript file so there’s the dot js 1.1 MBs with that sitting on the home page it slows down the speed of the website so what you can do is take a screenshot of the YouTube video and then place it on the home page and then link it to a different page where you can embed the YouTube video maybe even make it bigger that way the home page can load faster.

WordPress Optimization Removing google maps from the homepage Part 17

Here I’ve compared two interior pages of a website and you can see that the one on the right has a Google map placed on it. This page took over seven and a half seconds to load which was over four seconds longer than the page with the YouTube video so on the home page there’s a map here at the bottom of the page and what we did was took a screen shot and replaced it with an actual image and then we link that to a sub page where we could hopefully the client is gonna take a little bit more time for this page to load but this prevents our home page from loading slowly.

WordPress Optimization Link to your trip advisor page Part 18

WordPress optimization – how to link to your TripAdvisor webpage often times when you get these little certifications and you add them to your home page they include a link to a JavaScript file which adds a lot of weight in time to your home page download so if you take a screenshot and click and drag this you can see that it’s an image if you take a screenshot and you just link it to the page to your TripAdvisor page it’s a lot faster to download the page for your users.

WordPress Optimization remove unused plugins – Part 19

From the dashboard click on plugins your first step is to deactivate the plugins you can do so by clicking on the select box and then using the bulk actions deactivate and click apply then you can click on the inactive category select all the plugins that you wish to remove use the bulk actions to delete and click apply code from unused plugins is downloaded but not used by your website visitors removing these unused plugins will increase your performance.

WordPress Optimization Keep Your WordPress Site Updated Part 20

WordPress optimization keep your WordPress site updated from the dashboard click on updates and you’ll see a little red circle with a number in it indicating how many updates that you have available you could check to make sure you have the latest version of WordPress see if you’re in your plugins need updating and check the status of your theme here you can see we’ve got one plug-in that needs updated I can select all and update plugins keeping your WordPress theme and plugins up to date means everything is working together efficiently and performing well.

WordPress Optimization Split Comments into Pages Part 21

From the dashboard go to settings and then click on discussion under the section other comment settings check the box next to break comments into pages then scroll down and click Save. If you have a lot of comments reducing the number of viewable comments in a post will keep your post loading quickly.

WordPress Optimization Use Excerpts on Homepage and Archives Part 22

From your dashboard, you want to go down to settings and then reading. And towards the bottom of the page you will see, “for each article in a feed show”. And you want to select summary and then click Save Changes. Using excerpts allows you to display a list of post on the home, blog, or archive page without increasing your load time. How to speed up WordPress.

WordPress Optimization Avoid using a slider Part 23

In this example we have a single column with a button underneath. You can also use a two column approach with either an image on one side and text on the other. Multiple pictures in a slideshow however, can reduce your WordPress performance. In addition slideshows can contain heavy JavaScript files in order to function. Avoiding slideshows all together and focusing on a single message with a call to action can increase the speed of your WordPress website and help to generate more leads. How to speed up WordPress.

WordPress Optimization removing unused media Part 24

WordPress optimization, removing unused media reduces your database size. Thus, optimizing your WordPress website. From the dashboard you want to go to media and then library, make sure you’re in list mode. And then in the drop down menu from all media items select “unattached”, then click filter. Sometimes your images say that they’re unattached, but they may be used as a featured image. So, be careful when you are selecting images or media for deletion. I’m going to type into the search search box and search for a specific file type or image, that I know that’s there. And I’ve got one here I’m gonna select it and then select delete permanently.

WordPress Optimization WP DB Manager cleaning database tables Part 25

his reduces the size of your database thus optimizing your WordPress website from the dashboard you want to install the WordPress database plug-in and then go down and click on database you can search your database page by using command or control F and then typing the MB and you can see here that our ithemes security log is up to nine Meg’s we can clean that out so from here you want to go to empty and drop tables over on the Left column we’re gonna click empty over in the right column scroll down and click empty drop if we go back to the database page and scroll to the bottom or scroll down to the same table we can see that we’ve reduced the size from nine Meg’s down to 16 kilobytes.

WordPress Optimization WP DB Manager optimizing database Part 26

WordPress optimization – optimizing database tables reduces the size of your database thus optimizing your WordPress website from the dashboard you want to scroll down and click on database optimized database scroll to the bottom and click optimize.

WordPress Optimization WP DB Manager removing unused database tables Part 27

WordPress optimization, removing unused database tables reduces the size of your database optimizing your WordPress website from the dashboard scroll down and click on a empty/drop tables scroll down until you see different database tables prefixes verify the prefix that you are using for your website either via FTP or your WP config file and then drop the database tables that you’re not using in this case I’m dropping all the default ones that start with the WP underscore once I’ve selected my database tables to drop. I’m gonna click the empty drop button at the bottom removing the unused database tables also helps your website be more secure by reducing the areas that a hacker can access or hide files.

WordPress Optimization Check Your PHP version Part 28

Upgrading to PHP version 7 will decrease the read/write time while using less memory. PHP 7 is about 3x faster than PHP 5.6 Install the “Display PHP Version” plugin, look on the dashboard to see what version you have. If you have c-panel you can log in an upgrade your PHP yourself. If you don’t have c-panel access you can call your host and they will most likely do it for you for free.

WordPress Optimization hosting does matter Part 29

Choosing a good hosting provider is the first step towards having a good performing website. Increasing the performance of a website that is hosted on a slow server is limited to the performance of that server. If you are doing this yourself then check out a list of performance hosting providers at https://hostingfacts.com If you are not a DIY then check out Shepherds Loft.

WordPress Optimization optimization results Part 30

Optimizing your WordPress website in the previous videos I showed you how to remove un-attached media and also how to optimize your database. So we’re going to go back to our database table plug-in. We’re going to scroll down and click on database. We’ll go to the bottom of the page and you can see that our current size of our database is 27 Meg’s previously it was 55 Meg’s according to the database plug-in. In our management tool you’re gonna come over and you can see that our database table was roughly 32 Meg’s according to that plus 490 Meg’s for the files after we optimized the database it was 25 Meg’s and after we removed more media we got the files down to 386 Meg’s

WordPress Optimization is Performance

Optimizing your WordPress website allows it to perform at its best. These tips will help you speed up WordPress website, allowing more customers to see your website and ultimately gain their trust. Learn more about Why you should speed up WordPress.

Share This