The Definitive Guide to Drupal 7

Managing CSS Files

Every good Drupal theme needs a stylesheet or two, or ten! You might be caught off guard by the sheer number of CSS files that Drupal loads, before you even start on your theme. Being the modular framework that it is, Drupal uses that same approach for CSS stylesheets and JavaScript files. CSS and JavaScript files are provided separately by module—and sometimes a few per module. This is done on purpose for the following reasons:

  • It’s easier to read and understand the purpose of the code and what module it belongs to.
  • It allows Drupal to load only the code needed on a given page.
  • It’s easier for Drupal to maintain these files and their contents.

That said, in Drupal’s theme layer you have full control over all stylesheets and scripts. You can do whatever you want with them, literally. If you decide you don’t want to load any stylesheets from modules, you can remove them all. If you aren’t happy with a few files, you can override them individually by removing them or override them and change the contents within the theme. You can even change the order in which the files load if you want to. This section will show you how to do all of that.

You are reading content from two chapters on Theme Development from The Definitive Guide to Drupal 7, written by Jacine Luisi and published by Apress on July 19, 2011. All rights reserved.