(x)html, css, php, sql, WordPress

Site redesign

robfelty.com 2.0
robfelty.com 2.0

I started my website in 2003. At the time it was hosted by the University of Michigan, where I was a graduate student. They gave all students some space for a personal website. It was really great, though it did come with some limitations, like no php or cgi allowed. I managed to kludge some server side includes and javascript together to get a fairly decent food website. I also had some other stuff on my site like some academic info. In 2006 I started a blog, and started learning wordpress. Since then, most of the new content on my site has been in my blog, and the rest of the site has kind of just been sitting there. I finally decided to try to integrate it all, for several reasons:

  1. Consistent style for all pages
  2. Get everything in a database (for better searching among other things)
  3. Learn some new technology

For that last reason, I had started to look at learning more about drupal, since I have seen a number of jobs looking for drupal developers recently. I spent a week or so looking at that in June, and got a little bit excited about a recipe module I found. However, I decided that I wasn’t crazy about drupal. I think WordPress is miles ahead of drupal in many ways. I was very surprised to find out that uploading pictures is not part of the core of drupal, but rather in a module (and not a very good one at that). Of course, up until WordPress 3.0, WP was mostly just a blogging platform. No longer! With version 3.0, WordPress can easily be used as a full-fledged content management system. So I decided to integrate the disparate portions of my website all into WordPress. During the conversion process I got to learn more about the new features in WordPress 3.0, especially custom post types.

robfelty.com 1.0 - food
robfelty.com 1.0 - food

The biggest challenge of the conversion was converting my recipes. Most of the old pages on my site simply became a WordPress page, but the recipes clearly needed special treatment. I thought I might use a custom post type for recipes, but after a little searching around, I quickly stumbled upon RecipePress, which basically does everything I was looking for (and does in fact use custom post types). RecipePress will work out of the box with any theme, but, upon my request, it also will let you use your own custom theme, which is the route I chose. One small dilemma I faced was that I had multiple pictures in some of my recipes, but I could not insert them into the post content, since RecipePress uses that for the recipe directions. Instead, what I ended up doing was using one image as a featured image, and then I wrote some custom code to display any additional images below the ingredients and contents, like so:

ID );
if (count($pics)>1): ?>

As I started to figure out how I wanted the navigation for the site to work, I also realized that I wanted to update some of the WordPress navigation plugins I have written – Collapsing Categories, Collapsing Archives, and Collapsing Pages. I added support for custom post types for the first two, and added an option for the pages plugin to only list subpages of the current page (this is how the navigation works for the academic, web design, and wordpress plugins portions of the new site). These features are all in the development versions of the respective plugins right now, but I should put out a new stable release soon.

While I was working on importing content from the old site, I also decided to make a new theme as well. I decided to try out the new child theme functionality in WordPress 3.0. It turned out to be quite easy. The only slightly confusing thing for me was how to disable some of the functionality of the parent theme. There are hints on how to to this in the TwentyTen functions.php file, but it took me awhile to actually figure it out. For example, I did not like how TwentyTen handles excerpts, so I wanted to remove the filters for the the except which TwentyTen adds. The way that WordPress handles child themes is that it first looks for the functions.php file in the child theme, and processes it all. Then it looks at the parent theme’s functions.php file and processes that. This means that if you try to simply remove a filter from the parent theme in your child theme, it won’t work, since the child theme is processed first. Instead, you have to do all of this in a function which is called in the after_setup_theme hook. Here is what I used in child theme functions.php file:

function robfelty_child_theme_setup() {
// We are providing our own filter for excerpt_length (or using the unfiltered value)
remove_filter( 'excerpt_length', 'twentyten_excerpt_length' );
remove_filter( 'excerpt_more', 'twentyten_auto_excerpt_more' );
remove_filter( 'get_the_excerpt', 'twentyten_custom_excerpt_more' );
add_action( 'after_setup_theme', 'robfelty_child_theme_setup' );

I also added in some CSS3 features, including rounded corners with border-radius, and gradients as well. As always, it is still a work in progress. Feedback is welcome.