I re-implemented newTube.js, an earlier experiment to embed HTML5 YouTube video, into my WP YouTube Lyte plugin. This means that WP YouTube Lyte (for easy lite YouTube embeds, reducing download size & rendering time substantially) can now also use the HTML5-based YouTube video-player to play your embedded video.
If the -experimental- HTML5 option is enabled, WP YouTube Lyte will embed HTML5 YouTube video if:
- Your visitor uses a browsers that supports the h264 (Safari, Chrome, IE9) or WebM (currently development versions of Chrome, Opera and Firefox) video codecs
- Your visitor is enrolled in the YouTube html5 beta
If these requirements aren’t met, your visitors will see a Flash-based version of the YouTube video you specified.
As newTube.js is sort of a dirty hack which replaces the LYTE dummy player with an iframe with overflow:hidden, in which the full YouTube-page is carefully positioned to display only the player, there are some other caveats to take into account as well:
- It might break if YouTube implements x-frame-options for their video-pages
- Positioning of the player might be a few pixels off in some browsers
- Some buttons in the embedded player (e.g. view full screen) won’t function properly
- This might (not) work on iPhone/ iPod/ iPad’s (there are known issues with iframes & overflow in mobile Safari that might affect html5 embedding, feedback is welcome)
But apart from all this small print, is works rather nice if I may say so myself. Or better still, just look at this little They Might Be Giants gem embedded here;
I LOVE this plugin. Thanks for sharing.
I updated from 0.2.2 (which was working fine on my blog) to the latest 0.3.2. After updating, I saw a bunch of errors. When I tried to login to WordPress admin, I could not and kept getting this error: Warning: Cannot modify header information – headers already sent by (output started at /home/fruity/public_html/wp-content/plugins/wp-youtube-lyte/options.php:51) in /home/fruity/public_html/wp-includes/pluggable.php on line 868
So I reverted back to the previous version… and everything is fine again.
that’s weird. what version of wordpress are you running?
ok, according to a wordpress troubleshooting FAQ page it was a stupid linebreak at the end of options.php. I removed the linebreak and pushed 0.3.3 out, should arrive real soon in an wp-admin screen near you. Hope this solves this problem!
Thanks for the reply and fix. Oh, and just to answer your question, I’m using WordPress 2.9.2.
Excellent! Now i can remove the link to your script on your domain 😉 Did you test the difference between choosing for a plugin or just adding the script async? Just out of curiousity. Tnx for sharing this. On my to-do list
the plugin just ‘translates’ the httpv youtube link into the html-code that does the async script inclusion, so there probably is a very (but really very very) small performance impact (unless you’re using wp-super-cache, which you should) … 🙂
nice plugin! does the javascript loads on every page or just on youtube video embedded pages.. sorry, worse english.. 🙂
have a nice day
hi christian; the javascript only loads if there’s a youtube to be embedded 🙂
sounds great, thank you very much for this and your fast answer, frank. have a nice day! 🙂
Unfortunately, it doesn’t play well with a fantastic plugin called n3rdskwat-mp3player
wordpress.org/extend/plugins/n3rdskwat-mp3player/
… which seems to be currently the only WordPress audio player plugin out there that allows a visitor to browse a site and play music without the music stopping (when user goes to another part of the site). It’s rather awesome.
When WP YouTube Lyte and n3rdskwat are both activated, the YouTube images disappear. I’ve contacted the author of n3rdskwat, but I’m not sure if he’s going to address the issue…
I was hoping you could look into the issue… please? But if not, I understand… compatibility with all plugins can’t be guaranteed.
no problem, i’ll look into it 🙂
hi massa (that’s your first name I hope?);
looked into the issue you described, but i probably won’t be able to solve it.
the problem is that n3rdskwat-mp3player is very intrusive;
* it redirects all request from hostname/path to hostname/#/path (which seemed to brake navigation-stuff)
* it creates an entirely new DOM which embeds the normal wordpress-page in
* it relocates/ modifies/ removes other javascript-functions (the lyte-script is indeed relocated)
apparently others are having similar problems: see this and this question on wordpress.org
given these facts i’m afraid I would advise against using n3rdskwat-mp3player (even without taking wp-youtube-lyte into account).
Hi! Yes, Massa is my first name.
Thank you very much for looking into the issue and giving an explanation. 🙂 I appreciate it. Yeah, I didn’t expect compatibility or a quick resolution. n3rdskwat is indeed intrusive (it broke some other plugins I’m using.)
But thanks for looking into it. 🙂 I will probably have to drop n3rdskwat… but I cannot drop WP YouTube Lyte… it’s just too awesome. 🙂
Thanks.
a quick heads-up for those interested; version 0.4, which will allow to configure the player-size, is coming soon.
I tried adding this to my forum, but there is a problem with someone quotes someones video. It doesn’t load the video in the new users post, but loads it right under the first instance of the video, going above all other elements of the page. Any way to fix it?
hi jacob, can you provide me with an example of where this is happening? and i’m also curious; how did you manage to install a wordpress-plugin in a vbulletin-forum? 😉
Thank you SO MUCH for releasing version 0.6.0 (widget enabled version). AWESOME!!! 😀
I love the plugin! It works great on my site.
I am interested in setting up multiple instaces of the plugin, one to size the videos for posts and one resize them for the sidebar, is this possible? Could I just set one of them to recognize irks with httpsb:// or something instead of just httpv:// ?
Sounds easy enough in theory but those ideas are often tricky to implement. Thanks.
hi dave, thanks for the feedback! it feels great to be able to contribute with just a few lines of code 🙂
as far as different sizes are concerned; there’s a wp youtube lyte widget available for your sidebar needs, it comes in 3 different sizes which you can choose from, or do you need something different?
Sorry but no way to define center or left position.
Why?
that’s a small bug, i’ll fix it in the upcoming 0.6.5 (but you’ll have to dive into wp-youtube-lyte/lyte/lyte.css though)
could you please tell me which part i should edit to add a custom size for all the videos please?
thanks for a great plugin!
hi zmin; just add the custom size to player_sizes.inc.php and put an image with the new width in wp-youtube-lyte/lyte, e.g. controls-newtube-765.png (if html5-player) or controls-765.png
have fun!
frank
thanks a million!
i really do appreciate your quick answer, i replied on another forum and i got none.
i’ll try that. cheers! 🙂
Hi Frank! Just a quick note to tell you that your attention to detail and responsiveness to users is right on. I am using your plug-in with a few blogs I work on and the new lyte embeded link thing is very cool!
Your plug-in is proudly displaying a video by “The Who” on my blog entitled….”Who are you? Brand your Biz”
http://getyoustartedemarketing.com/2011/03/brand-business-emarketing/
Awesome….reliable…thank you! – Jan
Hi Frank,
first of all, i ve to say that your plugin wp youtube lyte is great. i use it on my blog test-portal.net and the page is loading def. faster than before. But with the new version 0.7.1 the videos are not shown like they should. i can only see the youtube-url httpv://… but not the video. I use the WP Version 3.1.1–de_DE. So i tried now to install the old WP Youtube Lyte Version 0.7.0 and it is now working again fine … Do you’ve an idea, how to fix the 0.7.1 problem with my WP-Blog? Here is an example of a an embedded video on my page (if you scroll a little bit down): http://test-portal.net/kinect-spiele-xbox-360-release-liste-aller-kinect-games_101474 I also checked to deactivate WP Super Cache, to install the 0.7.1 again, but it didn’t helped to solve the problem … atm i use 0.7.0 now …
cheers Markus
ouch … I made the assumption that wordpress put a paragraph around every lyte-block and adapted my regular expression to include the paragraph in what needs to be replaced. apperantly my assumption was wrong, because wordpress didn’t place your video’s in a paragraph.
sorry for the inconvenience, i’ll release 0.7.2 in the coming days!
hi, thx a lot 🙂 that would be great , greetings from berlin , Markus
could you check, under “settings” -> “writing” if the option “correct invalidly nested XHTML automatically” is checked? i’m thinking that that option might be responsible for (not) embedding the lyte-player in a paragraph.
I’m pushing 0.7.2 to wordpress.org now, the issue should be fixed, sorry for the inconvenience markus!
the option “correct invalidly … ” wasn’t checked. I now tried the version 0.7.1 again when this writing option was checked and after that when the option wasn’t checked, but in both cases wp y-lite 0.7.1. didnt showed the videos, just the url …
on test-portal i now installed the version 0.7.0 again and use another blog for try out some different options with 0.7.1 … if i found s.th out, i’ll let you know 🙂
another reason why the lyte-player might be wrapped in a paragraph, is the fact whether or not you put your httpv-url’s an a fresh line. do you do
some text httpv://yourube.com/blah httpv://youtube.com/blah2 more text
or rather
some text
httpv://yourube.com/blah
httpv://youtube.com/blah2
more text
the first way will probably not generate the paragraphs around the httpv-links, which will break wp youtube lyte, the second manner should indeed create the p’s?
hi, i always put in a fresh line but in the most cases i put a httpv:… tag arround the youtube url … i ll try it without center … perhaps thats the problem 😉
i guess “center” indeed will prevent the paragraph from being added. anyway, 0.7.2 should make all of our guessing superfluous, let me know if there’s any problem after the update!
Hi Frank, thx a lot !!!
everything is working fine now … also with the tag
greetings from berlin 🙂
Markus
The new version 0.7.3 doesn’t run so, as I posted – as usual – a youtube link to be embedded I realised there’s space in the format of the video but not the video itself. Checked other videos I embedded and nothing was going on there. Need a solution.
cfr. my mail, based on your html code, there’s something wrong with the code in wp-youtube-lyte.php on line 69; the addeventlistener is broken as the URL of your blog is in there. check & correct that file or uninstall & re-install wp-youtube-lyte and all should be well.
I understand. I do not need to reinstall- In fact, it’s not your fault at all. I used “Free CDN” for testing purposes but I didn’t recognized that anything went faster since I’ve installed the CDN-plugin. Deactivated and deleted it now and anything else is fine. Even your plugin runs as it should. Thanks.
glad you’ve got it solved. I use wp super cache’s cdn functionality (w3 total cache has that as well) to offload static resources to an aliiased domain, you can even do that with one simple change in wp-config.php, works pretty well.
Thanks a lot for the hints.
Is there anyway to pass opague as the wmode to the Flash player?
This is the issue being experienced:
http://stackoverflow.com/questions/326196/ff3-windows-css-z-index-problem-with-youtube-player
if you’re using the “old-style Youtube embeds with flash”, sure: open plugins/wp-youtube-lyte/lyte/lyte.js, search
wmode=\"transparent\"
and replace it withwmode=\"opaque\"
if you’re using the HTML5-video option and Youtube falls back to Flash, all embed code is being sent by Youtube, so it can’t be changed as far as I know.
Awesome thank you. It’s a shame YT don’t allow you to pass parameters to the fall back player.
This is great plugin for WP I have been using for a month now.. but today I updated to latest release and it broke the plugin with tube at front page with multiple videos.. please check it out.. http://abzahri.com/ And do you have the older version.. I would like to fall back if possible. 🙁
hi abzahri; a pity the new version doesn’t work for you, but I can’t really see what’s wrong, everything seems to work? what doesn’t work exactly for you?
Frank.. I finally got it running.. After updating.. apparently the script didn’t download the new version object from the youtube server.. After clearing the cache on the server.. I got it running..
Thanks.. 😀
glad it works, hope you enjoy the new playlist feature! 🙂
Hi,
i’ve uploaded the plugin it doesn’t parse httpv address on main page. If i click on the article and i watch it in single page it works ok. What i’ve to do?
Check it out!
http://www.tuttingegneri.com
Morning Ruben; this is because WP YouTube Lyte is only active for “content” (i.e. the full post/page), not for “excerpts”. Shouldn’t be to hard to add it though, if you feel adventurous you could;
Let me know how that works out, this might land in 1.0.0 if it does 🙂
afternoon ruben; the new version of wp youtube lyte (1.0.0!) now supports parsing manual excerpts. hope you like it! 🙂
I edited the core file of the plugin with that:
add_filter(‘the_excerpt’,’lyte_parse’,4) but nothin has changed. On excerpts it doesn’t parse. 😀
I’ve started working on 1.0.0, I’ll look into parsing the excerpt and might include a fix for that if possible.
Ok. Ty!
OK Ruben; the wordpress automatic excerpt-function strips out too much for wp-youtube-lyte to function.
you can however add the httpv-URL (and some text) in excerpt-field beneath your text in post/page edit (if it’s not there, you can make it visible in “screen options”).
if you do that, and have “add_filter(‘the_excerpt’, ‘lyte_parse’, 4);” in wp-youtube-lyte.php (right under the same line with (“the_content”), then you’ll have your wp-youtube-lyte vid in your excerpt all right.
this will, one way or another, indeed be in 1.0.0 (but the manual excerpt will be needed).
hope this helps!