EvoBloggito

Child Themes: A Sanity-saving Approach to Redesigning/Hacking WordPress Themes

Author: Ray Gulick; Published: Oct 26, 2011; Category: WordPress; Tags: Child Themes, Design/Development, WordPress Themes; No Comments

A friend of mine, relatively new to implementing WordPress sites, emailed me yesterday asking for some advice. She was using Twenty-eleven as her base, and she had run into some problems bending it into the shape she wanted it. I called her and took a look at what she was doing. It became clear that the theme was already beginning to depart significantly from the original template code. Rather than creating a child theme, she was hacking page templates as well as CSS. Moreover, she sent me the Photoshop template that represented where she was headed, and I could not determine any relationship, structurally or visually, with Twenty-eleven. Twenty-eleven seemed to be the wrong theme for what she wanted to accomplish.

She wanted to know of a resource that would tell her how to get from the out-of-the-box Twenty-eleven theme to where she wanted to go with it. Lamely, I told her there was no such resource; no one could anticipate all the changes people would want to make and write a how-to covering them. Even more lamely, I told her she would just have to “hack away” and visit the Codex and wordpress.stackexchange.com when she encountered a problem. We briefly talked about child themes. Then she went away, disappointed.

As I thought about it, knowing I hadn’t been very helpful, I realized there was a basic mis-understanding about choosing a theme and designing around its structure and functionality. Someone had told her to design her theme in Photoshop, then select a good theme and hack it. Either they had not told her, or she had not understood, that theme selection is step one, then design should be based on that theme: utilizing its basic structure and incorporating whatever functionality it has that is useful for the particular site. I’m betting on the former: those of us with some experience are notoriously bad about skipping important bits of information when advising people with less experience.

Here is the list I sent her, suggesting she back up and start over:

1. Use the child theme approach, leaving the original theme and its functionality intact. Some themes get updated, fixing bugs or adding functionality. Using a child theme allows you to take advantage of theme updates while maintaining your look-and-feel. http://codex.wordpress.org/Child_Themes
2. Find a theme that is as close as possible, structurally, to what you want to end up with, and work within its structure as much as possible. Ideally, all you want to change is the appearance. This is like finding a house plan that suits you, then customizing it with floor coverings, wall coverings, paint, decor, and landscaping. Contrast the ease of that approach with starting with a 3/3/2 plan of a 1500-sq-ft single-story ranch, then changing it into a 2/2/2 plan of a 1800-sq-ft two-story Tudor; you probably should have started with a different plan.
3. Once you’ve settled on a theme, create a Photoshop design template based on screen shots you’ve made of the theme demo (some themes provide a design template). Add guidelines that define the header width, content width, sidebar width, etc.
4. Now you’re ready to design your theme.
5. Try to change only things that can be changed using CSS: backgrounds, typography, color, position, etc.* This approach lends itself to using a child theme.
6. Make a copy of the theme style sheet, make the changes at the top as described in Codex (above), and place it in a folder with a clever name, such as “mychildtheme.” Or even more clever, if you like. Upload the folder to your themes folder and activate the child theme. Hack away at the child theme CSS to implement your design changes (you may need to add an images folder to the child theme for background images). This is fun! Or at least, more fun than changing the ranch into a tudor.

*You can change column widths and position (structure) with CSS, but there are rarely only one or two places where those changes will need to be made. Can. Worms. You get the picture.

Why I’m announcing a site redesign, even though I think redesign announcements are lame.

Author: Ray Gulick; Published: Jun 20, 2010; Category: Content Management System, Design/Development, WordPress; Tags: Design/Development, WordPress, WordPress Themes; 2 Comments

When I see announcements about website redesign, my reaction is either a yawn or, if I’m feeling more energetic, a quick mental note: “So what?” So it’s more than a little ironic that I’m announcing the redesign of my own website, evowebdev.com. But after all, what are blogs for, if not to tell your readers what’s going on with you, particularly if it may have value for them?

The value for my readers (I know you’re out there, I can hear you breathing) is perhaps the realization that WordPress, on which the site is based, is fundamentally a solid, reliable, flexible web design and development platform for business websites. While this is not the first version of this site on WordPress, the redesign was very different. In the past, redesign meant “rebuild” as much as redesign. This time, I was able to focus almost entirely on design and messaging: there was nothing to rebuild (although I did upgrade to WordPress 3.0).

