I’d like to switch to using video with the new <video> tag available in newer browsers, such as the firefox 3.5 series and safari (soon opera), because it will be easier for people to view the website (currently using flash) with free software, and because it will be the more web-standards way to go.
However, I think it’s still important to have a flash fallback in case of people using browsers not yet capable of the <video> tag: does anyone have advice/exprience about doing this in wordpress? as far as I know, there is no wordpress plugin capable of it, but it is probably possible without plugins.
Hey Bassam, it was great to see you at LGM last week.
Great news that you’re looking at the <video> tag. I’m not aware of a wordpress plugin either, but there are some since javascript bits available.
If you want to hack something up, check out this example. In the html you just use the <video< tag like you’re assuming an html5 browser. The magic is in the video.js script. The initVideo() function checks if the browser supports the media elements, and if not rewrites the page to use a fallback method.
That particular script tries the cortado java player for theora, or the VLC plugin, but it’s easy to add a flash player as well.
What you put inside the “video” tag will only be displayed if the browser doesn’t support “video”. If I remember well, it’s that easy.
video youtube link /video
That might work if you’re providing both an ogv and an mp4 version as alternates in the <video> element.
The problem we had was that the alternate content (your ‘youtube link’) is only used if the browser doesn’t implement <video>. Safari at least will try to play the Ogg version, but if the XiphQT component isn’t installed it will fail to play…but not fall back to the <embed>.
I’ve only tried to get Ogg-only pages working, though.
Right, if you’re willing to provide both h.264 mp4 and ogg theora, then you can put the flash player inside the <video> element, point it at the same mp4 you gave for Safari, and it will fall back smoothly. You just have to provide at least one <source> element for each browser’s chosen baseline format. You can’t, for example, have only an Ogg version users and fall back to Vimeo for everyone else.
I’ve put together a demo if you want to see how it works.
Hey rillian, was nice seeing you too 🙂
Thanks for the help, both of you. Expect a video soon for testing, with ‘appropriate’ content 🙂
cheers!