Drupal theming
-
Upload
philip-norton -
Category
Technology
-
view
4.891 -
download
1
description
Transcript of Drupal theming
Drupal Theming
December 5th 2012 NWDUG
Drupal Themes
Some standard ones:- Garland/Bartik - Drupal Core- Zen- Omega- Boilerplate
Drupal themes, ordered by popularity:http://bit.ly/XqhSop
Anatomy Of A Drupal Theme
<theme name>.info
Required.
Also used for theme specific settings.
name = 'My amazing theme'description = 'My amazing theme wot is amazing'core = '7.x'engine = 'phptemplate'screenshot = 'screenshot.png'
<theme name>.info
Add stylesheets:
stylesheets[all][] = style.css
Add JavaScript:
scripts[] = myscript.js
Control items on theme config page:
features[] = logo
Sub themes
Don't hack other themes; create a sub theme.
base theme = garland
Templates
node.tpl.phppage.tpl.phphtml.tpl.phpblock.tpl.phpregion.tpl.phpcomment.tpl.php***.tpl.php - defined by a module (eg, Views)
Overriding Templates
Don't hack core templates!
To make a custom node template for a content type.
- Copy node.tpl.php from /modules/node into your template directory.
- Rename to node--<type>.tpl.php
Overriding Templates
Templates can usually be overridden hierarchically
page.tpl.phppage--node.tpl.phppage--node--2226.tpl.php
block.tpl.phpblock--region.tpl.phpblock--module-name.tpl.phpblock--module-name-delta.tpl.php
template.php
Theme specific overrides.
Either by theme name or rendering engine.
For just this theme:mytheme_breadcrumb($variables)
For this theme an all sub themes:phptemplate_breadcrumb($variables)
Preprocess Hooks
Alter elements before they are sent to a theme function or template.
hook_preprocess_html(&$variables)
hook_preprocess_page(&$variables)
hook_preprocess_node(&$variables)
Themeing from a Module
hook_theme();
Be nice to your themers!
function hook_theme($existing, $type, $theme, $path) { return array( 'system_date_time_settings' => array( 'render element' => 'form', 'file' => 'system.admin.inc', ), );}
Regions
Where blocks go.
In your info file:
regions[header] = 'Header'
In your page.tpl.php template:
<?php print render($page['header_nav']); ?>
render()
Renders content.
print render($content);
Used with hide() and show().
hide($content['comments']);print render($content);
Theme All The Things!
It is theoretically possible to alter every theme element in Drupal*
* It's probably not a good idea though
Tips
Create a subdirectory of templates in your theme.
If you get stuck turn on the Stark theme to see the raw HTML being generated.
Think before including JavaScript libraries as Drupal has a bunch.
Tips
When planning a site think about where you content will go and what blocks go in what region.
Use $var['theme_hook_suggestions'] in you preprocess hooks to see what templates are available.
Use devel themer module to see more information about what is theming an element.
Resources
Drupal.org .info files:http://drupal.org/node/171205
Drupal themes, ordered by popularity:http://bit.ly/XqhSop
Questions?
Philip Norton && Mike BellBloghttp:///www.norton42.org.uk/http://www.digital006.com
Twitter@philipnorton42@mikebell_
#! codehttp://www.hashbangcode.com/
Before we forget
What subject next?
Next meetup date is 2nd Jan - Postpone to week after- Postpone to month after