If you’re putting together a new blog, or simply aren’t happy with the layout of the one you have, then you’ve probably spent endless hours browsing free and premium theme sites to find the perfect layout for your blog. You may even be on the verge of giving up your search and creating a theme from scratch. Don’t dust off your favourite code editor just yet – you could save a lot of time and stress if you tried customizing an existing theme first.
How to Customize WordPress Themes
Creating a theme from scratch is a lot of work, but customizing themes can be easy. If you’ve found a theme that is almost (but not quite) what you want, then why not edit the CSS files, change the images, and tweak the layout until you have the perfect custom theme – for just a little bit of work on your part.
There are several ways to customize WordPress themes. If you’re a confident and skilled web coder, you can simply dive right in and open the theme files in Dreamweaver (or Notepad!), and get to work. However, that can be a cumbersome and error-prone way to work. You may find it easier to work with modular CSS and Child Themes.
Styling WordPress with Child Themes
Child themes are WordPress themes that inherit the features of another theme (the parent theme). You can use Child Themes to add functionality to an existing theme, or tweak the theme to your liking.
Child themes live in the wp-content/themes folder, just like normal themes, and you can manage them in the Themes section of the WordPress admin panel, just as you might expect. The difference between a Child Theme and a regular theme is that Child themes do not require all of the theme files that a normal theme does. There’s no PHP code to worry about – everything in the child theme is handled via CSS.
To customize WordPress themes via a child theme, simply create a new folder for the theme, and create a new style.css file for it:
/*
Theme Name: My New Child Theme
Theme URI: www.mywebaddress.com
Description: A stylish child new child theme
Author: YOUR NAME HERE
Author URI: www.mywebaddress.com
Template: NAME THE PARENT THEME HERE
Version: 1.0
.
If you want to add extra comments or state the license for your new theme (e.g. Creative Commons – Attribution) then do so here.
.
*/
There you go, you now have the start of a child theme! It doesn’t do anything yet, though – if you were to preview the theme on your blog, you’d just see an ugly, un-styled page.
To make the theme do something, you need to import the styles of the parent theme, so that you can start customizing them. On a new line after the closing ‘*/’ in your style.css file, add the following:
@import url(../FOLDER-NAME-OF-PARENT-THEME/style.css);
If you test your new child theme, it should look exactly like the parent theme. That may not sound all that exciting, but it’s a big deal! Now you can start making changes to this theme without worrying about messing up the original.
Let’s pretend that you don’t like the way that links are displayed in the original theme, you can change them simply by adding CSS to the Child Theme’s style.css:
Changes you make to the Child Theme will affect only the child theme, leaving the original untouched. This makes it a quick and easy way to customize WordPress themes.
