Can we add Youtube player in a HTML5 & javascript page without using flash. I need to make an application which uses youtubeplayer & could be played on differnet platoforms e.g. ios,android
(iOS doesn't support flash)
Here you have the code for embed videos with fallback to flash for those who doesn't support html5.
<iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0">
</iframe>
More info here http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html
Related
I have a channel in youtube and want to show in my website the live stream videos, if I have a live stream in youtube.
I have followed instructions from https://www.youtube.com/features and enabled both "Live Stream" and "Embed live streams" options, but every time I have a live stream the youtube shows me "Live stream offline" on player.
I have embed the iframe in my website like this
<iframe width="650" height="400" src="https://www.youtube.com/embed/live_stream?channel=myChannelId" allow="autoplay" frameborder="0" allowfullscreen></iframe>
also I have tried setup this gaming url
<iframe width="650" height="400" src="https://gaming.youtube.com/embed/live_stream?channel=myChannelId" allow="autoplay" frameborder="0" allowfullscreen></iframe>
And also I cannot enable "Monetization" from features, because it is disabled and not available from our country.
Can anybody help me to find a solution ?
This works for me. Same as you minus the allow autoplay property.
<iframe width="100%" height="602" src="https://www.youtube.com/embed/live_stream?channel=MyChannelId" frameborder="0" allowfullscreen></iframe>
There is a brief delay, and sometimes you have to refresh the page.
How to pause a youtube video when soundcloud audio paying and vise versa
<span class="soundcloud_embed" id="soundcloud_post_312">
<iframe id="ui-id-1" width="100%" height="300" scrolling="no"
frameborder="no" src="https://w.soundcloud.com/player/?
url=https%3A//api.soundcloud.com/tracks/163100334&
color=%23ff5500&
auto_play=false&hide_related=false&show_comments=true&
show_user=true&show_reposts=false&show_teaser=true&
visual=true">
</iframe>
</span>
<span class="youtube_embed" id="youtube_post_309">
<iframe id="ui-id-2" width="560"height="315" src="https://www.youtube.com/
embed/M7lc1UVf-VE" frameborder="0" gesture="media"
allow="encrypted-media" allowfullscreen></iframe>
</span>
I've found the source at this link
Pause Youtube embed when playing Soundcloud embed
http://jsfiddle.net/Lpq9n7ht/
If you need to control the player, you need IFrame API.
The IFrame player API lets you embed a YouTube video player on your
website and control the player using JavaScript.
Read through the documentation to get started. There is starter guide that will help you how to use the API. Codes are also available as your reference depending on the functions that you want to use.
For the requirements, remember this.
The user's browser must support the HTML5 postMessage feature. Most
modern browsers support postMessage, though Internet Explorer 7 does
not support it.
I am using a plugin for myBB called Profile Music Plugin which can be found here http://community.mybb.com/mods.php?action=view&pid=75
I need help with making it able to autoplay in the profile.
EDIT:
The code for this currently is:
<iframe width="300" height="200" src="http://www.youtube.com/embed/{$youtubeid}" autoplay="1" frameborder="0" allowfullscreen></iframe>'),
I need help on making this autoplay
The documentation says that you have to specify autoplay as url parameter:
<iframe width="300" height="200"
src="http://www.youtube.com/embed/{$youtubeid}?autoplay=1"
frameborder="0" allowfullscreen></iframe>'
I can't get youtube video to work with video.js
I added in the head :
<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/c/video.js"></script>
Then in the body :
<video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="360"
data-setup='{"techOrder":["youtube","html5"],"ytcontrols":false}'>
<source src="http://www.youtube.com/watch?v=qWjzVHG9T1I" type='video/youtube' />
But I have a black div (tested in latest Chrome & FF).
Am I missing something ?
Thanks
The pull request referenced above was closed, and somebody else took it over and made it a plugin, available from the video.js plugins wiki
You'll need that (or a similar) plugin to play youtube videos. There's an example of this working for the latest API here: enabling youtube playback with video.js wrapper
It appears that the Pull Request which add the Youtube Tech feature has not been merged yet.
Though it's getting old now: https://github.com/zencoder/video-js/pull/157
I wonder if we could have this soon or not at all :(
Or open them in a UIWebView? Their videos are in .swf format though.
Thank you.
EDIT: Okay, so I can get it to play in UIWebView, also when you click on the video in the UIWebView it will play the video in fullscreen. So am wondering if I can just get the code of when it clicks to fullscreen, and use it in some button I have.
Did that make sense?
Oh and thank you again.
Try embed the iframe snippet from Youku into your webview
<iframe height="498" width="510" frameborder="0" allowfullscreen
src="http://player.youku.com/embed/XNTY4ODU0NzQ0"></iframe>
I got it working on Android, but not tried it on iOS yet.
<video width="480" height="320"
src="http://v.youku.com/player/getRealM3U8/vid/XMzkxMTM3MDQw/type//video.m3u8"
controls>
<embed src="http://player.youku.com/player.php/sid/XMzkxMTM3MDQw/v.swf"
allowFullScreen="true" quality="high" width="480" height="320"
align="middle" allowScriptAccess="always"
type="application/x-shockwave-flash"></embed>
</video>
Just use the above HTML in a UIWebView for Youku. It can be played on iOS device and PC. Replace the XMzkxMTM3MDQw with the corresponding code of the video.
As you will easily be able to verify on the internet, Flash (.swf) is not supported on iOS devices. Maybe they offer their videos in another format, otherwise this won't work.
Update: I guess you're just opening the website in your web view. So that means on their web site they have an iOS compatible stream. You can fetch the stream data from the website's source code and build your own web site (stored locally on the device) that only displays that video stream in an UIWebView. Or you use MPMoviePlayer or HTTPLiveStream, whatever. However, make sure that this is allowed/legal, I can't help you there since I guess it heavily depends on what you want to do with your app.
See here to get the url of .m3u8 file for a youku video by its ID, and simply embed it into a <video> tag