Set up a Video Blog (or How to Add Flash Video to Your WordPress Site)

Posted on Aug 05 2006 by in Tutorials WordPress 

So you want to create the next Rocketboom (video blog). Or perhaps you have some video you want to add to your WordPress blog or website. Maybe it’s a video of last year’s Christmas party, a business conference you attended or the kids’ soccer game.

Maybe you have a business site and want to provide some video for customers and/or potential customers. For example, when I designed a site for Hi-Way Campers, an RV dealer, I included video walk-through tours of some of the RVs for folks who started their RV shopping online. Website video would also be great for restaurants, conference facilities, hotels, resorts, real estate brokers or anyone with a product people need to see.

Whatever your reason for wanting to add video to your site, it’s pretty easy with WordPress and a couple of other tools. Before anyone else mentions it, let me say at the outset that sites like YouTube, Vimeo, Google Video and the like also make it pretty easy to upload and share video. If, however, you’re a tad paranoid like me and you’d rather not rely on another service (who may insert ads into your video at some point) to help you share your video with the world, this tutorial is for you.

Step One: Gather Your Tools

1. A WordPress Blog/Site – Okay, so you probably already have this part covered. If not, this tutorial will show you how to download and install WordPress on your own server.

2. Download, install and activate the WP-FLV Plugin – This is an excellent little plugin created by Roel Meurders. It greatly simplifies the task of inserting flash video into your WordPress site.

Download the wp-flv.txt file from Roel’s site and change the file name to wp-flv.php. Next you’ll need to open your favorite FTP program and add the wp-flv.php file to your wp-content/plugins directory. Finally, visit the Plugin managment page on your WordPress site, and activate the WP-FLV plugin.

3. Download and install a free Flash video player. If people are going watch videos on your site, you’ll need to embed a Flash video player for them to use (don’t worry, it’s not as difficult as it may sound).

As a brief side note before we go further, the other way to distribute video is via download. In other words, you could simply link to the video file in your blog post, and allow folks to download the file to their own computer. A true video blog also distributes video via RSS feed. In that case folks use a piece of software called a podcatcher to receive new videos. The podcatcher software (e.g. iTunes, Juice, Newsgator, etc) automatically detects and downloads new videos for its user. This particular tutorial is geared more toward what’s known as “streaming video,” in which case someone visits your site and watches the video while there. So let’s move on.

Visit Jeroen Wijering’s site, and download his Flash Video Player 2.4. The player downloads as a zip file, so you’ll need to use your favorite unzip program to unzip it. If you don’t have an unzip feature already installed on your computer, you can download a free program called Stuffit Expander (for PC or Mac). After you unzip the file, you’ll end up with a folder named: flash_flv_player.

Next, you’ll need to upload the Flash player to your website. The actual file name you’re looking for is flvplayer.swf. You’ll find it in the unzipped flash_flv_player folder. Again, FTP that file over to your website. I strongly suggest you create a folder named “videos” within your main WordPress folder, and copy the flvplayer.swf file into that folder. This is also the folder into which you’ll need to place your video files once you have them ready (more on that later). If the video files and video player are not in the same folder/directory, this won’t work.

Step Two: Create Your Video

Now that you have everything in place to play videos from your WordPress site, the next thing to do is actually create and publish your videos. Again, you’ll need some tools for this part as well. Before we get to that, however, lets talk about file formats.

The Flash Video Player you just installed will only play Flash Videos, which have a file name that looks like this: filename.flv (notice the .flv file extension). If your digital video camera is anything like mine, it will probably create video files in what’s known as Quicktime format. Quicktime files have the file extension .mov. So you’ll have to convert those files to the .flv format. Again, this is much easier than it sounds, and that brings us to the next free tool you’ll need.

1. Download the free Riva FLV Encoder. This is a cool little program that will convert various file types (e.g. .mov, .avi, mp4) into the .flv format. You can download the program here.

The Riva Encoder is pretty intuitive to use. There’s a box for you to enter the file you want to convert, and there’s the “Encode” button (click the graphic to the right for a larger view). On the right, you can set some of the parameters for the output video, such as size and quality. I use a file size 320×240, but you can decide what size you prefer. As for teh other parameters, I simply use the default settings, but again, you may want to experiment with different ones. After you’ve converted your video to the .flv format, you simply need to FTP it into the same folder/directory where your Flash video player is installed (see above).

We’re in the home stretch. Just one more step.

Step Three: Publish Your Video

Again this part is pretty easy. It’s as simple as writing a new post on your WordPress site. In fact, that’s all it is … with one little twist. Before we get to that, however, you need to set the correct parameters for the WP-FLV plugin we installed up in step one.

So, login to your WordPress site, and click on the Options tab. In the submenu, you’ll see a tab that says “WP-FLV.” Click on it. In the top box, you need to tell WordPress where the Flash video player is located. If you followed my directions above, all you need to enter in this first box is: http://www.yourwordpresssite.com/video/flvplayer.swf (just change the “yourwordpresssite.com” portion to whatever your is).

Click the graphic to the right, and you’ll see the other settings you need to set. In the “Default movie size” box, make sure you use the same size you used when you converted your videos with the Riva Encoder above. After you enter your setting, click the “Update Options” at the bottom.

There’s one more thing to take care of before you publish your first video. The WP-FLV plugin only works if you’re NOT using the WordPress WYSIWYG or “Rich Text” editor. So, click on the Users tab from the top menu. At the bottom left of your profile, you’ll see a checkbox with the phrase “Use the visual rich editor when writing” next to it. Make sure this box IS NOT checked. If it is, uncheck it, and click the “Update Options” button. After that, you’re ready to publish your first video.

Click on the Write tab from the main menu to create a new post. Just above the Post box, you’ll see a quicktag that says “FLV.” Click that button. This will open a new box that asks you for the file name of your video. It will probably already have “/video” in the box, so all you have to do is add the video’s file name after so it’ll end up like this /video/filename.flv.

The next series of boxes that come up should be filled in by default. The final box will ask “Do you want this video to start playing automatically?” Just click the cancel button because you DON’T want the video to start playing automatically (there’s nothing more annoying than going to a site and immediately some strange video starts playing in your face).

After you click the cancel button, you’ll end up with something in your post box that looks like this: [flv href="/video/filename.flv" width="320" height="240" autostart="false" /]. If you want to also write some commentary on the video, you can do that as well. If not, just click the publish button, and you’re all done.

And that’s it. You now have a video blog (minus the RSS video distribution). If you do use this tutorial to add video to your site, I’d love to hear your feedback, and see your site, so please shoot me an email or leave a comment on this post. Likewise, if you have troubles, share those as well, and I’ll try to help you get them sorted out. Happy Vlogging!

Don't miss it!

10% discount for limited time only. Subscribe to our newsletter and get instant access to the discount on all our products!

x