Your Free 14-Step Guide to Success
Create an SEO-optimized, Social Media-friendly pro site in one night. Wake up an employee, go to bed an entrepreneur!
Follow Us on Twitter

How to Build a Pro Video Blog in One Night – WimbleTube.com

Posted on Tuesday, 30th June, 2009 by One Night Site

wimbletube.com was built in one night using the WooTube Wordpress themeToday’s post is a case study to show One Night Site in action. As the Wimbledon Tennis Championships are running right now, I thought it appropriate to combine timely content with our example.

Over the course of this article, we’ll create a professional video blog using Wordpress, while following the 14 steps. I’ll put a timestamp beside each step to show the ongoing timeline (although it’ll be delayed a little because I’m writing at the same time). If you want to set up a video website or blog like YouTube then this case study should be useful for you.

Step 0 – Pick a Domain

12:15pm

Ok, so I want a video site like YouTube.com, and it’s going to be about Wimbledon, so I ran through a bunch of name ideas and decided on the name WimbleTube.com. I checked whether it is still available or not and luckily it is! Maybe I’m the only person silly enough to come up with a name like that. Anyway, I went ahead and bought the domain for 1 year for about $8.

Step 1 – Register & Host Your Domain

12:24pm

I already have a hosting account set up, so I’m going to use my existing host for this lesson. With most hosting providers you can do what’s known as an Add-On Domain. To do this I went to my cPanel administration panel (if you have a hosted account you should’ve got a welcome account details email that tells you how to get to your control panel). In cPanel there is an Add-On Domain option. In there you can add your newly purchased domain name.

Setting up an addon domain for your wordpress blog Check out the screenshot to see how I filled out the form. Note: I changed the document root from /public_html/wimbletube.com to be /wimbletube.com as it makes it easier and tidier on your server (and my friendly hosting support staff recommended this is how I should do it).

Step 2 – Install Wordpress

12:40pm

Following Step 2, I got Wordpress installed quickly and easily in a few minutes. Now I just have to wait a while for the WimbleTube.com domain to propagate around the internetz and work when I type in the URL.

Step 3 – Find a Wordpress Theme (Design)

12:47pm

This is always one of my favorite steps cos I get to check out designs and pick one for the site. In order to make a good decision about which theme to use I asked myself some questions:

  1. What do I want it to look like?
  2. What does it need to be able to do?

It’s pretty basic fro this site, I want a Wordpress theme that is video-centric, but which I mean that it’s clearly heavily focused on videos, hopefully with a big video player with fullscreen capabilities. I’d also like it to have some kind of green in the design so that it can represent my Wimbledon subject matter appropriately.

First, I checked through the Wordpress Video Themes I recommend in Step 3. Tubular had some green in it but it felt too industrial. The other 2 were also a bit serious or dark.

Next, I visited each of the 5 main Wordpress Theme design studios and just walked through all of their theme galleries:

WooTube Wordpress video theme I struck gold (or green) on the WooThemes site. They have a WooTube theme that is dead simple and had some green in the logo. Upon further inspection it also has a few different color schemes including green. AND the logo would be pretty easy to re-purpose for my name.

I ante’d up the $70 for the theme and downloaded it to my desktop. A pretty good deal to get a professional blog design for under a hundred bucks. WooThemes also have a permanent 2 for 1 offer so I got the Papercut theme too because it’s got a beautiful background design.

Step 4 – Download Wordpress Plugins

1:03pm

My domain still hasn’t registered (no surprise – in my experience it usually takes about 30 mins at best and 2 hours as standard). So I’m going to rock on through Step 4. This one is real easy, you just follow each link and click the download button, then unzip all the folders and keep them saved in a folder on your desktop.

I’m going to download all of the essential ones as recommended.

Step 5 – Create Social Networking Profiles

1:13pm

I already have accounts set up at all of the major social networking sites for submitting content to such as Digg and Reddit, so I’m just going to set up a new Twitter account for Wimbletube – http://twitter.com/wimbletube. Don’t expect too many updates on there as this is just a case study :)

