If you’re looking to add videos to your WordPress blog, there are all sorts of options for integrating YouTube and other hosted video sites. There aren’t nearly as many choices when it comes to videos that you host yourself. By far the best I’ve found is Flowplayer (http://www.saiweb.co.uk/wordpress-flowplayer).

Downloading and installing it is straight forward and it has good instructions regarding the various configuration options. What follows are a couple of tweaks I made to allow for template shortcodes and to allow videos to be uploaded to your regular upload directories, even if you’re keeping files grouped by date (the default behavior for Flowplayer is to store videos in a specific folder on your server).

Changing the upload folder

I use the “Add video” button to upload videos to my blog. I have mine organizing files by year and month, so the path to a particular video looks something like /wp-content/uploads/2010/07/video.

In the flowplayer.class.php file go to approx. line 437, where you’ll find the following block of code:

Code block

<php?
else {
   $html .= '
   clip: {
     url:\''.$media.'\',
     autoPlay: '.(flowplayer::_getautoplay()=='true'?'true':'false').',
           autoBuffering: '.(flowplayer::_getautobuffer()=='true'?'true':'false').'
    },';
 }
?>

Change that to the following:

Code block

<?php else {
      $path = wp_upload_dir();
   $html .= '
   clip: {
     url:\''.$path['url'].'/'.$media.'\',
     autoPlay: '.(flowplayer::_getautoplay()=='true'?'true':'false').',
           autoBuffering: '.(flowplayer::_getautobuffer()=='true'?'true':'false').'
    },';
 }
 ?>

The wp_upload_dir() function (http://codex.wordpress.org/Function_Reference/wp_upload_dir) returns an array with various info. about your upload directory. So by assigning those values to the array $path, we’re then able to access the full url to the upload directory for the current post. This means Flowplayer is getting a full URL to your video.

Displaying Videos via Templates Instead of Pages / Posts

I had a project where I wanted to display a page of videos with a title, description and then the video. The catch is that I wanted to use a template to control the layout so I needed the video to be separate from the_content() as opposed to embedded. My solution was to add the video as a Custom Field instead of in the body of the post. Select the enclosure field type, then put the flowplayer code in the value box — ex: [FLOWPLAYER=youvideo.flv,350,250]. Because of the mod above, I don’t have to put any kind of a path to the uploaded video, just the file name.

In the flowplayer.php file, after line 26 ( which starts with add_filter(‘the_content’ … ) add another hook:

Code block

add_filter(‘get_enclosed’,'ncg_flowplayer_content’);

Then right after the end of the WP HOOKS, add a new function:

Code block

function ncg_flowplayer_content($content){
$content = $content['0'];
$content = flowplayer_content($content);
return $content;
}

Now you can output videos separately from the content in the loop with the following code:

Code block

global $post;
$src = get_enclosed($post->ID);

Note: The above code uses the value of the first enclosure, which works fine for my purposes. If you wanted to attach multiple videos or have various enclosures (pictures, etc.) that would require some further modification.

Putting it All Together

So now an example of how you put it all to use. I have a site where a user is posting weekly videos. They are displayed on a page that uses a custom template. To make it all work we first created a new post category, weekly-video. Each week the user puts up a new post with a description of the video content in the post body. They use the upload video button to upload that week’s video, then put the flowplayer code in the Custom Field enclosure field. They select weekly-video as the category.

On the page template, the following block of code displays the current video and description:

Code block

<?php query_posts("posts_per_page=1&cat=90&orderby=ID&order=DESC");
while (have_posts()) : the_post();
global $post;
    $src = get_enclosed($post->ID);
    echo "<div class='video'>".$src."</div>";
?>
<div class='description'>
<?php the_content(); ?></div>