Genesis 2.0 – User Beware

Those of you that are using Genesis as your parent theme or framework may have noticed that there’s a new version available. Genesis 2.0 is a major overhaul to the old theme, including a fairly new structure, new hooks and actions, and completely new styles.

However, if you’re using a custom theme built on top of Genesis, all of these changes mean that there’s extra potential of something breaking.

This example shows the layout of a site in Genesis 1.9.2 and the way it changed after upgrading to 2.0

Traditionally, when I create a new child theme, I usually import the parent theme’s style sheet, and then build a fairly minimal style sheet for the child theme. The child theme’s style sheet simply overrides the items that need to be overridden from the parent, and adds any new styles that need to be defined. With the update to Genesis 2.0, I found out how dangerous this behavior can be. Because the entire base style sheet changed, with a massive redesign, any sites I have that were based on Genesis are now completely broken until I have a chance to overhaul the child themes. As a result, I have had to instruct my clients not to upgrade Genesis until I’ve had a chance to sort things out.

If you’re not using HTML5 support in Genesis, I’m not sure how many changes you’ll notice or how many issues you’ll have. However, if you were already using HTML5 support in Genesis, and you built your child theme the way I usually build mine, you might be in for a major surprise.

However, even if you did build your child theme without importing any of the base Genesis styles, you may still need to make some changes to your theme.

First of all, if you had HTML5 support enabled by using add_theme_support( 'genesis-html5' ), you’ll need to change that to add_theme_support( 'html5' ) instead.

Then, you’ll need to search and replace some instances in your style sheet. Be careful, though, when doing so; you don’t want to replace any old classes or IDs that start with the items in the search box, you just want to replace classes and IDs that match the items in the search box (for instance, if you have an element with an ID of “nav-header”, you don’t want it to get swapped out when you search for “#nav” in your style sheet).

You’ll also need to know that the structure of the HTML5 version of the theme changed a bit. For instance, the old structure of a post looked something like the following:

<div class="post...">
<h1 class="entry-title">Post Title</h1>
<div class="post-info">Date, author, etc. goes here</div>
<p>Post content goes here</p>
</div>

Now, there are a few more structural elements wrapped around things, meaning that you have extra styles to define or override. The new structure looks something like:

<article class="post...">
<header class="entry-header">
<h1 class="entry-title">
Post Title
</h1>
<p class="entry-meta">Date, author, etc. goes here</p>
</header>
<div class="entry-content">
<p>Post content goes here</p>
</div>
<footer class="entry-footer">
<p class="entry-meta">Categories and tags go here</p>
</footer>
</article>

As you can imagine, this may break quite a few things in your site when you upgrade, so I would not recommend updating Genesis on your production site right away. Even more than usual, you should be sure to update on a test site first, and then test thoroughly before you actually update on your production site.

As an editorial aside, I have to say I’m somewhat disappointed and a bit frightened by these massive changes to Genesis. One of the core tenets of WordPress is to maintain backward-compatibility and not break anything. However, in the past few versions of Genesis, they’ve made fundamental changes that potentially break a lot of things. In one of the 1.9.x releases, they removed some options from the Genesis settings, and, when you saved your Genesis settings, the values for those options were removed from your database automatically (meaning that, if your child theme relied on those options, things broke). In Genesis 2.0, the massive structural and style changes had the potential to break quite a few things in child themes. These changes can be a bit distressing for people that rely on Genesis to make their workflow simpler.

While I applaud the StudioPress team for moving forward, I also wish more time was taken to allow users to easily stifle some changes that were made. If they had included an alternative legacy style sheet for Genesis, and allowed site managers to easily choose that legacy style sheet in favor of the new style sheet, that would have gone a long way.

The main issue I have with the way things were done, though, is the way in which it’s done. If you upgrade WordPress and find that something broke, it’s simple enough to find an old copy of WordPress and revert the whole installation, or just a piece of it back. However, StudioPress only appears to make downloads available for the current version; there doesn’t seem to be any archive of previous versions to download. Also, with WordPress, you can constantly check out the trunk, or packaged beta versions in order to test upcoming releases ahead of time. With Genesis, you don’t get the opportunity to test the new version until it’s released into the wild.

With all of that said, you may find that nothing breaks at all. It all depends on how you were using Genesis and how your child theme was built. For instance, on WPHighEd, we’re using very few features of Genesis (we don’t really have any widgets set up, etc.) and we are using one of the official Genesis child themes (Education), which seem to have complete style sheets of their own, rather than importing the Genesis style sheet; we upgraded to 2.0 here and haven’t noticed any oddities yet.

I think the fundamental issue here is really a matter of identifying what Genesis should be. To me, as a developer, I think of Genesis as a skeleton or framework. However, it’s clear from the new changes that Studiopress is thinking of Genesis more as a base theme, now. Until Genesis 2.0, this wasn’t a major issue, since the base Genesis theme was simplistic enough to work well in both instances. However, with the new version, the base Genesis theme is now much more of a designed theme that can stand on its own, which makes it less useful as a skeleton off of which to base other customized themes.

I still plan to continue using Genesis moving forward, but this situation does give me a bit of pause. What do you think? Have you already upgraded Genesis on your site or sites? Did you run into any issues?