add_filter( 'the_category', 'add_nofollow_cat' );
function add_nofollow_cat( $text) {
	$strings = array('rel="category"', 'rel="category tag", 'rel="whatever may need"');
	$text = str_replace('rel="category tag"', "", $text);
	return $text;
}

Lots of info and tutorials on the net on the subject of WordPress “theme options” or  ”admin” pages. Many of them are out dated and don’t subscribe to the current best practices as outlined by WordPress – in other words the settings API. Nettuts is always a great place to start. In my case, the tutorial the resinated the most with me was a fairly recent post by Aliso The Geek. Her tutorial is clear, easy to follow, results in a organized tabbed theme options page and best of all, your new WordPress theme options page will be 100% contained within a tidy class file – easily transferred from theme to theme is so desired.

So what’s left to expound upon?

Not much, unless you’d like to include and upload field. The easiest way to implement this, with some possible pitfalls (more on this later), is to use WordPress’ built in Media Uploader and Thinkbox script.

Step one: Back to your theme options class

Since we are adding a new “type” we’re going to need to add a new case to the switch statement.

case 'upload':
default:
   echo '<input id="' . $id . '" class="upload-url' . $field_class . '" type="text" name="mytheme_options[' . $id . ']" value="' . esc_attr( $options[$id] ) . '" />'
   '<input id="st_upload_button" class="st_upload_button" type="button" name="upload_button" value="Upload" />';
if ( $desc != '' )
   echo '
   <span class="description">' . $desc . '</span>';
break;

Essentially the same as the ‘text’ case. Change type to “file”, add an input button with a class of “st_upload_button” (or whatever you so desire) that will later trigger the media uploader.

Step Two: Add the upload field Array

		$this->settings['st_upload'] = array(
			'title'   => __( 'Example upload Input' ),
			'desc'    => __( 'This is a description for the upload input.' ),
			'std'     => 'My logo',
			'type'    => 'upload',
			'section' => 'general'
		);

Nothing new here…

1. Name it what you want
2. Your title
3. Your description
4. Default Value (for the text field in this case)
5. Type (our new type, yay)
6. Whatever section you’d like to appear

Refresh your WordPress theme options page and your upload field should be present and look something like this:

Step Three: Gather the tools

First we need to load a few scripts and styles.

1. Medial Uploader script
2. Thickbox script
3. Thickbox CSS
4. And finally, “my-upload” script

We already have a scripts() and styles() function in our class, so this is really quite easy.

//Media Uploader Scripts
wp_enqueue_script('media-upload');
wp_enqueue_script('thickbox');
wp_register_script('my-upload', get_bloginfo( 'stylesheet_directory' ) . '/js/uploader.js', array('jquery','media-upload','thickbox'));
wp_enqueue_script('my-upload');

//Media Uploader Style
wp_enqueue_style('thickbox');

Step Four: Make it do something cool

jQuery(document).ready(function() {
	jQuery('.st_upload_button').click(function() {
		 targetfield = jQuery(this).prev('.upload-url');
		 tb_show('', 'media-upload.php?type=image&TB_iframe=true');
		 return false;
	});
	window.send_to_editor = function(html) {
		 imgurl = jQuery('img',html).attr('src');
		 jQuery(targetfield).val(imgurl);
		 tb_remove();
	}
});

When the upload button is clicked, we launch the WordPress media uploader and set the ‘targetfield’ variable to the previous text input. We’ll swing back around for this later. Next we overwrite send_to_editor,  get the image URL from the SCR attribute and then finally put that value in the target field.

Pitfalls?

My main complaint with the media uploader in this situation is it’s not particularly intuitive for clients or people not familiar with the finner details of WordPress. One has to either upload an image or choose from the media library and then click “insert into post”. On the other hand, it is consistent with the rest of the WordPress GUI and allows you to choose from already uploaded images.

Embed Tag

<embed type="video/mp4" width="352" height="299" src="http://www.justinwhall.com/wp-content/uploads/2012/01/test.mp4" />

Object Tag

<object width="352" height="299" data="http://www.justinwhall.com/wp-content/uploads/2012/01/test.mp4"></object>

Video Tag

<video width="352" height="299" controls="controls">
<source src="http://www.justinwhall.com/wp-content/uploads/2012/01/test.mp4" type="video/mp4" />
Your browser does not support video
</video>

And finally according to imfamous and highly contraversial W3schools

The “best” solution

<video width="352" height="299" controls="controls">
<source src="http://www.justinwhall.com/wp-content/uploads/2012/01/test.mp4" type="video/mp4" />
<object data="http://www.justinwhall.com/wp-content/uploads/2012/01/test.mp4" width="352" height="299">
<embed src="http://www.justinwhall.com/wp-content/uploads/2012/01/test.mp4" width="352" height="299"">
Your browser does not support video
</embed>
</object>
</video>

How many barking dogs can you see? So where does this leave us? Well, you can begin to understand why you see so many Youtube and Vimeo embeds across the web. It’s just easier to let them do the heavy lifting…

That being said, for each an every site I’ve initially installed it on, I’ve encountered this issue initially. If you follow the following workflow, baring any wild abnormalities or javascript conflicts, I’m certain you’ll experience similar results.

1st

You are going to want to set default templates. For the various aspects of your site. Aside from setting a default title format to be output for various pages, posts, tags, categories, etc, it resolves a lot of duplication issues.

At the bottom there is a reference for various formatting options. Pick your poison.

Keep in mind, whatever you use between your template tags will be output as well. In my case I generally use “|”. No go check your titles, see how they look now. Keep in mind Yoast has provided both a link to the home page and blog page on this very page. Edit that at will.

2nd

I took an additional step and manually customized my title a bit. To do such. You are going to want to locate your themes header.php file open it and locate:

<title><?php echo wp_title("") ?></title>

It’s possble that there could be something other the above between the title tags, but either way, I’ve replaced it with:

<title>
<?php
if(is_page('home')) { echo bloginfo("description"); echo " | "; echo bloginfo("name"); }
else if(is_home()) { echo bloginfo("name") . " | " . "Blog";}
else { echo wp_title(""); }
?>
</title>

A little explanation is in order…

First, we check to see if it’s the home page ‘is_page(‘home’)’. In my case, my home page is actually named “home”.  If it is, we output the “the blog info | the blog description”  These can be found  in the WP backend > settings > general. Note: If yours is something else, replace accordingly.

Then we us the is_home() conditional tag. This is misleading. You would expect it check to see if it’s your HOMEPAGE. What it ACTUALLY does, is check to see if it’s your main blog. Tuck that one away. That one tripped me up more then once before I committed it to memory. Regardless, if that returns true the output is: “The Blog info(name) | Blog”. Note: You can change Blog to whatever you see fit.

Finally , neither of these conditional tags are met output   “wp_title(“”);” and let Yoast do the rest. How’d it work for you?

You enter you permalink structure of choice (min happens to be /%postname/) and click save. After checking you site to assure nothing has broken, you realize that all you custom post types through a 404 error. Hmmmmmm. When this happened to me, I double checked that my upload went alright and then changed my permalinks back to defaults and then everything worked again.

Turns out there is a bit of a bug here, so I wasn’t actually going crazy. If you’ve found this page becuase you’ve had a similiar problem do the following:

1) Assure that you do not have any wierd rewrite rules going on in your .htaccess file

2) Change permalink structure

3) Create post

At this point, if you are still getting a 404…

1) Clear browser cache

2) Flush rewrite rules simply by visiting your permalink page. Can’t hurt to save again I suppose.

3) Create new custom post