How to build your own sub-theme (5.x)

The base Zen theme is designed to be easily extended by its sub-themes. You shouldn't modify any of the CSS or PHP files in the root zen/ folder; but instead you should create a sub-theme of zen which is located in a folder within the root zen/. For example, the zen/zen_classic folder contains the files for the Zen Classic sub-theme.

1. Copy the STARTERKIT folder and rename it to be your new sub-theme. IMPORTANT: Only lowercase letters and underscores should be used.

   For example, copy the zen/STARTERKIT folder and rename it as zen/foo.

2. If you want a liquid layout for your theme, copy the layout-liquid.css from the zen folder and place it in your sub-theme's folder. If you want a fixed-width layout for your theme, copy the layout-fixed.css from the zen folder and place it in your sub-theme's folder. Rename the layout stylesheet to "layout.css".

   For example, copy zen/layout-fixed.css and rename it as zen/foo/layout.css.

3. Copy the print stylesheet from the zen folder and place it in your sub-theme's folder.

   For example, copy zen/print.css to zen/foo/print.css.

4. Copy the zen stylesheet from the zen folder and place it in your sub-theme's folder. Rename it to be the name of your sub-theme.

   For example, copy zen/zen.css and rename it as zen/foo/foo.css.

5. Edit the template.php and theme-settings.php files in your sub-theme's folder; replace ALL occurances of "STARTERKIT" with the name of your sub-theme.

   For example, edit zen/foo/template.php and zen/foo/theme-settings.php and replace "STARTERKIT" with "foo".

6. Log in as an administrator on your Drupal site and go to Administer > Site building > Themes (admin/build/themes) and enable your new sub-theme.
   

   Optional:

7. Modifying Zen core stylesheets: If you decide you want to modify any of the other stylesheets in the zen folder, copy them to your sub-theme's folder before making any changes. Also, be sure to edit the drupal_add_css() calls near the beginning of your sub-theme's template.php file.

   For example, copy zen/html-elements.css and rename it as zen/foo/html-elements.css. Then edit zen/foo/template.php and change drupal_add_css(path_to_theme() .'/html-elements.css', 'theme', 'all'); to drupal_add_css(path_to_subtheme() .'/html-elements.css', 'theme', 'all');

8. Modifying Zen core template files: If you decide you want to modify any of the .tpl.php template files in the zen folder, copy them to your sub-theme's folder before making any changes.

   For example, copy zen/page.tpl.php to zen/foo/page.tpl.php.

9. Themeing Drupal’s search form: Copy the search-theme-form.tpl.php template file from the zen folder and place it in your sub-theme's folder. In your sub-theme's template.php file, un-comment the phptemplate_search_theme_form() function.
10. Further extensions of your sub-theme: Discover further ways to extend your sub-theme by reading Drupal's Theme Developer's Guide online at: http://drupal.org/handbooks