Embedding HTML and iframe content in the WordPress editor is annoying – the editor strips out elements so you end up with broken code, or no code at all. Right?

Wrong (sort of)!

For some reason, it seems that the vast majority of WordPress users are not aware that as of version 2.9 we can all easily embed media like YouTube videos into the editor. All you have to do is paste the URL of the page with the item you want to embed into your post (this even works in the Visual editor), and the URL will magically turn into the embedded object.

Until WordPress version 2.9, one of the sanest ways (in my opinion) to embed videos in the WordPress editor was with the Viper’s Video Quicktags plugin. You clicked an icon on the editor, pasted the URL of the page with the object to be embedded into a window, and poof! Your video was embedded properly.

Well, that very same Viper created a feature for easily embedding code in WordPress that was incorporated into WP 2.9 that allows users to embed by inserting the URL only. The functionality depends on the oEmbed format, which allows an “embedded representation of a URL on third party sites.”

Very nice, but how do I get it to work?

In order for this to work, you need to make sure your site is configured to embed media from URLs. To do this, log in to your WordPress admin and:

1. Go to Settings > Media
2. Under Embeds select “When possible, embed the media content from a URL directly onto the page. For example: links to Flickr and YouTube.”
3. Save your settings.

Once that is selected, you can paste URLs from the following sites and they will yield the embedded object:

• YouTube
• Vimeo
• DailyMotion
• blip.tv
• Flickr (both videos and images)
• Viddler
• Hulu
• Qik
• Revision3
• Scribd
• Photobucket
• PollDaddy
• Google Video
• WordPress.tv (only VideoPress-type videos for the time being)
• SmugMug (WordPress 3.0+)
• FunnyOrDie.com (WordPress 3.0+)

Here’s an example:

http://www.youtube.com/watch?v=z7hUBOGIXtY

Ok, that’s not really an example, since all you see is a link. The reason it remained a link is because it’s hyperlinked (i.e. if you click on it, it will take you to that page), and it’s hyperlinked because when you enter a URL in the WordPress Visual editor, it automatically converts it to a hyperlink. This is probably the reason so many WordPress users aren’t aware of the ability to embed objects by just entering the URL.

In order to make the object appear, you have to remove the hyperlink so that the link is just text. To remove the hyperlink:

1. Put your cursor anywhere on the link.
2. Click the broken link icon in the editor:
   

Here’s the same link as above, with the hyperlink removed:

The above works on both WordPress.com and WordPress.org sites. That’s good, but certainly not good enough. What about embedding presentations from Slideshare? Tweets from Twitter? Well, read on for how to embed objects in this easy way from many more online services, not just the ones included in WordPress out of the box.

Getting more out of oEmbed in WordPress

Luckily there are ways to add other oEmbed providers to your site so you can embed media from numerous, even hundreds of different sites by just entering a URL in the WordPress editor. The WordPress Codex explains how you can register oEmbed providers to your site’s whitelist by calling a function from a plugin or your functions.php file. Nice, but a headache.

Another way to embed media from over 200 services in your WordPress site is by installing the Embedly plugin. The plugin uses the Embedly API to get the embed code and display it in a post.

To use Embedly, install the plugin, and then click on the Embedly area in the WordPress sidebar:

This takes you to an area that presents you with hundreds of services that you can choose to add support for in your site:

You can also see all the available services on the Embedly API page.

Embedly includes twitter, which is great. You just embed the URL of a specific tweet, and it turns it into a nice graphical format that pulls in the author’s avatar, name, and twitter background.

Here’s the URL of a tweet: http://twitter.com/#!/photomatt/status/49253618385301504. Now here it is embedded:

So much embedding potential!

So as you can see, with a few simple plugins you can change the entire way you approach adding third-party media to your site.

In the next post, we’ll look at ways to embed HTML and iframes in your WordPress site from sites that are not oEmbed providers (have you ever tried embedding a Google Form in your site? It’s scary)! So check it out to learn how to embed HTML from anything in WordPress.

More reading:

The Ultimate guide to embedding HTML and iframes in WordPress  – part 2

Official oEmbed site – learn how the format works, see examples

Embeds entry in the WordPress Codex – goes through what embeds is, what WP supports, etc.

This post was originally published at The ultimate guide to embedding HTML and iframes in WordPress on WP Garage - WP Garage - wordpress tricks, hacks, and tips.

I just discovered that videos do not show up when you are using excerpts (<?php the_excerpt(); ?>) on certain pages instead of publishing the full content (<?php the_content(); ?>) on the post.

I use Viper’s Video Quicktags for easily embedding videos in my blogs. Well, it turns out that instead of the video showing up on excerpt pages, the embedding code shows up instead.

Not very pretty.

Now, if you have a post, and there’s a video in it past the excerpt point, you’re ok. But I wanted to have a category that was kind of a like a vlog, where the post consists of a video and that’s it.