Step 6 – Basic Wordpress Blog Setup

2:36pm

Ok, I went for lunch and by the time I came back, WimbleTube.com is registering when I type it in my browser. Awesome. So now it’s time to dig into Wordpress and get it running.

At this point there’s not much point in me rehashing the Wordpress setup process, just follow Step 6. Note, you’ll have to register a free account to see Step 6 onward. It’s simple and free and we let you ask us 1 free question per month if you get stuck at any point.

Essentially, we’re just getting Wordpress in a more usable state, adding in your blog’s title, email address and some other basic housekeeping stuff. It’s quick and easy.

Step 7 – How to Install a Wordpress Theme

2:16pm

In Step 7 I’m going to upload my WooTube theme and see what it looks like out of the box.

Default view of WooTube wordpress video theme After activating my theme, it looked like this. As you can see it’s pretty bare when installed, but it at least works.

When I installed it, I got a WooTube button at the bottom of the Wordpress admin menu, so I clicked on that and found all of the theme options, which should help to set it up better.

I made the following changes:

  1. Changed the ‘Theme Stylesheet’ to Green.css to match the Wimbledon grass!
  2. Added my ‘Twitter Username’ – wimbletube
  3. Checked all of the boxes under ‘Homepage Options’ as it produced the best layout. (I tried them all out in stages to find out what they did).
  4. Turned off the Banner Ads as I’m not planning on doing any advertising.

I also went to the default ‘Hello World’ post and added a video link from YouTube to see how a video would look in there. I just picked any old Wimbledon video for this. In the Edit or Add Post screen there is a field at the very bottom that lets you paste the Embed Code from YouTube to display a video.

Tweets instead of Ads!

A great thing about this theme is that if you take away the top banner ad and add a Twitter username, you get your latest Tweet appearing in the top-right corner – brilliant! I did a quick test tweet to test it and it works beautifully.

Here’s how it looks now:

WooTube after a few settings changes

Much, much better!

In the settings page there is also a link at the top that takes you to the WooThemes Support page where it pointed out a few more things I’d need to do, such as install the WP Post Ratings plugin (see Step 4 for a link to this plugin).

Wordpress Plugin Tip

To install a Wordpress plugin more quickly, you can go to the ‘Plugins » Add New’ page in Wordpress and search for it by name, then you can install it directly from within the software.

Step 8 – Install Wordpress Plugins

3:00pm

Next up was installing the plugins. As I mentioned in the last step, there is an extra one required for this Theme – WP Post Ratings. With some theme developers, they include a plugins folder with the theme, but this time they just mentioned it on the help page. I prefer when the files are all bundled together, but you can’t have everything.

Step 8 covers all of the gory details of this part. So again I’ll just refer you to there for the standard ones. For WP Post Ratings plugin, I did a quick check in the plugin settings an it didn’t need any extra tweaking to get it up and running. After I activated it and looked at WimbleTube.com there were nice star ratings in place for the posts.

Step 9 – Create Site Architecture

3:16pm

It’s time to decide how to structure WimbleTube.com. To keep it simple, I’m going to have 2 standard pages:

  • About
  • Contact Us

So I created these in the ‘Pages » Add New’ section of Wordpress.

For categories, I just created a bunch of obvious ones:

  • Funny
  • Highlights
  • Champions
  • Classic Matches
  • Federer

Note, that your categories usually won’t show up in your site’s navigation until you actually make a post in that category (to prevent pages of empty content).

Top Level Categories

I installed another plugin to get rid of an annoying problem with Wordpress category URLs. By default, any categories you add have this path: www.wimbletube.com/category/funny but I want it to be www.wimbletube.com/funny without the word category (which is somewhat redundant). So this plugin solves this problem beautifully. Note however that I’ve tried using this plugin on older versions of Wordpress (I’m using the latest one – 2.8) and Wordpress MU and it caused some problems, so make sure you are using the latest version of the regular Wordpress before trying this plugin. (Wordpress MU is a multi user version of Wordpress).

