Last week Ivan Misner asked me to add some features to the BNI Podcast website, namely the Digg Digg and the Translate This Button plugins. Installing plugins is a simple enough task, as anyone who works with WordPress knows. Configuring them, however, can take some time. I determined that a horizontal layout was best for the Digg Digg sharing buttons given the fact that they showed up right under the podcast player. The translator is normally meant to live in a widget; to put it elsewhere, one needs to edit the theme files. Again, this was a fairly painless process.
But it was getting late and I was getting sloppy, and I didn’t do what I usually do, which was to make a copy of the unedited files before changing them. In the case of the page templates for the blog index, single post, and “static” pages, that didn’t matter: I got it right the first time and what I did was simple enough that I remembered all the steps and could have undone it. I still don’t recommend that, however, because after doing all of that successfully, I overstepped myself.
I was just checking that everything I’d done looked right on the site when I noticed that the photo of Dr. Misner on the “About” page wasn’t aligned correctly. And, in fact, when I tried to align the photo to the left of the text, it worked in the visual editor, but didn’t display properly on the public-facing page. “Hmm,” I thought, “I wonder whether Brady forgot to code the image alignments into the theme.”
So I went and took a look at the stylesheet. This is a text file full of CSS code that tells browsers where to put images and design elements and what colors and fonts to use when they render web pages.
And here’s where I made my big mistake.
A few months ago BNI launched a huge re-branding effort and there was a minor site re-design with a new logo, header and menu style. I wasn’t the one to do that work; the copy of the stylesheet I had on my computer was actually from the previous redesign.
And I forgot to look at the dates on the files and download the new one to work on before adding the code for image alignments and captions. That’s an embarrassing n00b mistake. I should actually have downloaded a full copy of the theme files as soon as the new design was up there, but I didn’t. I can’t even say that I thought I’d done it. I didn’t think about it at all.
So I added the new CSS code to the old file, uploaded it to the server, and overwrote the stylesheet that told WordPress where to find the new header and how to display the new menu.
Oops.
I would have been in very serious trouble if Brady hadn’t had a local copy of the CSS file that I had just obliterated. This time I saved a backup copy of it with a different name before adding the code for the images.
Here’s what I should have done, and indeed what I normally do:
Image via Wikipedia
- Downloaded the complete theme files that were on the server and saved them in a folder called
- . - Compared that date with files I already had on my computer, and also, if necessary, compared the contents of those files. Renamed my local copy of the theme to
- - Created a new set of theme files to edit, either by downloading them again, or by copying them locally. (Most WP theme files aren’t large and don’t take long to download, unless they have both a lot of custom page templates and a lot of images. This one doesn’t.)
- After the work was finished and the files uploaded, renamed the working folder to
- . - Backed all those files up in my next set of local backups.
This is a manual method of doing what software developers know as version control or revision control. Real programmers use version control software like Subversion to handle this kind of thing for them, particularly if they’re working in groups on the same project.
That seems to me like overkill for websites, where the code tends to change only once in a while rather than undergoing continuous development. But it would probably be a good idea for me to start backing up the site’s theme files on a more regular basis. (The content of the BNI Podcast site changes much more frequently; I get weekly backups of the database that stores that e-mailed to me, and I already have local backups of the audio files.)
Whether you’re dealing with CSS or Microsoft Word, it never hurts to save a copy of the original document before you start messing around with it. There are times when the “Undo” function can’t help you.
