WordPress 3.1 and the broken blogs

Progress! In the unrelenting march to some ideal, feature rich, future we have to occasionally update the WordPress software which normally amounts to clicking on the Automatic Update link and waiting a moment for the updater to do its thing. Alas the 3.1 update did not do its thing and the blog was broken; left bereft with only the message:

Unable to even log in to see what the problem was I turned to my trusty FTP software to get into the blog. The usual suspects are the plugins which add myriad enhancements but will often cause as many problems. Renaming the plugins folder, so WordPress will not recognise it, allowed me to get to the login screen; and once in I was greated with the message

Clicking the link to run the updater again successfully updated WordPress. Moving all the plugins back into the newly created plugins folder showed that it was not the plugins at fault this time but the errors seemed to be from my own child theme. So we are now back with a hacked about a bit Twenty Ten theme which will break when the next update comes along. Ho hum.

Seems there have been a few problems with the update.

Cimy Header Image Rotator and a Twenty Ten Child Theme

The previous post about rotating the header images in the Twenty Ten theme has been quite popular

but it was bad advice because as soon as you update your WordPress and/or theme files your changes are overwritten and lost. The solution is to move the changes into a child theme where they will overwrite the files in the original theme even when updating.

To make a child theme we simply create a folder in the WordPress themes folder (in the wp-content folder) and give it a name: mychildtheme (or whatever you want to call it).

We then save a plain text file called style.css into the mychildtheme folder. The style.css file reads:

/*
Theme Name: mychildtheme
Template: twentyten
*/

@import url(“../twentyten/style.css”);

#cimy_div_id {
clear: both;
border-top: 4px solid #000;
border-bottom: 1px solid #000;
width: 940px;
height: 198px;
}

Where the Theme name and Template are required to indicate the parent and the child. The import URL grabs the original style.css file to be altered by our style.css file. We then include the #cimy_div_id section that we had originally used in the header.php file.

Create a new plain text file and copy the contents of the header.php file into it. Replace the

<img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />

code with the


<div id="cimy_div_id">

<noscript>
<img id="cimy_img_id" src="http://yourDomain.com/somePicture.jpg" alt="" />
</noscript>

</div>

as before (we no longer need the styling here as it is in the style.css file), and then save this as header.php into the mychildtheme folder.

We can now preview and activate our mychildtheme as you would any other theme within WordPress. Our modified header.php will be used instead of the default header.php and our style.css will be used to make changes to the default styling. You can add further changes to the styling by adding to the style.css file in the child theme. The Firebug extension for the Firefox browser is a quick way to experiment with making changes before adding the code to your style sheet.

All original content may be freely copied. Illustration on packaging may not match content.
Batteries not included. Suitable for vegetarians. Open at the other end.