Drupal 6 theming notes.
Index
- Themes intro
- Variables for page.tpl.php
- Zen based theme
- New theme
- Styling
- Sub theme oddities
- Per “section” styling
- Specify a theme’s module dependencies
Themes intro
Set admin theme as Garland (or whatever) in Administer -> Site configuration -> Administration theme.
The user can choose their own theme when they edit their account.
Administer -> Site building -> Themes can be used to choose site theme (which will also be used as admin theme if not set as described above).
Drupal 6 theme guide: Theming Drupal 6
Variables for page.tpl.php
Zen based theme
Download and install Zen.
Make sure PHP is installed with ctype support.
Follow subthemeing instructions. Note that mention of STARTERKIT in theme-settings.php must also be replaced with the new theme name in order to have theme options like disabling the theme registry in Administer -> Site building -> theme configure option (I didn’t do this initially so suspect it was missing from instructions).
Gotchas
- A Zen sub theme can not have a hyphen in it as they’re not allowed in PHP function names.
- If the right sidebar is missing, ???.
New theme
mkdir sites/all/themes/mytheme
touch sites/all/themes/mytheme/mytheme.info
Add the following to mytheme.info, changing version number accordingly. Commented out fields are not required (version is not required, but recommended so that someone installing it on a different version of Drupal will not expect perfection):
name = My Theme
;description = My Theme
;screenshot = screenshot.png
version = 6.11
core = 6.x
engine = phptemplate
;base theme = garland
;regions[left] = Left sidebar
;regions[right] = Right sidebar
;regions[content] = Content
;regions[header] = Header
;regions[footer] = Footer
;features[] = logo
;features[] = name
;features[] = slogan
;features[] = mission
;features[] = node_user_picture
;features[] = comment_user_picture
;features[] = search
;features[] = favicon
;features[] = primary_links
;features[] = secondary_links
stylesheets[all][] = all.css
stylesheets[screen][] = screen.css
stylesheets[print][] = print.css
stylesheets[projector][] = projector.css
stylesheets[handheld][] = handheld.css
;scripts[] = myscript.js
;php = 5.2.9
Styling
Must disable CSS optimisation until site live, since this caches CSS:
Administration -> Site configuration -> Performance.
Optimize CSS file: disabled.
If caching is enabled, must clear cache to reload the theme’s .info file:
Administration -> Site configuration -> Performance.
Clear cached data.
Default file, when none defined in .info, is style.css. Defining custom styles will prevent this default being used.
To override a module’s CSS, redefine in the .info file. You could alternatively just use CSS selectors to override from your theme’s other CSS.
You can use the API to dynamically load stylesheets, perhaps based on conditionals, by doing so from a preprocessor function.
Sub theme oddities
Stylesheets
If you create a sub-theme, the parent’s style.css will not be picked up unless the sub-theme references its own css from its .info file. The css file doesn’t even have to exist.
Templates
If you want to override a template, the more general template must also reside in the sub-theme otherwise it won’t be inherited. e.g. To have node-ad.tpl.php picked up you also need node.tpl.php in the sub-theme - it won’t be picked up from the parent theme.
Per “section” styling
If you have a menu set up to emulate site sections, with pages and sub pages within a section, then the URLs generated by pathauto must be changed and the (zen) page template must be modified to add a class to the body that indicates the current section as well as the current page.
- Administer -> Site building -> URL alisaes, ‘Automated alias settings’ tab.
- Change the default path pattern, in ‘Node alias settings’ section, to content/[menupath-raw] (from default content/[title-raw]) so that that menu hierarchy is reflected in the URL.
- Regenerate the aliases. See the ‘Regenerate pathauto URL aliases’ section of this doc.
- Add the following function to template.php, which looks at the path to generate a body class for the section:
function [theme]_preprocess_page(&$vars, $hook) {
if (!$vars['is_front']) {
// Get unique class for top-level page (aka page section).
$path = drupal_get_path_alias($_GET['q']).'/'; // Path must have a trailing slash (doesn't matter if there's two of them).
$path = substr($path, 0, strpos($path, '/', strpos($path, '/')+1)); // Everything before second slash.
$class = zen_id_safe('page-' . $path);
// Add to template variables that store classes for the body.
if (!in_array($class, $vars['body_classes_array'])) {
$vars['body_classes_array'][] = $class;
}
if (!strpos($vars['body_classes'].' ', $class.' ')) { // Add trailing space to prevent match with substring of a specific class.
$vars['body_classes'] .= ' '.$class;
}
}
}
Specify a theme’s module dependencies
In the theme’s .info file:
dependencies[] = content
dependencies[] = views
etc
Note: Use ‘content’ instead of ‘cck’.