Introduction to Drupal Theming

Presented at Drupal Camp Ohio on November 30, 2012. (with co-presenter Chris Gross)

Transcript

1. INTRODUCTION TO DRUPAL THEMING Chris Gross & Melissa Miller
2. OVERVIEW GETTING STARTED ANATOMY OF A THEME START FROM SCRATCH BUILD A SUB-THEME RESPONSIVE DESIGN
4. OVERVIEW GETTING STARTED ANATOMY OF A THEME START FROM SCRATCH BUILD A SUB-THEME RESPONSIVE DESIGN
5. getfirebug.com chrispederick.com/work/web-developer/ Firebug Web Developer Toolbar
6. acquia.com/downloads Dev Desktop
7. Devel module drupal.org/project/devel
8. OVERVIEW GETTING STARTED ANATOMY OF A THEME START FROM SCRATCH BUILD A SUB-THEME RESPONSIVE DESIGN
10. OVERVIEW GETTING STARTED ANATOMY OF A THEME START FROM SCRATCH BUILD A SUB-THEME RESPONSIVE DESIGN
11. DON'T HACK CORE
12. OVERVIEW GETTING STARTED ANATOMY OF A THEME START FROM SCRATCH BUILD A SUB-THEME RESPONSIVE DESIGN
13. DON'T HACK CORE
15. Get More Themes drupal.org/project/Themes
16. OVERVIEW GETTING STARTED ANATOMY OF A THEME START FROM SCRATCH BUILD A SUB-THEME RESPONSIVE DESIGN
21. omega.developmentgeeks.com
23. 1. global.css
24. 1. global.css 2. yourtheme-alpha-default.css
25. 1. global.css 2. yourtheme-alpha-default.css 3. yourtheme-alpha-default-narrow.css
26. 1. global.css 2. yourtheme-alpha-default.css 3. yourtheme-alpha-default-narrow.css 4. yourtheme-alpha-default-normal.css
27. 1. global.css 2. yourtheme-alpha-default.css 3. yourtheme-alpha-default-narrow.css 4. yourtheme-alpha-default-normal.css 5. yourtheme-alpha-default-wide.css
28. #page
29. #page #section-header #section-content #section-footer
30. #page #section-header #section-content #section-footer #zone-header #zone-preface #zone-content #zone-footer
31. #page #section-header #section-content #section-footer #zone-header #zone-preface #zone-content #zone-footer #region-logo #region-menu #region-feature #region-content #region-sidebar #region-footer1 #region-footer2 #region-footer3
32. Questions?