In order to embed videos from youtube, you can either just copy the link and paste it into your post, and it will work with no issues, or copy the iframe code:
To make this work, we need the code, if not we will have nothig to work with, nothing to alter.
So please embed your preferred videos by using the iframe code.
The next step is, of course, to alter this code. You have to be in your 'text' mode in your editor, not in 'visual'. You can sellect in the top right side of the WP editor. This is simple, here's how to do it:
This is original code:
And a bit of zoom:
And here it is altered:
Zoomed:
What we've done? We added src="" data- right before src="whateveryoutubelink"
Do it exactly, this is a code! You see, it is a space before src="" and a space between src="" and data-
Leaving src="" empty, as you see is nothing between """ (before altering was the youtube link), will erase the 'must' for video to load in the same time with the page ;)
This is all, insert the code from previous page in the theme footer and, after that, alter the code as showing above :)
Let's go to the next page for results ...
Join the Discussion
ChrystopherJ
Premium Plus
This is a really good attempt at not using a plugin, unfortunately, this code is still running on every single page, just like a plugin would. However, with SitePlus+ Caching turned on, neither this option or the plugin option will affect page load time, as the files have already been flattened and cached. Also, you should never directly edit your themes files, especially header.php, footer.php and functions.php (unless it’s is a child theme), as you will lose the changes when the theme updates or if you change your theme. If you don’t want this code to be actioned via a lazy load plugin, image optimisation or caching plugin, you can place it in to the Headers & Footers Plugin or the Ad Inserter Plugin, as most members will have the later installed, especially if they are using Google AdSense.
Reply
condruzmf
Premium
Hey Chrystopher,
Allow me not to agree :) If the theme updates, then rewrite the code, it is less than a minute work, as the code in your embed videos in your post is already set.
About direct editing the theme code, I was very specific about where and how to do it - so there is no issue.
I didn't mention that it is highly recommended to backup the site (tools - export - all content) before doing any modification in the code, I will do it now - just in case. My bad, I supposed everyone knows that :))
About SitePlus+ I don't know what happens with that setting - really. Because I indeed increase speed after using this JavaScript to lazyload videos.
Maybe, in theory, you are right!
But in fact, after I used this solution:
Pagespeed insights, Neil Patel Ubersuggest and SemRush show the improvement with site speed. A good one!
So, you see, I can not agree with you. Only in theory I can do that (WA it is indeed doing a good job with minifying) but practically - I am right!
About the plugins you mentioned ... Do not use plugins!!!
Unless necessary ;) :))
Thanks mate, but If going with the idea of not using plugins ... then this is my solution.
Allow me not to agree :) If the theme updates, then rewrite the code, it is less than a minute work, as the code in your embed videos in your post is already set.
About direct editing the theme code, I was very specific about where and how to do it - so there is no issue.
I didn't mention that it is highly recommended to backup the site (tools - export - all content) before doing any modification in the code, I will do it now - just in case. My bad, I supposed everyone knows that :))
About SitePlus+ I don't know what happens with that setting - really. Because I indeed increase speed after using this JavaScript to lazyload videos.
Maybe, in theory, you are right!
But in fact, after I used this solution:
Pagespeed insights, Neil Patel Ubersuggest and SemRush show the improvement with site speed. A good one!
So, you see, I can not agree with you. Only in theory I can do that (WA it is indeed doing a good job with minifying) but practically - I am right!
About the plugins you mentioned ... Do not use plugins!!!
Unless necessary ;) :))
Thanks mate, but If going with the idea of not using plugins ... then this is my solution.
condruzmf
Premium
Thanks again, I updated the first page with the backup suggestion.
Without your comment here, I might have been in trouble :)
Without your comment here, I might have been in trouble :)
ChrystopherJ
Premium Plus
Just to be clear, I never said your solution doesn’t work, the JavaScript does work in lazy loading your iframe’s.
What I was pointing out, is that you mention a plugin version would run on every single page as it has no idea how to determine which pages contain iframe’s. But this JavaScript is being applied to every single page via the common global footer.
Realistically, how many members will remember to re-add the code after the theme updates or is changed with another theme?
Also, the backup option using the built in export feature does not backup your whole website.
Using WA’s SitePlus+ Cache, or even a cache plugin, generates flat HTML files, meaning that PHP is not involved in processing all of the WordPress functions/code, therefore plugins do not affect the page load time. What does affect page load time is the excess CSS & JS files that are loaded by some plugins. Lazy load plugins do not load any CSS files, and some methods don’t use JS.
I don’t mean to get in to a heated debate over this, I actually commended you on a great attempt at achieving this without a plugin. It’s just unfortunate that this method will not work for 95% of members here, as they might be able to get their head around it the first time, but in a few months, they’ll forget that they added the code, the theme will update, and they’ll be scratching their head as to why their website is running slow again.
Compared to the time and effort you have to put in to get this to work and to maintain it, and considering their is no page speed improvement compared to using a plugin, then a plugin is the way to go for this solution.
Or, as I mentioned before, you can insert the code via a plugin such as the Headers & Footers or Ad Inserter.
I’m all for reducing the number of plugins you use, but they need to be the right plugins. A website with 10 plugins compared to 5 will not be any slower, especially as a cache system is in place. Unless those plugins are loading excess and render blocking CSS & JS.
I don’t mean any offence by these comments, just shedding some light on the situation.
What I was pointing out, is that you mention a plugin version would run on every single page as it has no idea how to determine which pages contain iframe’s. But this JavaScript is being applied to every single page via the common global footer.
Realistically, how many members will remember to re-add the code after the theme updates or is changed with another theme?
Also, the backup option using the built in export feature does not backup your whole website.
Using WA’s SitePlus+ Cache, or even a cache plugin, generates flat HTML files, meaning that PHP is not involved in processing all of the WordPress functions/code, therefore plugins do not affect the page load time. What does affect page load time is the excess CSS & JS files that are loaded by some plugins. Lazy load plugins do not load any CSS files, and some methods don’t use JS.
I don’t mean to get in to a heated debate over this, I actually commended you on a great attempt at achieving this without a plugin. It’s just unfortunate that this method will not work for 95% of members here, as they might be able to get their head around it the first time, but in a few months, they’ll forget that they added the code, the theme will update, and they’ll be scratching their head as to why their website is running slow again.
Compared to the time and effort you have to put in to get this to work and to maintain it, and considering their is no page speed improvement compared to using a plugin, then a plugin is the way to go for this solution.
Or, as I mentioned before, you can insert the code via a plugin such as the Headers & Footers or Ad Inserter.
I’m all for reducing the number of plugins you use, but they need to be the right plugins. A website with 10 plugins compared to 5 will not be any slower, especially as a cache system is in place. Unless those plugins are loading excess and render blocking CSS & JS.
I don’t mean any offence by these comments, just shedding some light on the situation.
condruzmf
Premium
I appreciate your thoughts.
Yes, this is not a definitive solution, people need to assume what they are doing.
It is working for me, this is for sure.
Maybe it is my theme (just bought the premium one about 1 month ago)
On my site, even one extra plugin means a lower speed.
Like in this case, I have tried lazy load plugins and my site speed goes down.
Worst, CLS and LCP goes high.
I won LCP by applying this script together with site speed.
CLS is still about 0.3 on all my pages - should be 0.25 at most.
If you know a solution about this issue, I will be very grateful.
I have to mention that all my images and videos have dimensions specifications, so this is not the issue.
They are indeed loading without shifting the text.
This happens in the same way on posts where I have banners or visual adds from Amazon, and posts without adds.
I am concluding that the ads are not the issue (I have dimensions defined on those too)
I am thinking ... maybe the fonts?
I am digging into this right now.
If you can advise, please do so.
I am in need :))
Thanks mate!
Yes, this is not a definitive solution, people need to assume what they are doing.
It is working for me, this is for sure.
Maybe it is my theme (just bought the premium one about 1 month ago)
On my site, even one extra plugin means a lower speed.
Like in this case, I have tried lazy load plugins and my site speed goes down.
Worst, CLS and LCP goes high.
I won LCP by applying this script together with site speed.
CLS is still about 0.3 on all my pages - should be 0.25 at most.
If you know a solution about this issue, I will be very grateful.
I have to mention that all my images and videos have dimensions specifications, so this is not the issue.
They are indeed loading without shifting the text.
This happens in the same way on posts where I have banners or visual adds from Amazon, and posts without adds.
I am concluding that the ads are not the issue (I have dimensions defined on those too)
I am thinking ... maybe the fonts?
I am digging into this right now.
If you can advise, please do so.
I am in need :))
Thanks mate!
ChrystopherJ
Premium Plus
It’s almost 1am here, but if you want to PM your website, I’ll take a look tomorrow :-)
OCH3943
Premium Plus
Can you help to perhaps adding abit more screenshots where do I add this Javascript?
I am not exactly sure where, though I believe the answer is in this statement "You’ll want to add this to a .js file and enqueue it along with the rest of your Javascript files in functions.php."
But a screenshot on this may help the less tech-savvy people on knowing where to add the codes.
I am not exactly sure where, though I believe the answer is in this statement "You’ll want to add this to a .js file and enqueue it along with the rest of your Javascript files in functions.php."
But a screenshot on this may help the less tech-savvy people on knowing where to add the codes.
condruzmf
Premium
mollygranger
Premium
This is great information. I plan on using a few YouTube videos and this information will be very useful. Thank you.
Molly G
Molly G
