What is a subtheme?

With Glazed theme you typically won't need a real subtheme. In fact all of the designs of our Drupal themes are not subthemes, they are just plain vanilla Glazed theme with customized theme settings. Because Glazed has so many settings and a setting for Custom CSS, most users won't have the need for a subtheme.

The need for a subtheme comes into play when you have a large website with custom structured content and 3rd party integrations. If you create a subtheme you create a custom theme that inherits the features of the parent theme. Glazed theme is itself a subtheme of the Bootstrap basetheme so if you subtheme Glazed you will create a level-2 subtheme. Learn in our Architecture Documentation.

Because Glazed theme uses the Drupal color module, creating and maintaining a subtheme involves a few extra steps.


1. Setting up dependencies

Please make sure your site contains the following themes:

And the following modules:

  • jQuery update

Please set jQuery update to load jQuery 2.1 or higher for Glazed theme and 1.8 for the backend. You need the 3.x branch of the jQuery update module. 


2. Copy glazed_STARTERKIT and rename

Copy the folder glazed_STARTERKIT and rename it to whatever you want to call your theme. For example glazed_mysite. The proper location for your subtheme is
[drupal-directory]/sites/all/themes/


3. Rename glazed_STARTERKIT.info and set up theme information

Next you will rename the glazed_STARTERKIT.info to reflect the name of your theme, for example glazed_mysite.info. Now open the file and enter a title and description for your theme.


4. Edit template.php and rename functions

The color settings of your subtheme won't work until you rename the functions in template.php to reflect the name of your theme. Open up the template.php file in your subtheme and rename: glazed_STARTERKIT_process_html > glazed_mysite_process_html
glazed_STARTERKIT_process_page > glazed_mysite_process_page 

Of course replacing glazed_mysite with whatever you called your subtheme. 


5. Extending your subtheme

If you decided to create a subtheme you probably know what to do now. You can add functions to template.php and add custom stylesheets and javascript files. The subtheme starterkit already contains a css file in css/glazed_subtheme.css. You can edit this directly or if you prefer to use SASS, edit sass/glazed_subtheme.scss


6. Upgrading Glazed theme versions

When upgrading the Glazed theme basetheme, your subtheme will automatically inherit new theme settings and other features. When using Drupal's color module there are extra steps involved:

  1. update glazed theme
  2. copy new glazed/css/glazed.css to your subtheme's css folder
  3. copy new glazed/color folder to your subtheme (in case new colors are added)
  4. save theme settings at admin/appearance/settings/yourtheme

The last step is important because it will copy the fresh glazed.css to the files folder and clear caches.


7. Optional: integrating your css with the color module

If you want to integrate your stylesheet with the color module settings, open up the file /color/color.inc in your subtheme. Here you just have to add your css file to the CSS files array:


  // CSS files (excluding @import) to rewrite with new color scheme.
  'css' => array(
    'css/glazed.css',
    'css/glazed_subtheme.css',
  ),

After adding this save the theme settings. Now this is very important: You now have to save the theme settings every time after editing your glazed_subtheme.css file. This is because the color module keeps a copy of your stylesheet in the files folder. This is easy to forget and if you're human you will at some point in the future be completely confused about why the changes in your css files are not showing on your site. The reason is probably because you forgot that the color module is caching a copy of your css and you just need to save the theme settings form.

For more details about subtheming in Drupal, see the Creating a sub-theme documentation.