Add an Embed Option for HTML5 Video
Embed Video
<--How to add an Embed Option to Your HTML5 Video Player-->
Open a text editor on your computer like notepad and follow the instructions.
<!--In order to create an embed option all you need to do is create 2 addition .html pages in your server. You also need to place a link on the original video webpage.--> <!--Step 1 - Open notepad or a text editor and create a new web page containing the video you want to be embeddable with the usual <head and <body tags. Save the new page as an .html file like "embedlinkpage.html". Then add the following.--> <!-- always include the javascript and .css files in the head of all pages containing your videos.--> <html <head> <link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet"> <script src="http://vjs.zencdn.net/c/video.js"></script> </head> <body <!--1 - Install a <textarea> tag which will display the iframe text url. <1--Text created inside <textarea> tags will display as normal text on the computer screen. <!--The <textarea> is measured in colums and rows and can be adjusted--> <!**--Be sure to add a /backslash/at the last <textarea> tag, I removed it because the computer reads it as the end of the tutorial text.--> <!--2 - Next add a close button on top of the <textarea> tags. This sends the person back to the original video page.--> <!--close button--> <center><INPUT TYPE="button"align="right" VALUE="Close" onClick="history.go(-1);"></center> <!--Iframe text for embed--> <center><textarea cols=50 rows=4><iframe width="650" height="380" src="http://standupcomedy.me/tutorials/embeddedvideo" frameborder="0" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe><textarea></center> <!**--add / in textarea ending tag above--> <!--video tags - place embed text here--> <center><video id="myplayer1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="360" poster="http://standupcomedy.me/videop/560x315 now fits.jpg" data-setup="{}"> <source src="http://standupcomedy.me/video/themesong-sdq.mp4" type='video/mp4'/> <source src="http://standupcomedy.me/video/themesong-sdw.webm" type='video/webm'/> </video></center> <!--3- Now resave the page and continue to step 2--> </body> </html> <!--Step 2 - Now go to the original video page in your text editor and simply add a link under the video directing it to the embed video webpage "myvidembed"--> <!-- always include the javascript and .css files in the head of all pages containing your videos.--> <html <head> <link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet"> <script src="http://vjs.zencdn.net/c/video.js"></script> </head> <body <center><video id="my_player_2" class="video-js vjs-default-skin" controls preload="auto" width="640" height="360" poster="http://standupcomedy.me/videop/560x315 now fits.jpg" data-setup="{}"> <source src="http://standupcomedy.me/video/themesong-sdq.mp4" type='video/mp4'/> <source src="http://standupcomedy.me/video/themesong-sdw.webm" type='video/webm'/> </video></center> <!--Add Link--><center><a href="myvidembed" >Embed Video</a><center> <!--1- This added link should contain a path to the newly created second web page "myvidembed" with text such as -Embed Video-.--> </body> </html> <!--Step 3 - Create a webpage for the video by itself. This will be what the person embedding the video will see on their web page.--> Open your text editor and create a third webpage with nothing but the video you want embedded. <!--Save the page as something like embeddedvideo.html Use this page in the iframe embed url.--> <!-- always include the javascript and .css files in the head of all pages containing your videos.--> <html <head> <link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet"> <script src="http://vjs.zencdn.net/c/video.js"></script> </head> <body> <center><video id="myplayer1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="360" poster="http://standupcomedy.me/videop/560x315 happy ending.jpg" data-setup="{}"> <source src="http://standupcomedy.me/video/themesong-sdq.mp4" type='video/mp4'/> <source src="http://standupcomedy.me/video/themesong-sdw.webm" type='video/webm'/> </video></center> </body> <html> <!--2- Save the page changes and install all pages in your server directory and test. Rember you can always type in the full address of the new page in your browser to test it.-->
Success
Embed video
Embed Video