Presented at San Diego Drupal Camp 2010

1. Creating an Initial
Custom Theme in
Drupal
by Troy Shields
www.troyshields.com
1

2. Assumptions
• You understand how to:
• Set up a Drupal site
• Write HTML/CSS
2

3. The Situation
What I Wish I Knew
• You’re a “Themer”
• You’re working with a team of Explain my experience
and “what I wish I
knew”
developers
• You’re working in tandem
• You need to get base styles & your
regions in place for your developers
3

4. Understanding the Files
• sites/all/themes/yourthemename
• .info file
• logo.png, screenshot.png
• stylesheets & tpls Go over what’s in INFO
file:
Name
Regions
CSS
4

5. Creating the Template
Bad HTML and CSS are not
Drupal’s fault. If it doesn’t
work outside of Drupal, it
won’t work inside of
Drupal.
• Create a static template & test in
browsers you support
page-front/homepage is
last because it’s a
• page.tpl.php should be the most conglomeration of the
rest of the site. Use as
few page tpls as possible
common page
if nothing is in the
• Simple “if” statements for sidebars
sidebar, it won’t show up.
use body class to style
columns appropriately
• Site Building: build what you know
5

6. A Theory of CSS
• Understand Floating & Positioning. Holy Grail
• Absolutely position elements in headers with
static heights. There are no mysteries here
• Columns need floats and widths, but rarely
elements inside of them
• Use negative margins sparingly. This is often
used as a band-aid on a gunshot wound
6

7. Wrap Up
think: generic enough to
contribute or use for
another site.
• Build stuff you know. Columns,
header, footer.
• Stuff you don’t know. Theming that
relies on specific id’s and classes
output by Drupal modules.
This is stuff with id’s and
classes you don’t know
because they haven’t been
built.
7

8. The End.
Thanks.
8