Design and Prototyping for Drupal

Creating a Child Theme

Once you’ve got your base theme downloaded and set up, you have to set up a child theme to put all your customizations into. Some themes, such as Zen and Omega, come with a set of starter kits that you can simply copy into your /sites/all/themes folder and rename; with other themes, you may have to copy the files you need manually into a new folder. To start with, all child themes should contain three files:

• A blank template.php file, which will eventually hold any theme functions that you decide to put into it. Note that this file should be blank initially; copying the template.php file from your base theme will cause errors when you try to access your site.

• A THEMENAME.info file, which you can copy from the base theme.

• A styles.css (or something similar) file, which will be referenced in your theme’s .info file and contain all of the CSS customizations for your child theme.

If you plan on overriding any of the base theme’s tpl.php files, you can also copy those into your child theme. However, generally, I avoid doing that unless I need to create a new template region, or change the base theme’s grid layout.

To create your child theme, you’ll start by modifying the theme’s .info file. The .info file defines the page regions, CSS and Javascript files that your theme will use. For example, here’s part of the content of the .info file that comes with Omega’s HTML5 starter kit:^[7]

name = Omega description = <a href="http://drupal.org/project/omega">Omega</a> extends ...