Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Let's Zen! (Stop Theming From Scratch)
1. Stop Theming From Scratch...
Let's Zen!
Chris Charlton www.chrischarlton.us
2. Who am I? What am I?
Chris Charlton – I teach, I write, I code.
LA Drupal Manager – groups.drupal.org/LA
LA AIR Adobe Group Manager – laair.org
Drupal Training – drupaltrainer.com and
drupallearning.com for info and dates.
3. What Unicorns Planned For Us Today:
General overview of Drupal Themes.
Parts of a Drupal Theme.
How time consuming “from scratch” really is.
Zen Theme: Vanilla for your sprinkles!
4. Drupal 6 Themes General Overview
Themes can be installed/uninstalled at will.
Site users can pick any theme you install.
There are free themes, commercial themes,
and any can be tweaked or sub-themed.
Themes are made up of CSS and PHP files.
Themes override core and module rendering.
5. Parts of a Drupal Theme (Terms)
Page = the “shell” markup
<head>
<body>
<div id=”header”>
<div id=”content”>
<div id=”custom-regions”>
Region = area where blocks/content live
Header
Content
Sidebar Left
Sidebar Right
Footer
Node = a piece of content
6. Parts of a Drupal Theme (Files)
Folder & files:
.infofile = theme description/manifest
style.css = the common name for main stylesheet
template.php = powerful file; custom theme logic
TPL (PHP/XHTML files; PHP Template)
page.tpl.php
node.tpl.php
block.tpl.php
comment.tpl.php
... and many, many more.
7. Theme Cost Graph – fake, but real.
A = a free/core theme
B = a budget theme
C = a contrib theme
D = a budgetted theme Price
D
B
Themes take more C
A
than one pass, and
themes always evolve. Quality
8. Spend $$$ on your theme
Good themes keep sites out of the passive
“Oh, just another Drupal site” stigma.
Good themes grow with a site & don't smell.
Theme code overrides rendering logic from
core and module defaults. Your theme has
final “say” on how anything should look.
Modules provide theme “hooks” to override.
9. Save $$$ on your theme
Join a theme framework project, like Zen!
Others out there: Blueprint, The 950 Theme, Basic, ...
Reduce or eliminate “from scratch” foundation work.
Zen contains pre-declared CSS selectors:
Tags: h1, h2, h3, h4, h5, h6, p, a, a:hover, a:visited, ...
Common Drupal regions (IDs): #header, #footer,
#content, ...
Common Drupal styles (Classes): .node, .form-field,
.block, ...
10. Where to read more about Zen
http://drupal.org/project/zen
Drupal Planet & Drupal Talk (blogs/feeds)
Themer Group –
http://groups.drupal.org/theme-development
*Dreamweaver fans visit http://xtnd.us