0:00
Hello everyone, welcome to Key2Blogging and in this video I will show you how you can
0:04
lazy load your YouTube videos in your blogger website. So, this is a lazy loaded YouTube videos and this is the normal YouTube embedded videos
0:15
So, when you check this two page in PageSpeed Insight, it will show how much YouTube is
0:23
taking the size of the page. So, let's test this page one by one
0:33
So, it will take some time to process this page. So, let's wait
0:44
Alright, as you can see the page score is 20 which is very low and when we scroll down
0:51
and click on the reduce impact of third-party code, as you can see YouTube is taking around
0:57
1.3 KB in the front end and when we check this second page and scroll down and click
1:05
on the reduce impact of third-party code, here YouTube is taking just 26 KB
1:11
So, in this way you can save around 1.3 MB of data in the front end and load your page
1:19
a little bit faster. So, let's check how you can implement this lazy load in your blogger website
1:27
So, first of all, go to the theme section and here click on edit HTML and before changing
1:35
anything make sure to take a backup of your theme. So, in case if you do anything wrong, you can easily restore it back to the original
1:43
position and click on edit HTML. And here note that some theme might added this code before
1:54
So, make sure to check if this code is added to your theme or not
2:00
And if your theme don't have this code, then paste this code just above the closing body tag
2:06
So, copy this code and scroll down to the bottom and here as you can see there is a
2:13
closing body tag. So, paste this code just above it. Now save your theme. OK
2:22
Now, go to the blog post section and click on the post and here you have to add a small
2:30
HTML code inside the blog post. So, here this is the HTML code
2:40
Here you have to replace the video ID of that YouTube video
2:48
Then copy the code and here add a notation like this to know where this video is embedded
3:04
Now paste this code and click on compose view. By default, the video is not shown in this editor, but when we update this video, it
3:15
will show in the front end. So, let's open this page. OK
3:22
As you can see the video is added to your blog post and it is lazy loaded the YouTube videos
3:28
So, when we click on this button, it will start loading this YouTube videos in your
3:34
website and it will save a lot of page size and load your blog post a little bit faster
3:42
So, in this way you can implement the lazy load inside your blog or website
3:49
I hope this short tutorial will help you lazy load your YouTube videos properly
3:54
And if you have any doubt, then you can ask me in the comment section
3:59
And if you really like this video, then hit the thumbs up button and subscribe to my channel
4:04
for more upcoming videos like this. I will see you in the next video