Skip to Content Skip to Navigation

About the "Drupal 7 Theming Essentials" Collection

In this collection, we introduce you to the techniques you need to track down the source of any output in Drupal and adjust it in an organized, predictable way. We also really flex Drupal's theming system to do things like:

Build a theme from scratch, create a sub-theme and clone a theme
Add new theme settings (including color pickers)
Override page, block and node templates

Complete video index of the "Drupal 7 Theming Essentials" Collection

1.

1h 43m

Important Drupal Theming Concepts

3:14 Who these theming videos are for and what they do (and don't) cover

7:18 What is the difference between designing, theming and coding, and why do they overlap so much?

10:40What are all of the different ways to modify Drupal output?

3:25How to determine which method to use when modifying output

2:31A conceptual introduction to the Features module for exporting configuration options as code

4:04How to decide whether to use a module or a theme for your modifications

2:42How to decide when to use a theme function or template file

9:52How the theme registry works

5:11 How to find out where any piece of output comes from

6:05What view modes are and why you would use them

7:10How to adjust node view modes through the user interface

5:55What field formatters are and how to use them to modify field output

5:24How coding standards apply to the theme layer, and how to add comments to template files

10:53Template file coding standards and conventions

2:48How to apply CSS coding standards

4:35Theme troubleshooting and what to do when you don't see your theme output changes applied

7:31How to troubleshoot CSS problems in your theme

4:01Review of 'Important Drupal Theming Concepts' and review

2.

1h 21m

How to Build and Modify a Drupal Theme or Sub-Theme

7:18 Overview of included themes and the themes directory, and where to put new themes

6:45How the different parts of a theme work

9:01Learning about theme structures by reviewing core Drupal themes

4:52Learning from the Zen theme file structure

2:40Learning from the Basic theme file structure

2:56 Learning from the Fusion theme file structure

2:25Learning from the Marinelli theme file structure

8:20Review of the theme .info file options

4:43 How to create a theme folder, add an info file and enable a custom theme

5:00How to add a screenshot

2:56How to add a default logo file

5:18How to override the page template with a page.tpl.php file

9:28 How to add a new region and what regions are

4:46How to add a CSS file

4:57How to add a JavaScript file

3.

1h 12m

How to Build and Modify a Drupal Theme or Sub-Theme, Part 2

5:45How to add a new setting to the theme settings form

4:46How to set a default for a theme setting and use it in a template file

9:25How the template.php file works and a review of the Bartik theme template.php file

5:57Learning from the Garland and Seven template.php files

4:52How to add a template.php file and use a page preprocessing function

4:12 The advantages and disadvantages of using a sub-theme

5:54How to create a sub-theme

5:15 How sub-themes inherit or override base theme components

6:34How to override CSS, JavaScript and screenshot files of a base theme using a sub-theme

3:11The advantages of copying an existing theme

10:54How to create a new theme by copying an existing theme

6:13Overview of theme CSS file structures

4.

54m

Theme CSS File Structure and Extended Drupal Theme Building

10:33 A close look at the Bartik stylesheet structure

2:58A quick look at the Garland and Seven theme stylesheet structures

5:50How the Zen theme uses extensive CSS files for learning

6:42Review of the Basic and Fusion CSS file structures

5:19How to enable element toggling with theme

10:13 How to add CSS or JavaScript files to a theme conditionally based on node type

9:27How to add CSS or JavaScript files to a theme conditionally based on path or user role

3:43Review and next steps for the "Theme CSS File Structure and Extended Drupal Theme Building" chapter

5.

1h 49m

Template Files, Theme Function Overrides and Preprocessing Functions

4:20Before you start, is there a simpler way?

13:26Why use template files, how file suggestions work, and setting up for later examples

8:54How to use the page template file (page.tpl.php) and override it by path

9:06 How to use the node template file (node.tpl.php) and override it by content type or node ID

10:59How to use the block template file (block.tpl.php) and override it by module, region or delta

8:23How to use the comment (comment.tpl.php) and comment wrapper (comment-wrapper.tpl.php) template files

4:25How to name preprocessing functions to use with theme functions and template files

5:52 How to use simple preprocessing functions

3:52How to apply preprocessing code only in certain situations

4:01How template file suggestions work in depth and adding new suggestions

10:29How to override template files for specific conditions using template file suggestions

2:02 How to override a theme function

7:18Theme function override examples

8:10How to conditionally add CSS classes to the body, page and node wrapper tags for easier styling

4:34A practical example of adding a conditional body class

3:28Review and next steps for the "Template Files, Theme Function Overrides and Preprocessing Functions" chapter

6.

1h

How to Work With Drupal Theme Settings

6:35What this chapter covers and basic global toggle options available in the theme setting

4:56Overview of additional element toggle options such as main and secondary menus

7:13 How to tell when global or theme-specific settings are used, and how to uninstall a theme

5:54How to add a custom theme setting and set a default for it

2:43How to use the custom theme setting in code using theme_get_setting()

3:21 Overview of how the color module works to add custom color selections to a theme

2:10What steps are required to integrate the color module with your theme

6:31Overview of color module integration files part 1, including the color.inc file

7:37Overview of color module integration files part 2, including the preview.js file

10:45How to add a new color selector to your theme with the color module

2:19Review of the "How to Work With Drupal Theme Settings" chapter

Loading...