Optimized YouTube Embed Code Generator

YouTube allows you to easily embed any YouTube video into a web page on your site, however this involves using iframes, and YouTube runs some heavy scripts and external resources are needed from YouTube directly. This causes slower page load which sometimes appears in speed test results as possible improvements that can be made to speed your site up.

We have developed a custom embed code, so instead of chucking in iframes that connect straight to YouTube and call in scripts and other unnecessary data, we instead embed just the preview image onto your web page, if the user wants to play the video and they click the “play” button, the small script you embed into your site will then replace the image with YouTubes iframe player as you would do originally with an auto-play. As far as the user knows, the experience is completely the same. But you save a tremendous amount of resources being included on page load.

All you need to do is embed our custom JavaScript into your HEAD tag and our CSS rules in your CSS file.

Insert YouTube URL

YouTube URL:


Width (100px or 100%):
Height (100px or 100%):

Setup Instructions

Please make sure you have the following on your site before you try our embed code, else it will not work!


Add the following JavaScript code to the <head> of your site:



Add the following CSS code to your stylesheet:

 



Let us know what you think!

Has this tool helped you, or is it helping you consistently? Let us know your feedback below.