Creating a subtheme is a powerful and flexible way of theming in Drupal. Drupal 6 made implementing subthemes relatively easy to do. There are a few basic concepts to understand before starting, but once underway, creating a subtheme is a simple straightforward process. In this post, I'll outline the process for creating a subtheme. This is meant to be a quick primer, not an exhaustive tutorial on the elements and features of subthemes.
Before going further, I must acknowledge that this post borrows heavily from two posts currently available on Drupal.org. For further information, you can refer to:
- http://drupal.org/node/441088 (Subtheming Quick and Dirty)
- http://drupal.org/node/225125 (Sub-themes, their structure and inheritance)
Subtheme Concept
A subtheme is a child theme that borrows certain attributes from a parent theme. This allows you to use an established theme and a derivative of that theme both on the same site without needing to alter or duplicate the original theme.
When set up correctly, a subtheme inherits the following attributes from its parent theme:
- All style sheets
- All template files
- All functions and overrides defined in the parent theme's template.php file (if it has one)
- the parent theme's logo (logo.png)
- regions (if the parent theme has custom regions)
Creating a subtheme
For the purposes of this post, we'll use an example of setting up a subtheme called "mysubtheme" that will be using an installed version of the contributed "framework" Drupal theme as its parent.
- Create a folder in your custom "themes" folder and name it the with the name you have chosen for your subtheme. Ex: mysubtheme
- Add a .info file to your subtheme folder. To define this as a subtheme, your subtheme folder needs text document named (using our example): mysubtheme.info
- Add the following elements to your .info file:
name = mysubtheme
description = any descriptive text you wish
core = 6.x
base theme = <(folder)name of any core or contributed theme or subtheme, e.g. framework>
stylesheets[all][] = mysubtheme.css
This defines the name of your subtheme, any description you want (shows up on the themes admin page), the reference to the base theme from which you want to inherit, and a stylesheet for defining the styles from the parent theme and other CSS that the subtheme will be overriding. - Set up your regions. If the parent theme has established a set of custom regions in its .info file (many do), you will need to copy the region settings from the parent's .info file and add them to your subtheme's .info file. Otherwise, you will not be able to use these regions in your subtheme. For the contributed "framework" theme in our example, this would look like:
regions[left] = Left sidebar
This is a feature, not a bug. It allows you to have a totally different set of regions for your subtheme if you have the need for this. If you do, just define the regions you wish to have using the "regions [regionname] = RegionLabel" syntax. If you define new regions for you subtheme, you will also need to create a new page.tpl.php file which prints these regions and place this in your subtheme folder.
regions[right] = Right sidebar
regions[content] = Content
regions[header] = Header
regions[nav] = Navigation
regions[footer] = Footer - Add any necessary template files. As mentioned above, your subtheme will inherit the parent theme's tpl.php template files. If you wish to override a specific template file -- as in the regions example in 4 above -- add the specific tpl.php file to your subtheme folder. Alter this file as you wish. It will override the corresponding template file of the same name in the parent theme.
- Add your subtheme's overriding CSS file (ex. mysubtheme.css) to the subtheme folder. Use this file for all your subtheme's style overrides. You can, of course, define and add additional CSS files for your subtheme. If you wish to have multiple custom stylesheets, be sure to add reference to them in your .info file.
Having completed these steps, your subtheme should be up and ready for use. Visit your themes admin page to enable the theme.
Happy theming!

Comments
Thanks
Exactly what I needed to know.
Excellent! but...
Thank you for the excellent step-by-step guide! It answered some of my questions, but left me with some old ones...
Now that both the main theme and sub-theme are ready to go, how does one choose which theme to use when creating content???
For example:
Home | About Us | Products | Contact
Both the "home" and "about us" pages use the main theme but the "products" and "contact" pages use the sub-theme.
How do you select which theme to use for which page(s)?
Thanks,
TC
Multiple themes
There is, I think, a Taxonomy Themes module which allows you to configure multiple themes for a site based on a taxonomy element.
parent theme!!
Drupal is really hard to work out at the beginning but as you go on with it, I must say it is the best one to use in the sites. I was having problem in How to add other sub theme while using Drupal but I found your post to be really helpful.As said above in No.3 regarding defining a sub theme. Does this make any difference in Parent Theme too?
thanks!
thanks for the informative overview. well written and clear.
cheers!
how can i switch the
how can i switch the subtheme based on the language variable? I'm trying to change out the images for each language using subthemes
each subtheme has a css with the different language image locations.
good one
It was a little hard at time to follow everything but I think I managed to understand it. Thanks for the info. I'll be trying this as soon as I get home.
Unclear on the question
TC, Robert:
Are you looking to select different themes for the display of different pages? Or is your site apparently using the main theme for some pages and the subtheme for others?
If you wish to use multiple themes on your site to display specific pages differently, this is not necessarily a feature of subthemes. I'd look to contributed modules or other themeing strategies to accomplish what you are looking to do. It all depends on how regular your use-case will be, i.e. will you be theming all pages with a specific taxonomy term or of a specific content type -- or will you want random nodes/pages themed differently...
If your site seems to be using the main theme on some nodes/pages and the subtheme on others, this is most likely a templating situation, I think. In other words, are the pages that are showing the main theme of a different content type than those of the other pages? You could have a content type specific template file in your main theme that is not overridden in the subtheme. You would need to post more information about the theme you are using and what template files exist therein.
-barry
Post new comment