youtube video in epub3

4 posts / 0 new
Last post

how to add youtube video in epub3 ?

Unfortunately, you can't do a simple embed using the URL that YouTube provides, as that pulls in a web page with player embedded with in it, and the EPUB 3 specification currently only allows audio/video files to live outside the container.

But, if you get the video ID from the YouTube URL, you can replace __videoID__ in the following sample markup to embed the video:

<object type="application/x-shockwave-flash" width="300" height="400">
   <param name="movie" value="https://www.youtube.com/v/__videoID__?version=3" />
   <param name="allowScriptAccess" value="always"></param>
   <p>Sorry, your reading system does not support Flash video.
          You can also view this video on <a href="http://www.youtube.com/watch?v=__videoID__">YouTube</a>.</p>
</object>

(For more info, see https://developers.google.com/youtube/player_parameters)

You'll also need to list the video in the manifest:

<item id="flv001" href="https://www.youtube.com/v/__videoID__?version=3" media-type="application/x-shockwave-flash"/>

and note for the XHTML document that references this video that it contains a remote resource, something like:

<item id="xhtm001" href="xhtml/videoPage.xhtml" media-type="application/xhtml+xml" properties="remote-resources"/>

I'm not sure how much support for Flash video you'll find in EPUB 3 reading systems, but the above does work in Readium.

Support in EPUB 2 reading systems that did support Flash video might also be limited, since they didn't support external resources. I tried this in ADE and it didn't render, for example.

Alas, I've been tripped up by not validating! You'll get an error from the above because question marks are not valid in OPF file names.

It appears you can just remove '?version=3' from all of the above and the video will still load fine, though.

Epubcheck will also erroneously report an error that the file calling in the Flash video does not contain remote resources, as it only looks at the data attribute on <object>. You could work around that problem by just adding the attribute:

<object type="application/x-shockwave-flash" data="https://www.youtube.com/v/__videoID__" ... >

But the next problem I discovered is that resources starting with https:// aren't recognized as remote, so you still get the message. Again, you could simply switch to http:// to work around for now, as it does not affect playback that I can see, and lets epubcheck successully validate. I've reported these latter two bugs.

Sorry,
I got an error that media-type doesn't support "application/x-shockwave-flash".
Can everybody help me?
Can give me other example ?
<iframe height="345" src="http://www.youtube.com/embed/XGSy3_Czz8k" width="420"></iframe></p>
Thank you so much.

Secondary menu