The Theme Files

The themes and their respective files are kept in the directory named themes on your server. The default distro also comes bundled with the PHPTemplate engine. The PHPTemplate files are located in a sub-directory inside the themes directory on your server.

To view the theme and template engine files in your Drupal installation, access your server and navigate to the directory located at /themes.

Screenshot of section of the default Drupal directory structure on a server

The sample templates included in the distro demonstrate the two principal methods of creating themes. The themes Bluemarine, Garland, Minnelli, and Pushbutton all employ the PHPTemplate engine. The themes Chameleon and Marvin are built without use of PHPTemplate. Both Chameleon and Marvin are written directly in PHP; themes that use this approach are sometimes referred to as "Pure" PHP themes.

Which approach is better for you? Hard to say; the answer will vary from person to person and according to your intended use. The right answer will depend largely on your needs and your relative skill with the technologies. (Building a pure PHP theme can be a challenge for those who lack strong PHP skills!) Speaking generally, the PHPTemplate approach is preferable as it is not only easier to master, but it is also more modular and reusable than a pure PHP approach to themes.

The Files of a PHPTemplate Theme

Let's look at the files that comprise the Bluemarine theme and their roles at run time:

• block.tpl.php Defines the appearance of the blocks on the page.

• box.tpl.php Defines a specific format—a box used to frame things (like comments in the Bluemarine theme).

• comment.tpl.php Defines the appearance of the comments which follow items.

• logo.png An image file containing the logo used in the theme.

• node.tpl.php Defines the appearance of the nodes.

• page.tpl.php This is the primary theme file. This is the only required file in a PHPTemplate theme and typically defines the appearance of most of the page.

• screenshot.png An image file containing a screenshot of the theme; this is used as a reference.

• style.css The style sheet for this theme.

Note that not all of these files are necessary for a PHPTemplate theme to function properly. The two key files are page.tpl.php and style.css.

Note

While it is not necessary for the theme to function, it is best practice to always include screenshot.png, as this file is used in the admin interface to provide site administrators with a preview of the installed themes.

The file page.tpl.php does the heavy lifting in all PHPTemplate themes. This file is the only required file and it handles most of the styling as well as incorporating by reference any theme-specific overrides contained in related files. In the case of the Bluemarine theme, those additional overrides are:

• block.tpl.php

• box.tpl.php

• comment.tpl.php

• node.tpl.php

Overrides are not required—the overrides in the Bluemarine theme represent a decision made by the author of the theme to style specific elements. As this is within the discretion of the theme developer, the presence and extent of overrides will vary from theme to theme.

The PHPTemplate-specific files all follow the same naming convention *.tpl.php. The prefix of each of those files is specific in that they are intended to override functions defined elsewhere. For the system to recognize that these files in the theme directory are intended to override the originals, the names must be consistent with the originals. The naming of some of the other theme files is flexible and within the discretion of the author.

We will take an in depth look at the various PHPTemplate files and the concepts and rules relating to overrides in later chapters.

The Files of a Pure PHP Theme

Let's look at the files that comprise the Chameleon theme and their roles at run time.

• background.png An image file used as this theme's background.

• chameleon.theme This is the primary theme file. This is the only required file in a pure PHP theme and it defines the appearance of the page.

• common.css The style sheet for this theme.

• logo.png An image file containing the logo used in the theme.

In this theme, the key pair of files is chameleon.theme and common.css. The *.theme file uses PHP to style page elements by overriding the default theme functions created by the system. The *.css contains the styles necessary to support the presentation.

We will take a more in depth look at pure PHP themes in later chapters.