D7 Theming

Basics

• Building a new theme for Drupal 7 - IBM developerWorks

• Structure of the .info file
• Default .info values
• Assigning content to regions
• Creating a sub-theme
• JavaScript and jQuery

• Semantics, structure and presentation
• Grok Drupal (7) Theming--Notes

Theme development modules

• http://drupal.org/project/styleguide - gives Drupal elements to test css on

• http://drupal.org/project/devel_themer
  • Using the Drupal Theme Developer Tool: YouTube: Theming Basics for Drupal
  • Candidate page tpl name for particular custom content type entry - how to add devel themer override template suggestions in a custom content type.

Backwards compatibility

• http://drupal.org/project/modernizr

• http://drupal.org/project/css3pie

Layout

Various different methods

Views
Nodequeue

Blocks
Panels

Context
Spaces

Templates

• Overriding themable output - broad overview
  • About overriding themable output

• PHPTemplate theme engine

• Core templates - the default template (.tpl.php) files provided by core in Drupal 7. variable and purpose docs are in the templates.
  • Drupal 7 Template Suggestions - override templates in a more targeted way
• Default baseline variables

• Theme Preprocess Functions: an Introduction

• modules--system--theme.api.php - Default theme implementations

• modules--system--html.tpl.php
• modules--system--page.tpl.php
• modules--node--node.tpl.php
  • template_preprocess_node

• etc.

block

• modules--block--block.tpl.php;

<div id="block-<?php print $block->module . '-' . $block->delta; ?>" class="<?php print $classes; ?> "<?php print $attributes; ?>>
  <?php print render($title_prefix); ?>
  <?php if ($block->subject): ?>
    <h2><?php print $block->subject ?></h2>
  <?php endif;?>
  <?php print render($title_suffix); ?>
 
  <div class="content"<?php print $content_attributes; ?>>
    <?php print $content ?>
  </div>
</div>

Forms

For beyond basic content types field layouts;

• Theming forms in your theme

• http://drupal.org/node/751826

• http://api.drupal.org/api/drupal/developer--topics--forms_api_reference.html/7
  • http://api.drupal.org/api/drupal/includes--form.inc/7
  • http://api.drupal.org/api/drupal/includes--form.inc/group/forms/7
  • http://api.drupal.org/api/drupal/includes--form.inc/group/form_api/7

• http://api.drupal.org/api/drupal/developer--topics--forms_api_reference.html/7 - programmer's reference to the Drupal Form API

function milk_form_alter(&$form, &$form_state, $form_id) {
  if ($form_id == 'contact_node_form') {
    $form['actions']['submit'] = array(
        '#type' => 'submit',
        '#value' => t('Send'),
    );
  }
}

• hook_form_alter
  • A Very Introduction to Drupal's hook_form_alter()
  • Hook snippets: hook_form_alter

• Basic Form with submit button

• http://www.advomatic.com/blogs/jack-haas/notable-changes-to-theming-drupal-7 Notable changes to theming in Drupal 7] - Form Overrides section has another perspective on the basics

Responsive

• http://drupal.org/project/adaptive_image