So I had to change all of my pages using the_excerpt (or The Excerpt Reloaded, which you should use to retain HTML formatting in your excerpts like links, bullets, etc.) to the_content.

But all is not lost – WordPress gives you two ways to manually generate excerpts that will appear on all multi-post pages, like the home page, archive page, and category page:

1. The “more” tag and button. If you are using the WYSIWYG editor, there is a “Split post with More tag” button. It is the button directly to the left of the Spellcheck button (with the ABC on it). Place your cursor where you want to end the excerpt, and click on the button. Or, press Alt+t.
2. Enter an excerpt in the Optional Excerpt field below the editor. I recently discovered that you can enter HTML in there, so if you want an image to appear in the excerpt, for example, you can enter the <a href=”"> tag and it works!

From a usability standpoint it’s probably better to manually create excerpts because they won’t cut sentences in the middle like the automatic feature does, and you can write a compelling teaser that will draw your reader in if you use the Optional Excerpt field.

This post was originally published at Videos and excerpts don’t jive – and how to manually create excerpts on WP Garage - WP Garage - wordpress tricks, hacks, and tips.

After trying out many of the plugins available for helping WordPress users embed videos in their posts and Pages, the one that I find to be the best is Viper’s Video Quicktags plugin. Once activated, you can select which types of videos you want to become available on the editor. You can choose from YouTube, Google Video, IFILM, Metacafe, MySpace, Vimeo, Quicktime, generic video file format, and Flash (flv). Once you select the video formats, these appear on your visual editor as icons.

All you have to do is click on an icon, and a pop-up window asks for the URL of the video you wish to embed.

Viper’s Video Quicktags>>

This post was originally published at Viper’s Video Quicktags is the best for embedding movies on WP Garage - WP Garage - wordpress tricks, hacks, and tips.

A client gave me a 15 minute movie that they wanted uploaded to their site. The problem with such a long video is that it needs to be streamed, or else the user has to wait until a good portion is downloaded before they can view it. But adding streaming Flash video demands some Flash programming skills and the Flash software, from what I understand.

I decided to try to use one of the free online video sites. First I tried YouTube. The movie was rejected because of its length. Photobucket was even more restrictive in its size limitations. Then I did a search for “unlimited video hosting,” or something like that, and Google Video came up.

Google Video allows you to host videos with unlimited size and length! I don’t know why more people don’t use Google Video. Not only that, the embeddable player is prettier and less gaudy than the YouTube player, in my opinion.

The only limitation with Google Video is that you can’t upload Flash videos. But that’s not a major problem since you can easily convert Flash to Windows Media files with one of the free file conversion services like Zamzar.

I guess people like YouTube for its social aspect and community. But if you need to make a longer movie easily accessible, I highly recommend that you try Google Video!

This post was originally published at Adding unlimited streaming video to your site with Google Video on WP Garage - WP Garage - wordpress tricks, hacks, and tips.

This media player plays everything:

This version supports those types of files: rm, rmvb, ra, rv, ram, smil, smi, rtsp, rpm, asf, wm, wma, wmv, wax, wvx, ogg, ape, avi, mid, midi, wav, mms, m3u, asx, mov, qt, mqv, m4v, m4a, m4b, mpeg, mpg, m1s, m1v, m1a, m75, m15, mp2, mpm, mpv, mpa, flc, fli, cel, aiff, aif, aifc, cdda, bwf, rts, 3gp, 3gpp, 3g2, 3gp2, au, snd, ulw, smf, kar, qcp, sdv, gsm, amr, caf, amc, mp4, sdp, pdf, fdf, xfdf, xdp, xfd, gif, jpg, jpeg, bmp, png, xpm, dir, dxr, dcr, cst, cct, cxt, w3d, fgd, swa, swf, spl, mp3, flv, rtmp, rbs, xml, rss, xspf, atom.

This version also supports YouTube, Ifilm, VSocial, TuDou Video, atomFilms, BrightCove, YoQoo, 5 Show, 6Room, Mofile TV, OuOu, www.yijian.com, tvix.cn, ku6.com, biku.com, uume.com, cnboo.com, kuho.com, v.blog.sina.com.cn, quxiu.com, 56.com, v.wangyou.com, v.9you.com, maidee.com, pomoho.com, ROX.com.cn, imeem.com, gofish.com, veoh.com, GameTrailers.com, Evil Chili, Wildko, Yikers Videos & Games, Red Balcony Videos & Games, Live Video, Odeo Audio, Revver, MetaCafe, MySpace, GoEar, Break, Stupid Videos, Viddler, DailyMotion, I’m Vlog, RockYou, SevenLoad, MyVideo.de, Clipfish.de and Google Video.

CoolPlayer 9 for WordPress>>

This post was originally published at CoolPlayer 9 for WordPress on WP Garage - WP Garage - wordpress tricks, hacks, and tips.