Step 10 – Create Business Emails

3:24pm

I’m only going to create one email for the time being: admin@wimbletube.com. If you are doing this yourself – you should add as many as are needed and follow Step 10 for reference.

Step 11 – Google Analytics

3:26pm

I added WimbleTube.com to my existing Google Analytics account, pasted the Javascript code it provided me with into the footer.php file and uploaded it via FTP to my blog’s server. Step 11 goes over this process in detail for those who are unfamiliar.

Easy Google Analytics Setup

You’ll notice in some Wordpress Themes that they have a field in the ‘Theme Settings/Options’ in Wordpress that allows you to enter the analytics code directly, without having to edit files or copy them to your server. WooTube allows this, and to get it working you just need to extract the UA number from the Javascript shown to you. It will look something like this: UA-9573434-1. When you enter this in the Theme Options and save it, it will create the analytics code for you on your blog.

I prefer to do it manually because I’m used to it, but it’s a good shortcut if the option is there.

Step 12 – Create Base Content

3:34pm

To get my blog up and running, I’m just going to write some silly welcome and contact information in my 2 pages, and then create 3 blog posts with Wimbledon videos.

Having done that I noticed that the small posts (everything but the primary one), didn’t have pictures in them. Checking the edit post page, there is a setting at the bottom that lets you add a thumbnail photo to act as a placeholder for the video until someone clicks through to the post permalink page. To create these thumbnail images, I just took quick screenshots of the videos in YouTube, cropped them down to a suitable size and uploaded them to each of the posts.

To figure out the URL of each photo to insert into the field on the post page, I used the ‘Insert In Post’ feature of the media uploader. This placed the image in the blog post (which I didn’t want) and let me cut and paste the path of the thumbnail. Then I just deleted the reference to the photo from the blog post text itself.

Updating the Logo

Lastly, I needed to change the logo to say WimbleTube instead of WooTube. If you buy the Developer Package for the WooTube theme, you get the Photoshop files included which lets you edit the logo file more easily. As I’d just bought the cheaper license, I opened up the /images/logo.png file from the theme folder and created a different version in Photoshop. Luckily it was created with a fairly standard font ‘Myriad Pro’ that I already had. Sometimes you just have to go with a close approximation.

This is where it helps to have a friend who’s a designer who can help you out with creating a custom logo.

Once I had uploaded the new logo (I named it logo1.png) to my WimbleTube.com server, I went back into the WooTube Options in Wordpress, and added the path to the new logo into the ‘Custom Logo’ field and saved the options.

Creating a Favicon

I did a post last week about how to create a custom Favicon for your Wordpress Blog. I’m going to do this now to give the site a little more professional polish.

Step 13 – Google Webmaster Tools

4:25pm

Next I followed the guidelines in Step 13 to set up a Google Webmaster Tools account for this new blog. This wasn’t 100% necessary for me this time as I’ll be unlikely to use this site past the purposes of this demo, but it’s a good idea to get Google coming to visit just in case.

I added WimbleTube.com to my Webmaster Tool account, copied the Verification Tag into the header.php file and uploaded it to my server. After clicking the verify button Google Webmaster Tools confirmed the site.

Next I added my http://wimbletube.com/sitemap.xml Google XML Sitemap file so that Google would come to index my site more quickly.

Step 14 – Launch WimbleTube.com

4:30pm

Hooray! My blog is now live and looks great. Because I set up Twitter Tools in Step 8, my Twitter account will automatically Tweet about my new blog posts from now on.

Here’s how the final blog looks

The final WimbleTube.com Wordpress blog

It’s 4:30pm and we started at 12:15pm! We successfully created a pro Wordpress blog in about 4 hours.

What Now?

Now that the blog is in place, it’s time to really write some good content and start promoting your site via the Social Networking tools mentioned in Step 5.

If you enjoyed this case study and lesson, please give Re-Tweet this post back up at the top of the page to share it with your friends on Twitter.

One Night Site

Please Leave a Comment

avatar

Your name

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>