Saturday, December 23, 2017

How To Display YouTube Video On Your Web Page

Hello Friends My Name Is Viraj,Today I Will Display YouTube Video On Your Web Page.Embedding a video into a web page used to be a real challenge in the early days of the web. You had different formats to chose from, other visitors might not have the proper software installed to see the video, and bandwidth was still limited, as many people were still on dialup. Forward to 2011. Most people then had broadband, and although there were still many video formats, the most commonly used method to a a video to your web site was via the Flash player and an .flv file which is provided via an external host, such as YouTube. Forward to today, and it is now common place for videos to be placed in web sites, social media and more. The process for adding a YouTube video to your web site has remained relatively close to the same as well!On a side note, if you are interested in viewing HTML5-based videos on YouTube, we have written an article specifically about the topic, including specific directions for doing so. And if you are interested in editing YouTube videos and adding annotations, we have an article for that as well.Now, embedding a video onto a web page becomes as easy as cutting and pasting. When you visit a site that hosts videos, such as YouTube, you are presented with a video box on the page. You can watch the video directly on the page, or the Flash player allows you to view the video full screen, just by clicking a button on the player. How much does it cost you to add a video from YouTube to your site? Nada--nothing.You can use any of the following methods to embed a YouTube player in your application and specify player parameters. Note that the instructions below demonstrate how to embed a player that loads a single video. The following section explains how to configure your player to load other types of content, such as playlists and search results.Follow the IFrame Player API instructions to insert a video player in your web page or application after the Player API's JavaScript code has loaded. The second parameter in the constructor for the video player is an object that specifies player options. Within that object, the playerVars property identifies player parameters.

The HTML and JavaScript code below shows a simple example that inserts a YouTube player into the page element that has an id value of ytplayer.YouTube video can be added to any website, to any of the webpages, or you can optionally replace the default Allwebco template videos with YouTube videos. See the help.html included with your template download for the correct setup info and support links.If you have a responsive Allwebco template with video, your YouTube code will already be responsive. To have your videos flex in size on mobile devices: remove the height and width code from the YouTube embed code. The onYouTubePlayerAPIReady() function specified here is called automatically when the IFrame Player API code has loaded. This code does not define any player parameters and also does not define other event handlers. They provide the service, and they also provide the bandwidth, so the video is hosted on their servers and uses their bandwidth! Hard to beat a deal like that!Here's an example of a YouTube video that is directly embedded into this page.How To Display Youtube Video Link On Your Web Page In Html Code.Here I Would Like To Show An Sample Example Related To Html Tutorial.This Video Is Available On Youtube Which Is Display In My Code.Here In This Example We Required Youtube Link Which Will Be Written In src As Show In Code And Height And Width Will Be Set In <iframe> Tag.Let Begin With Our Example.

So Let Begin With Our Coding............

Step 1 :

<!DOCTYPE html>
<html>
<body>

<iframe width="420" height="345" src="https://www.youtube.com/embed/6z8TP4tikAg?controls=0">
</iframe>

</body>
</html>


Output :


Here Is Video Related To Topic


2 comments:

How To Create Image Gallery In Html

Hello Friend My Name Is Viraj,Today I Will Create Image Gallery And Display On A Webpage.The emergence of CSS3 technology has enabled web d...