Adding YouTube video using HTML
To add videos to your web page you will have to change there format because different browsers support different formats. Instead of this, you have an easier solution, just add YouTube videos link to your webpage.
Adding YouTube video using HTML
We need to do the following steps.
- Upload video to YouTube.
- Copy the embed code of the video.
- Make a <iframe>.
- Paste the embed code in the src attribute.
|
1 2 3 4 5 6 7 |
<!DOCTYPE html> <html> <body> <iframe width="420" height="345" src="https://www.youtube.com/embed/7DvhszCZB-g"> </iframe> </body> </html> |
Adding YouTube video using PHP
Let’s see the code of “Adding YouTube video using PHP”.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?php $url = '<a href="https://www.youtube.com/embed/7DvhszCZB-g">https://www.youtube.com/watch?v=u9-kU7gfuFA</a>'; preg_match('/[\\?\\&]v=([^\\?\\&]+)/', $url, $matches); $id = $matches[1]; $width = '400px'; $height = '300px'; ?> <!DOCTYPE html> <html> <head> <title>YouTube Video using PHP</title> </head> <body> <iframe id="ytplayer" type="text/html" width="<?php echo $width ?>" height="<?php echo $height ?>" src="https://www.youtube.com/embed/3um5QCDFIlE/<?php echo $id ?>?rel=0&showinfo=0&color=white&iv_load_policy=3" frameborder="0" allowfullscreen></iframe> </body> </html> |
Adding YouTube video using JavaScript
Let’s see the code of “Adding YouTube video using JavaScript”.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<!DOCTYPE html> <html> <head> <title></title> </head> <body> <script> var obj = {"video": { "value": "<iframe title='YouTube video player' type=\"text/html\" width='480' height='320' src='https://www.youtube.com/embed/3um5QCDFIlE/' frameborder='0' allowFullScreen></iframe>" }} document.write(obj.video.value); </script> </body> </html> |
How embedded Video Looks in a Web page?
Here, there is a demo that how a video looks on a web page.
