Drupal Themes The Survival Guide Drupal Camp | Managua 2009.
-
Upload
walter-williamson -
Category
Documents
-
view
235 -
download
1
Transcript of Drupal Themes The Survival Guide Drupal Camp | Managua 2009.
Drupal Themes
The Survival Guide
Drupal Camp | Managua 2009
Drupal Camp | Managua 2009
Drupal ThemesThe survival guide
Agenda
1. What’s Drupal.
2. What is a theme.
3. Why a normal HTML doesn’t work.
4. Wire Frames to Regions
5. HTML to Drupal Theme Variables
6. Overriding CSS
7. Overriding HTML
8. Theme Debugging
9. Questions?
Drupal Camp | Managua 2009
Agenda
Drupal is free, open source software that can be used by individuals or groups of users -- even those lacking technical skills -- to easily create and manage many types of Web sites. The application includes a content management platform and a development framework.
Drupal Camp | Managua 2009
1. What is Drupal?
Drupal Camp | Managua 2009
1. What is Drupal?
In the context of Drupal, the term "theme" means a collection of files that are responsible for the look and feel of the website. Other systems use different names for the files that perform the same function in their particular systems—the most common term used elsewhere being "template.“
Conceptually, a theme is a visual container that is used to format and display data on the screen. Expressed in terms of its component parts, a theme is a collection of files that format data into the presentation layer viewed by site visitors and system administrators. Expressed in simplest terms: The theme determines how your site looks!
Drupal Camp | Managua 2009
2. What is a theme
2. What is a theme
A generic theme cover the 80% of needs for a project; the rest 20% belongs to theme customization.
Remember you know you build a good theme when developers could install and use with three clicks.
Drupal Camp | Managua 2009
Even if our PSD transformation to HTML looks OK, this representation only works in a static scenario.
These the list of issues.
• CSS ignore Drupal styles.
• HTML is raw data. We need Information.
• HTML is not oriented to dynamic content and/or layouts .
Drupal Camp | Managua 2009
3. Why a normal HTML doesn’t work.
Drupal Camp | Managua 2009
4. Wire frames to Regions
Mazda USA Media Home Page
Drupal Camp | Managua 2009
Image should always fit the unit grid
4. Wire frames to Regions
Mazda USA Media Home Page
Drupal Camp | Managua 2009
Primary Links
Header
New Region # 1
Right Sidebar
Footer
Content
4. Wire frames to Regions
Drupal Camp | Managua 2009
5. HTML to Drupal Theme Variables
Drupal Camp | Managua 2009
5. HTML to Drupal Theme Variables
Drupal Camp | Managua 2009
5. HTML to Drupal Theme Variables
Drupal Camp | Managua 2009
6. Overriding CSS
Drupal HTML rendering order.
Drupal Camp | Managua 2009
The active theme's files(if no function defined then ...)
The theme engine files(if no function defined then ...)
The default Drupal file
7. Overriding HTML
template.php
Drupal Camp | Managua 2009
7. Overriding HTML
Template by path
http://drupal/page-front.tpl.php
http://drupal/userpage-user.tpl.php
http://drupal/storynode-story.tpl.php
http://drupal/contactpage-contact.tpl.php
http://drupal/aboutpage-about.tpl.php
Drupal Camp | Managua 2009
7. Overriding HTML
8. Theme Debugging
Drupal Camp | Managua 2009
Using the devel module for drupal 6 we could debug our themes.
Note that this module injects markers into the DOM to do its magic.
This may cause some themes to behave erratically and less capable
Theme Developer (Drupal 6 Only) http://www.drupal.org/project/devel
Drupal Camp | Managua 2009
Presentation prepared by:Eduardo Garcia
Drupal Camp | Managua 2009
©Anexus IT