In New Mexico, including Santa Fe and Albuquerque (generally regarded as reasonably sophisticated), developers and designers have been slow to catch on to WordPress as a web development platform. Lots of them have created a blog or two with it, but not many have embraced it as a content management system (CMS) for full-blown websites. I had a difficult time this spring finding other local WordPress developers interested in hosting a WordCamp, so I shelved my hope of having WordCamp Albuquerque as premature (maybe in 2011).

Meanwhile, nationally, WordPress is catching on like wildfire as a development platform. Even major companies use it. WordPress has emerged as a leading CMS; in terms of numbers of websites and developers supporting it, it has achieved critical mass that allows companies to have confidence that it’s a stable and solid platform.

And, of course, it’s famously easy for WordPress website owners to update their own sites.

If your website is still static, it’s time to think about moving to WordPress. But don’t think about it too long, or you’ll be behind the crowd.

Evo4 CMS Earns Silver Rating by ThemeGrade

Author: Ray Gulick; Published: Oct 14, 2009; Category: Blogging, Design/Development, Zeitgeist; Tags: Design/Development, WordPress as CMS, WordPress Themes; No Comments

ThemeGrade is a website that tests and grades WordPress themes for general code compliance and for on-page SEO. Our recently launched theme for professional designers using WordPress as a CMS (Evo4 CMS) scored 6 of 7 points on the SEO portion, and 12 of 16 points on the general portion of the test (2 points were deducted because we don’t offer support: It’s a free theme! Who in their right mind would offer support for a giveaway?) At any rate, a silver rating puts Evo4 CMS in good company, in the top 30 of more than 175 themes currently, and we’re really pleased that our first theme did so well.

Other than offering support (maybe on the next release, we’ll make it paid and offer support), we’re looking at the areas where we lost points to see how we can fix them, or if fixing them is even desireable. For instance, we lost a point by not having nested or threaded comments. I’m not sure we want to “fix” that. First, few people use or want nested or threaded comments, and second, if they do, there are some pretty good plugins available to make that happen.

We lost another point having to do with sidebar link heirarchy. Frankly, I’m not sure what that is, but I will find out. And I’ll also do some research on what the SEO issue is with “home page heading.”

Evo4 CMS WordPress Theme Launched

Author: Ray Gulick; Published: Oct 1, 2009; Category: Content Management System, Design/Development, WordPress; Tags: CMS, WordPress Themes; 2 Comments

We’re really thrilled to announce that we’ve launched Evo4 CMS, a free theme for WordPress that is specifically made for building business websites that include an integrated blog. These are the kind of sites Google finds really attractive, provided the content produced on them is focused and frequently updated (always a catch!). Evo4 CMS is not much to look at as downloaded: just a dull gray, blank canvas. But that is easily remedied by a skilled designer who can use the provided structure on which to render a gorgeous website.

EvoBloggito and evowebdev.com are built on a beta version of the theme, and just last week we launched storiesthatsellguide.com on the theme, so it’s been shaken out and had the bolts tightened as needed. While we’ve made it available for download to anyone, we really don’t care if anyone downloads it or not. We created it to provide ourselves with a better platform and starting point for the kind of websites we’re building more and more often: business websites with integrated blogs, which are updated by our clients. So WordPress functions as the content management system our clients use to update their website as well as their blog.

You can review the (very gray) demo site here, with a look and feel only a programmer could love. But if you know how to look beyond the surface and inspect its structure, we think you’ll be impressed. Because we made the theme for designers, we’re also making a companion Photoshop template available for download, to assist with the page design phase.

Why is it so gray? A couple of reasons. Frankly, we want to discourage amateur bloggers from selecting the theme for their blog. It’s not really the best choice for a blog-only website, and we don’t want all the email from amateur bloggers asking us how to do whatever it is that their inexperience keeps them from understanding. More important, however, we wanted as close to a blank slate as we could get in terms of appearance; nothing that could steer the look and feel for a particular client. We don’t want it to be obvious by appearance that two different client websites both used the same theme as a starting point.

So there you have it, our first WordPress theme. I think there will be more, but first we need to make some hay with this one.