How do I play a YouTube video in HTML5?
This is probably what you're looking for:
Force HTML5 youtube video
HTML5 video may play if the user has opted in:
<iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0"> </iframe>
HTML5-by-defualt video - notice the ?html5=1:
<iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/VIDEO_ID?html5=1" frameborder="0"> </iframe>
The "HTML5" way of doing video would be to use a <video> tag. This post shows that it can be done, but it doesn't look like the best option. Show Youtube video source into HTML5 video tag?
You can also take a look how YouTube does it, opt in at: http://www.youtube.com/html5
If you're using safari, there's an YouTube5 extension that will make all youtube videos into html5 videos.
http://www.verticalforest.com/2010/06/09/youtube5-html5-converter-for-youtube-videos/
Supports videos that youtube does not (videos with ads etc)
You can embed videos effortlessly by right clicking the video on youtube,
copying the embed video option, and pasting it in your html where you want it to appear, The problem with this you wont have control over what is shown in the embed code apart from the clip you are interested in, ie, adverts playlists etc
Related
I want to autoplay my online radio but can't seem to fixed it.
Autoplay="true" autoplay="1" doesnt work
I got this shortcode
[html5radio radiolink="http://server:port/" radiotype="shoutcast" bcolor="000000" image="" title="Stream Title" artist="Stream Artist" facebook="http://www.facebook.com/radioforgecom" twitter="http://twitter.com/radioforgecom"]
and this
< iframe src="https://player.radioforge.com/v2/shoutcast.html?radiolink=http://server:port/&radiotype=shoutcast&bcolor=000000&image=&facebook=http://www.facebook.com/radioforgecom&twitter=http://twitter.com/radioforgecom&title=Stream Title&artist=Stream Artist" frameborder="0" marginheight="0" marginwidth="0" scrolling="no" width="367" height="227"></iframe>
After trying codes that I can think of, the video is still not autoplaying.
Auto-playing audio is something that browsers are trying to do away with. In order for audio to be allowed to play, the user must first interact with the page in some way. See this post about Chrome’s autoplay policy.
I got some youtube urls, such as https://www.youtube.com/embed/LaXGkW_-Nvc?list=RDTDDDvaoGiDg. When I put it to html video tag, it said "Invalid source".
How to solve this problem?
When I used iframe to display videos, I had another problem as described here: Video not showing in iframe on IE, but showing on firefox and chrome.
This is my HTML:
<video width="300" height="auto" autoplay="" controls="" name="media"><source src="https://www.youtube.com/embed/LaXGkW_-Nvc?list=RDTDDDvaoGiDg"></video>
You can't use the HTML5 video tag for youtube videos, it only supports files that are either MP4, WebM and Ogg. W3C Schools
Youtube already provides you with an "embed" function on their page which auto generates the iFrame for you. Youtube Embed There are a few other methods but they are no longer used (deprecated). Youtube API
As for the issue with IE, maybe have a look at this similar question: YouTube iframe embed code not working in IE
The only way around the issue if you want to use the HTML5 video tag is to download the Youtube video in one of the specified formats.
You need to use the <iframe> tag to embed the YouTube. Please read the code below:
<iframe src="https://www.youtube.com/embed/5L3wKniOnro?autoplay=1" width="600" height="400" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
I have the following video iFrame embed code on a page on my website (mywebsite.com/page2) - it plays a video that is hosted on an external site (http://wistia.com). I want to be able to send email clients a link to my video on my page (mywebsite.com/page2/mywebsitevideolink) - not a link to the external website, a link that opens up mywebsite.com/page2 and displays the video on my page that you would have to scroll down to see and starts playing it. How can this be accomplished? Thanks.
<p class="rtecenter"><iframe allowfullscreen=""
allowtransparency="true" class="wistia_embed" frameborder="0"
height="480" mozallowfullscreen="" msallowfullscreen=""
name="wistia_embed" oallowfullscreen="" scrolling="no"
src="//fast.wistia.net/embed/iframe/myvideo" webkitallowfullscreen=""
width="640"></iframe></p> "
Modify your p tag to <p class="rtecenter" id="video">and then your link is http://mywebsite.com/page2#video
Hope that this'll help you.
You can also set up a file which displays when you type /page2/mywebsitevideolink and redirects to /page2#video
If you want to link to a certain part of your page, just use an anchor link.
<div name="videopart">
VIDEO HERE
</div>
And for the link: http://yoursite.com/video.html#videopart
And for the player to autoplay, if you are using your video hosting's player, look in teir documentation for how to autoplay. If your just using the html tag, and the word autoplay in the beginning tag.
I have taken the following iframe code for the youtube video from the youtube itself.
<iframe width=”560? height=”315? src=”http://www.youtube.com/embed/V3oJR5IAMxM” frameborder=”0? allowfullscreen></iframe>
But when i try to embed this video on simple web-page inside a div element. I can see the you-tube player in the web page.But the video is not loading in my webpage. But the same video is playing for me in youtube.
Can someone tell what might be the problem,..
Is the problem with a code or with the browser, i am using mozilla 13.
HiTbmBizz,
Try this instead,
<iframe width="640" height="360" src="http://www.youtube.com/embed/V3oJR5IAMxM?feature=player_embedded" frameborder="0" allowfullscreen></iframe>
Worked for me in HTMLSandbox if you want to test.
Let me know how it goes.
I have been looking for a way of embedding youtube videos into my site. The website is made of html and the youtube videos should auto-update as I would like to display all the videos on the current account? I know theres ways of embedding one video or playlists but Im not quite sure how to go about embedding everything on a users channel? Any Tips?
Just use the following as the src of an iframe:
http://www.youtube.com/embed/?listType=user_uploads&list=*USERNAME*
For example:
<iframe id="ytplayer" width="640" height="360"
src="http://www.youtube.com/embed/?listType=user_uploads&list=apple"
frameborder="0" allowfullscreen>
You can get info on the parammeters of the player on this link: https://developers.google.com/youtube/player_parameters#Manual_IFrame_Embeds
Scroll a little and you will see the url for user videos.