I want to implement a Youtube video in my HTML code [duplicate] - html

This question already has answers here:
Embed YouTube video - Refused to display in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN' [duplicate]
(5 answers)
Closed 3 years ago.
I want to implement a Youtube video, but the video didn't show, even if i think i wrote the code correctly.
I am confused because i copy pasted a code from another html code, and just when i change the URL video to another one, it didn't show the new video anymore...
<iframe width="854" height="480" src="https://www.youtube.com /watch?v=6kg2yV_3B1Q" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
code to the codepen : https://codepen.io/Peyo5202/pen/RwbGaGm?editors=1000
No error message, just a blank space instead of the video.

You should embed iframe tag from youtube:
- Hit the share button
- Choose embed HTML
The iframe tag should looks like this:
<iframe width="560" height="315" src="https://www.youtube.com/embed/6kg2yV_3B1Q" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

try with this link instead of your link for a test, it will work :
<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY"
</iframe>
So I think your link has a problem

this is a trivial thing check this W3School, best of luck, try this
<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY">
</iframe>

Related

Unable to play the video using link from YouTube [duplicate]

This question already has answers here:
Show Youtube video source into HTML5 video tag?
(8 answers)
Unable to load youtube video using <video> tag where youtube url is inputted in textfield
(3 answers)
Closed 2 years ago.
I am unable to play the video, the link was taken from YouTube, the code is as follows:
<!DOCTYPE html>
<html>
<head>
<title>Audio & Video</title>
</head>
<body>
<h1></h1>
<video src="https://www.youtube.com/watch?v=Et2HGG_Hfdk&t=3s" controls autoplay>
Your Browser Does Not Support the Video Format
</video>
</body>
</html>
That is not the correct way to embed a YouTube video.
You need to use YouTube's official embedding method, which would look like this:
<iframe src="https://www.youtube.com/embed/Et2HGG_Hfdk?start=3" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
Check this out. You can put your youtube video inside iframe
<iframe width="560" height="315" src="https://www.youtube.com/watch?v=Et2HGG_Hfdk&t=3s" frameborder="0" autoplay allowfullscreen></iframe>
You need to embed the video in html using iframe
<iframe width="560" height="315" src="https://www.youtube.com/embed/Et2HGG_Hfdk" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
for more information on embedding youtube videos follow the link https://developers.google.com/youtube/youtube_player_demo

Why doesn't this YouTube video embed properly?

When I try to embed the top video, it gives a Playback error. I feel like if it were expected behavior it would at least give a nice message explaining why . Am I doing something wrong with my code?
Bottom video works, top doesn't.
https://jsfiddle.net/ks1xhbd3/1/
<iframe width="560" height="315" src="https://www.youtube.com/embed/AHOQ5Ge0l5Easd" frameborder="0" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/lWz-46NPqdk" frameborder="0" allowfullscreen></iframe>
The video ID is wrong - remove the 'asd' from it, it doesn't belong there and you definitely typed it in accidentally.

the iframe is not working what shall i do

<iframe width="640" height="390" src="//www.youtube.com/watch?v=rf-ZbfUTVO0" ></iframe>
i did like this but is is not working. I tried this many time but still not working.
Well, if you want to embed any youtube video then you can click on the share button of Youtube, there you'll find the embed code just like below. I did this and it's working for me.
<iframe width="560" height="315" src="https://www.youtube.com/embed/rf-ZbfUTVO0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

How to reformat a video so it can be seen in an html webpage using <iframe>?

I am using the tag and some youtube videos show up but the specific video I want isn't in the correct format.
This is the tag with a random video (is working).
<iframe width="420" height="315"
src="https://www.youtube.com/embed/XGSy3_Czz8k">
</iframe>
This is with the video I want (not working).
<iframe width="420" height="315"
src="https://www.youtube.com/watch?v=9fJEFi3ccwI">
</iframe>
Can someone please help me reformat?
I wonder if you simply mean re-format the video URL?
Try as :
<iframe width="420" height="315"
src="https://www.youtube.com/embed/9fJEFi3ccwI">
</iframe>
Let me know if this works how you wanted?

HTML z-index does not work for youtube video

I have youtube video on page:
<iframe id='youtubeTrailer' width="560" height="315" src="//www.youtube.com/embed/0Vsy5KzsieQ" frameborder="0" allowfullscreen></iframe>
and some poster. I wrote index for img greater than for video. but it's still does not work. How can I fix it?
That's because flash mostly ignores z-index (unless wmode is set to opaque). You can follow the steps detailed here to correct it.
What the guide above details is just setting the wmode to transparent by modifying the iframe code.
<iframe id='youtubeTrailer' width="560" height="315" src="//www.youtube.com/embed/0Vsy5KzsieQ?wmode=transparent" frameborder="0" allowfullscreen></iframe>