Speed up your Divi website without breaking it. For Desktop AND for Mobile! Your Divi website needs speed for conversion, SEO and your own personal frustration!
👇🏻👇🏻👇🏻 Start here 👇🏻👇🏻👇🏻
Do you want to support my channel? Leave a like or buy Divi with 20% discount via the link below. That will help me enormously to create these free videos for you and keep going!
⇒ Software that I recommend:
Best Divi Caching plugin ⇒https://wpressdoctor.com/caching/
Get Divi with 20% discount ⇒ https://wpressdoctor.com/getdivi/
Hosting used for this video ⇒ https://wpressdoctor.com/nr1webhosting/
I want you to succeed with your website, so lets get started.
0:00 Speed Up Divi Website – Intro
0:10 Test tools we are using:
0:19 Google PageSpeed Insights ➜ https://pagespeed.web.dev/
GTMetrix ➜ https://gtmetrix.com/
0:44 Pingdom Website Speed Test ➜ https://tools.pingdom.com/
3:07 Step 1: Get #1 speed plugin ➜ https://wpressdoctor.com/caching/
4:26 Upload plugin to WordPress
4:38 Setting up plugin with live Speed tests with every change
14:24 Step 2: Remove unused plugins
15:41 Step 3: Optimising Images
19:53 Optimising Mobile Score
21:57 Step 4: Routing Website Through CloudFlare
27:04 Step 5: Change hosting https://wpressdoctor.com/nr1webhosting/
Thank you for watching 😀
N -obody likes a slow website, so i’m going to help you out in just five simple steps.
The first thing of course is to see how fast this website is without changing anything. For that we are using three different tools and we’re gonna check them multiple times during this tutorial. The first thing you do you go to Pagespeed Insights. if you don’t know where it is just follow the link in the description of this video, and you just fill in your website and press analyze. All right, while it is working on its performance test, we’re gonna fill it out on another tool. Which is called GTMetrix. Also – link is in the description. Just enter your url of your website again – divi-doctor.com – and press ‘Test your site’. While it is running we’re going to the third testing tool. Which is called Pingdom. Your website right there, and press ‘Start test’. All right the first test has been completed if we now scroll down, they say there’s no data found from actual real user experience. You might have some information right there, but this website doesn’t get any visitors because it is just a tutorial website. So let’s go down and as you can see… oh this is not very good. On mobile we have 26 performance ouch! Let’s watch the desktop version… it’s better. This is just Divi out of the box. It has a 75 performance which is actually okay. I want to be in this green zone. So this is our baseline. These are results of our GTMetrix score. It actually scores okay. And last but not least of course the Pingdom test. These are the results of our Pingdom test. A 71 a pretty big page size and the load time is actually pretty high: 4 seconds to load! This cannot be right. Alright so log into your WordPress dashboard and let’s start optimizing. The first thing we’re going to do is we’re going to install a caching plugin. As you can see at my plugins I only have two plugins on my website. It is the iThemes Security – there’s a tutorial I created about ‘How to secure your website’ which you should really watch, because securing is really important for your website. And of course I have the Monarch plugin with a few adaptions of my own, you now also see the WhatsApp and Telegram also added to your Monarch. It’s just a simple code you add to your website and then these icons appear and they work flawlessly. So it’s another tutorial so watch this tutorial right there if you’re interested. Let’s get back to our optimizing. You might have a lot of them maybe 30 plugins I don’t know, we’re working with those two. There is no caching plugin enabled whatsoever on this website, apart from Divi’s own optimizing. If you go to ‘Divi’ you go to the options, there is a tab called performance. If you click on this one, your Divi installation should look like this. With everything on if it breaks your website please disable the one you don’t like and see if that solves your problem if not let’s go to the next step and install world’s best caching plugin. You go to WPressDoctor.com/caching and you press enter. And then you go to world’s best caching plugin there is: WPRocket. I”ve tested a lot of them and i’m really convinced that WPRocket is actually the best for Divi. So what we actually need to do is we need to go right there to buy WPRocket, because it actually is a premium plugin which works awesome. What you get for this price? You get one year of support and update for one website. You can also choose the plus version i personally have the infinite version because all my client websites and my 11 own personal websites, are working with WPRocket because I really like the system. So choose whatever license is best for you. If you have one website, this is the best, if you have three website this should do it. And if you have more than five website this is actually better for your wallet. Press ‘Buy WPRocket’.
So fill in all your details and pay with the credit card. Once you have paid you can log into your account using your details we just provided. And now you can see your license and you can go just down there and go to ‘Download WPRocket’. Press that button. Now go back to our website you go to ‘Plugins’ -> ‘Add new plugin’. We press ‘Upload’ and then you select the file we’ve just downloaded from WPRocket and press ‘Install now’. Then we press this button ‘Activate plugin’ and that’s it! And it says WPRocket is good to go. Alright let’s tweak it a bit we go to settings and then you can see the first thing is congratulations your WPRocket
is now activated and already working for you. We’re going to check that out. Preload complete, we can close this message. If you want them to learn from you then press ‘Yes allow’ or press ‘no thanks’. Whatever you want. Right we can close this one. Well they say it’s already working for you, so we are going back to our three tests and run them again.
So the second way to optimize and speed up your website is very important you go to plugins and you go to install plugins and you can see a list of all the plugins that has to be installed on your website you should really deactivate and remove all the plugins you do not use on your website for example all in one seo i use rank matt so we’re gonna remove that one dash notifier hello dolly jet pack oh this is it sounds really fast but it’s not w3 total cache we don’t need it because we have wp rocket woocommerce this is not even a workshop and wp optimize we have wp rocket which is way better and just press book action press deactivate and then delete and we’re going to delete all these plugins we do not use this is how to get rid of all the extra ballast that is not needed on your website if you also have a couple of plugins like insert header code insert header and footer code for example you do not need it when using divi if you want to know if you use every feature from divi please watch my tutorial about things you’re doing wrong with dv because it will really help you out using all the features of divi and maximizing your speed also alright step number three it’s time to optimize our images if you go to media and you go to your library you will see that you have used a lot of images lately on your website and they might be a bit oversized from your website point of view if i for example click on this size and the dimensions are alright and the file size is not very high however you could do even better without losing any quality to do that we will be using a another plugin which is free from wp rocket to do that we go to wp rocket we go to settings and we go to image optimization and then we can install install imagify now imagify is a really cool plugin which really creates new images from your existing images to create them very small without losing any quality so you can’t see it with your bare eyes is great all right the first thing we need to do is we need to sign up because it is free to get our api key and then we can configure it so let’s sign up and your email address it is the wpres and we press sign up and now we have a api key so we press ok go to your email and you get an email like this welcome to imagify and here you can see your api key so let’s copy this one then we go back to wordpress and we press i have my api key we paste it in we press connect me congratulations alright and then we go to settings it’s that easy yes it is that easy all right we have three optimization levels we have normal aggressive and ultra i would not suggest to use ultra because it’s a bit extreme maybe so let’s use aggressive how to optimize it back up original images and let’s go down right here
Now we want to use w uh we we want to use webp images because they are just really smaller so we’re going to activate this one use picture text preferred and we don’t have cdn so that’s okay press save and go to bug optimizer let’s get this over with and the only thing you have to do right now is press this button imagine final and we’ll see that it’s going as you can see we’re on the free plan right now of magifi we have still 100 space credits left and if you start the optimization we will see how much credit it will cost for only 22 images i don’t think a lot.
So you can also see some details down here if you press few details you can see what they are optimizing right now and what they’ve already optimized so if you’re wondering if you need to buy credits for a magifi just press what plan do i need and then they actually calculate what is the best choice for you isn’t that awesome so they said you currently have 19 mbs of images you upload around 20 kilobytes of images per month because i don’t know upload anything to my website they say the free plan is enough to optimize your images that’s very nice of them thank you very much imagine i will keep it this way if you optimize a lot of images to your website you can actually buy this version and then you have five dollars per month and if you pay yearly then you get two months for free this is very interesting if you have a blog and you’re uploading a lot of images to your website every single month and now we see well done you have saved 1.90 megabytes out of 2.71 megabytes that’s that seems like uh not very much but it actually helps really reducing the size on our website we have zero space credit left so that’s pretty good we are just completely
uh and that’s pretty good because we have optimized all our images which haven’t been optimized already and now we see what it does to our scores we’re going to analyze page speeds insights again and also the gt metrics again and ping them once more well the desktop is already very high so the mobile score on google doesn’t seem to get really high because of the first content full paint and if you scroll down you can see actually what’s happening they have an empty screen and then the images comes very laid in you see that so the images must be served in next-gen formats that’s what they say so we go to our homepage to fix this issue once and for all if you now edit your in my example my homepage for example you see that our mobile fuel this image on the in the background is really making a content shift how are we going to change it well it’s pretty easy just go to the settings of the place where this image is in in my case it is in this column and the background is these images now we can use a different image for our mobile device so you click on this mobile option right there we go to phone and then we’re going to select another image for our phone on a iphone 11 for example this is the image it’s actually being loaded we can actually cut a lot out of this image for our mobile view so we’re going to do just that and the new file i created is just very small especially for mobile and it’s only 40 kilobytes so i think that should do the trick and let’s upload the image all right so let’s see if google and if google page speed loves our mobile view a bit more let’s analyze it again oh wow so now you can see that the performance on mobile is gone up to 94. this is exactly how i wanted to see on desktop it is still 98 it is perfect it couldn’t not almost not get any better and on mobile it’s 94 that is that is a really great uh that’s really awesome i’m i’m happy i’m happy with this thank you wp rocket you have an awesome plug-in there for a magifi it really works great and you see with just a few adjustments on your mobile view you can actually get a very high score on mobile also with divi that is really awesome all right let’s go to the fourth step of the website and for that what you can do is we can route our website through cloudflare now cloudflare is a free tool which you can you write your website through and you can also pay for them for add more options so what do you do you go to cloudflare.com what’s also very awesome is that your website is protected from ddos attacks when you’re routing your website through the cluster system so how do we do we just press sign up right there then you enter your email address the wpressdoctor.com and press create account when you are in your account you can easily add a website right there click on that website and fill in your url without the http so dvductor.com add site and then you can pay for a plan of course but you can also start a free version below it press this one and press continue and then you’re scanning your existing dns records why because they’re going to copy it so that your dns when someone fills out your url is being routed through the cloudflare network so these are all the records that are in right there and i press continue now the thing you have to do is you have to change your name servers if you mess this up your entire website will not work again so if you don’t know what you’re doing please ask your host in this case this website has been hosted on name hero as you can see and we have to change it to this one and this one how we’re going to do that i’m going to log into my name hero account from there i go to domains and then i go to my diviductor.com and i press on this one and then we go to nameservers right there and here you can see custom name servers are from name hero we’re going to copy and paste them from cloudflare click to copy and we’re gonna replace this one and the second one click to copy and replace this one and then we press change name servers all right changes has been saved successfully now our name servers at cloud star has been activated that’s pretty easy then we go back to cloudflare and we press done check our nameservers and press finish later all right now it’s gonna take a while i think a couple of hours before dns settings has been saved through the entire internet it could take actually up to 24 hours so you have to watch this page from cloudflare to see if your website has been added to the cloudflare network once it has been routed you go to wp rocket to go to settings and then you go down and we go to add-ons and then you can actually enable this one use cloudflare you press modify options here you have to fill in your global api key where can you find it well it’s pretty easy if you know where while we’re here we also need the zone id so we’re gonna press copy you go to w rocket and you find you paste your zone id and also your account email that you used at registration with cloudflare so it should be the wpress doctor.com and now for our global api key and when i log back in it’s great news cloudflare is now protecting your site it works so now we’re gonna get our api key go to my profile api tokens right there and we’re gonna press the global api key we press view enter your password then you have to solve a very difficult puzzle choose all the bosses and more buses and press verify then you press view now you can see your api key just copy it paste it in wp rocket and press optimal settings scroll down and press save changes and there’s a couple things changed and there’s a couple things that changed on cloudflare the cache level set to standard minification on rocket loader off and browser cache set to those seconds all right you can close these messages and now you also have cloudflare added to your website well done i’m really proud of you and the biggest question of course is does this actually help in speeding up our website well it definitely does look at those scores so this is the mobile view it’s 96 right now and on desktop it is a blazing amazing 99. this is awesome you almost can’t get any better and also with GTMetrix a flipping 100 and 99 structure and also a 655 millisecond to load our website and of course i’m curious does everything works that is intended yes it actually works and if i scroll down you can see that all my options are still in there all the effects everything works as intended but this website is just amazingly blazing fast so if you retest it from your home you will see the exact same scores please do so so you know i’m not making fun of or anything it is the absolute truth.
So the fifth and last step is actually pretty obvious if you don’t see the same results i’m having right here with this website uh with my hosting company then you really should thinking about changing your hosting company i don’t know your budget i don’t you know your money but if you follow the link in the description of this video you will get a discount for name hero which is a perfectly hosting company in the first three years you’re not paying a lot for your website it’s really amazing so you should really follow my tutorial around here how to set up a name here hosting and you can actually move your website to name hero to get the same speed results because your website matters and your speed also matters a lot to your website visitors alright guys that’s basically it i hope your website speed has gone up please tell me in the comments if you did hit that like button if i helped you out subscribe if you want to see more videos about wordpress divi and other cool stuff and i’ll see you around in the next video have a awesome day.