Grok Drupal (7) Theming (presented at DrupalCon San Francisco)
9 likes2,795 views
The document is focused on Drupal theming, providing guidance on how to start theming, the assumptions necessary for understanding it, and an overview of the anatomy of a Drupal page. It discusses various template files and their roles in displaying content, along with CSS and JavaScript dependencies. Additionally, there are resources and sessions outlined for further learning on the subject.
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-65-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-66-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-67-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-68-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-69-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-70-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
messages
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-71-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
messages
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
highight
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-72-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
messages
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
highight
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<h1> title
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-73-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
messages
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
highight
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<h1> title
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
tabs
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-74-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
messages
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
highight
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<h1> title
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
tabs
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
help
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-75-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
messages
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
highight
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<h1> title
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
tabs
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
help
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
content
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-76-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
messages
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
highight
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<h1> title
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
tabs
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
help
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
content
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
feed icons
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-77-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
messages
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
highight
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<h1> title
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
tabs
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
help
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
content
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
feed icons
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
sidebars
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-78-320.jpg)
![page.tpl.php
<div id="page-wrapper"><div id="page">
<div id="header"><div class="section clearfix">
<?php if ($logo): ?>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
logo
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
site name
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div id="name-and-slogan">
<?php if ($site_name): ?>
<?php if ($title): ?>
site slogan
<div id="site-name"><strong>
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</strong></div>
<?php else: /* Use h1 when the content title is empty */ ?>
<h1 id="site-name">
main menu
<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print
$site_name; ?></span></a>
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
breadcrumb
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
messages
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu',
'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
highight
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<h1> title
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
tabs
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
help
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
content
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
feed icons
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' =>
sidebars
footer
'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->
</div></div> <!-- /#page, /#page-wrapper -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-79-320.jpg)
![The Semantic Page
• Logo/branding/site name
• [main nav]*
• <h1> Title (of article, view, blog post, etc.)
• Main content
• Then sidebar(s), footer
* and that's debated](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-80-320.jpg)
![<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?
php print $site_name; ?></span></a>
page.tpl.php
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id'
=> 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></
div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php
endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' =>
array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary
menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-81-320.jpg)
![<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?
php print $site_name; ?></span></a>
page.tpl.php
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
</div></div> <!-- /.section, /#header -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id'
=> 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></
div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php
endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' =>
array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary
menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-82-320.jpg)
![<a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?
php print $site_name; ?></span></a>
page.tpl.php
</h1>
<?php endif; ?>
<?php endif; ?>
<?php if ($site_slogan): ?>
<div id="site-slogan"><?php print $site_slogan; ?></div>
<?php endif; ?>
</div> <!-- /#name-and-slogan -->
<?php endif; ?>
<?php print render($page['header']); ?>
</div></div> <!-- /.section, /#header -->
<?php print $messages; ?>
<div id="main-wrapper"><div id="main" class="clearfix">
<div id="content" class="column"><div class="section">
<?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></
div><?php endif; ?>
<a id="main-content"></a>
<?php print render($title_prefix); ?>
<?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?>
<?php print render($page['help']); ?>
<?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php
endif; ?>
<?php print render($page['content']); ?>
<?php print $feed_icons; ?>
</div></div> <!-- /.section, /#content -->
<?php if ($page['sidebar_first']): ?>
<div id="sidebar-first" class="column sidebar"><div class="section">
<?php print render($page['sidebar_first']); ?>
</div></div> <!-- /.section, /#sidebar-first -->
<?php endif; ?>
<?php if ($page['sidebar_second']): ?>
<div id="sidebar-second" class="column sidebar"><div class="section">
<?php print render($page['sidebar_second']); ?>
</div></div> <!-- /.section, /#sidebar-second -->
<?php endif; ?>
</div></div> <!-- /#main, /#main-wrapper -->
<?php if ($main_menu): ?>
<div id="navigation"><div class="section">
<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id'
=> 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?>
</div></div> <!-- /.section, /#navigation -->
<?php endif; ?>
<?php if ($breadcrumb): ?>
<div id="breadcrumb"><?php print $breadcrumb; ?></div>
<?php endif; ?>
<div id="footer"><div class="section">
<?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' =>
array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary
menu'))); ?>
<?php print render($page['footer']); ?>
</div></div> <!-- /.section, /#footer -->](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-83-320.jpg)
![node.tpl.php
<div id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?>
clearfix"<?php print $attributes; ?>>
<?php print $user_picture; ?>
<?php print render($title_prefix); ?>
<?php if (!$page): ?>
<h2<?php print $title_attributes; ?>><a href="<?php print $node_url; ?
>"><?php print $title; ?></a></h2>
<?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($display_submitted): ?>
<div class="submitted">
<?php
print t('Submitted by !username on !datetime',
array('!username' => $name, '!datetime' => $date));
?>
</div>
<?php endif; ?>
<div class="content"<?php print $content_attributes; ?>>
<?php
// We hide the comments and links now so that we can render them
later.
hide($content['comments']);
hide($content['links']);
print render($content);
?>
</div>
<?php print render($content['links']); ?>
<?php print render($content['comments']); ?>
</div>](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-86-320.jpg)
![node.tpl.php
<div id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?>
clearfix"<?php print $attributes; ?>>
<?php print $user_picture; ?>
<?php print render($title_prefix); ?>
<?php if (!$page): ?>
<h2<?php print $title_attributes; ?>><a href="<?php print $node_url; ?
>"><?php print $title; ?></a></h2>
<?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($display_submitted): ?>
<div class="submitted">
<?php
print t('Submitted by !username on !datetime',
array('!username' => $name, '!datetime' => $date));
?>
</div>
<?php endif; ?>
<div class="content"<?php print $content_attributes; ?>>
<?php
// We hide the comments and links now so that we can render them
later.
hide($content['comments']);
hide($content['links']);
print render($content);
?>
</div>
<?php print render($content['links']); ?>
<?php print render($content['comments']); ?>
</div>](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-87-320.jpg)
![node.tpl.php
<div id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?>
clearfix"<?php print $attributes; ?>>
<?php print $user_picture; ?>
<?php print render($title_prefix); ?>
<?php if (!$page): ?>
<h2<?php print $title_attributes; ?>><a href="<?php print $node_url; ?
>"><?php print $title; ?></a></h2>
<?php endif; ?>
<?php print render($title_suffix); ?>
<?php if ($display_submitted): ?>
<div class="submitted">
<?php
print t('Submitted by !username on !datetime',
array('!username' => $name, '!datetime' => $date));
?>
</div>
<?php endif; ?>
<div class="content"<?php print $content_attributes; ?>>
<?php
// We hide the comments and links now so that we can render them
later.
hide($content['comments']);
hide($content['links']);
print render($content);
?>
</div>
<?php print render($content['links']); ?>
<?php print render($content['comments']); ?>
</div>](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-88-320.jpg)
![comment-wrapper.tpl.php
<div id="comments" class="<?php print $classes; ?>"<?php
print $attributes; ?>>
<?php if ($content['comments'] && $node->type !=
'forum'): ?>
<h2 class="title"><?php print t('Comments'); ?></h2>
<?php endif; ?>
<?php print render($content['comments']); ?>
<?php if ($content['comment_form']): ?>
<h2 class="title comment-form"><?php print t('Add
new comment'); ?></h2>
<?php print render($content['comment_form']); ?>
<?php endif; ?>
</div>](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-95-320.jpg)
![comment.tpl.php
<div class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>>
<?php print $picture ?>
<?php if ($new): ?>
<span class="new"><?php print $new ?></span>
<?php endif; ?>
<?php print render($title_prefix); ?>
<h3<?php print $title_attributes; ?>><?php print $title ?></h3>
<?php print render($title_suffix); ?>
<div class="submitted">
<?php print $permalink; ?>
<?php
print t('Submitted by !username on !datetime.',
array('!username' => $author, '!datetime' => $created));
?>
</div>
<div class="content"<?php print $content_attributes; ?>>
<?php
// We hide the comments and links now so that we can render them later.
hide($content['links']);
print render($content);
?>
<?php if ($signature): ?>
<div class="user-signature clearfix">
<?php print $signature ?>
</div>
<?php endif; ?>
</div>
<?php print render($content['links']) ?>
</div>](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-98-320.jpg)
![field.tpl.php
<div class="<?php print $classes; ?> clearfix"<?php
print $attributes; ?>>
<?php if (!$label_hidden) : ?>
<div class="field-label"<?php print
$title_attributes; ?>><?php print $label ?>: </div>
<?php endif; ?>
<div class="field-items"<?php print
$content_attributes; ?>>
<?php foreach ($items as $delta => $item) : ?>
<div class="field-item <?php print $delta % 2 ?
'odd' : 'even'; ?>"<?php print
$item_attributes[$delta]; ?>><?php print
render($item); ?></div>
<?php endforeach; ?>
</div>
</div>](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-106-320.jpg)
![<?php print render($page['header']); ?>](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-115-320.jpg)
![<?php print render($page['header']); ?>
<?php print render($page['help']); ?>
<?php print render($page['highlight']); ?>
<?php print render($page['content']); ?>
<?php print render($page['sidebar_first']); ?>
<?php print render($page['sidebar_second']); ?>
<?php print render($page['footer']); ?>](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-116-320.jpg)
![yourtheme.info
name = yourtheme
description = This is where you describe your theme in words.
version = 1.0
; Requirements
base theme = ninesixty
core = 7.x
engine = phptemplate
; Stylesheets
stylesheets[screen][] = styles/base.css
stylesheets[screen][] = styles/layout.css
stylesheets[screen][] = styles/colors.css
stylesheets[screen][] = styles/forms.css
stylesheets[print][] = styles/print.css
; Regions
regions[header] = Header
regions[help] = Help
regions[highlight] = Highlight
regions[content] = Content
regions[page_top] = Page top
regions[page_bottom] = Page bottom
regions[indicators] = Indicators
regions_hidden[] = indicators
; Scripts
scripts[] = scripts/twitter.js](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-141-320.jpg)
![yourtheme.info
name = yourtheme
description = This is where you describe your theme in words.
version = 1.0
; Requirements
base theme = ninesixty
core = 7.x
engine = phptemplate
; Stylesheets
stylesheets[screen][] = styles/base.css
stylesheets[screen][] = styles/layout.css
stylesheets[screen][] = styles/colors.css
stylesheets[screen][] = styles/forms.css
stylesheets[print][] = styles/print.css
; Regions
regions[header] = Header
regions[help] = Help
regions[highlight] = Highlight
regions[content] = Content
regions[page_top] = Page top
regions[page_bottom] = Page bottom
regions[indicators] = Indicators
regions_hidden[] = indicators
; Scripts
scripts[] = scripts/twitter.js](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-142-320.jpg)
![yourtheme.info
name = yourtheme
description = This is where you describe your theme in words.
version = 1.0
; Requirements
base theme = ninesixty
core = 7.x
engine = phptemplate
; Stylesheets
stylesheets[screen][] = styles/base.css
stylesheets[screen][] = styles/layout.css
stylesheets[screen][] = styles/colors.css
stylesheets[screen][] = styles/forms.css
stylesheets[print][] = styles/print.css
; Regions
regions[header] = Header
regions[help] = Help
regions[highlight] = Highlight
regions[content] = Content
regions[page_top] = Page top
regions[page_bottom] = Page bottom
regions[indicators] = Indicators
regions_hidden[] = indicators
; Scripts
scripts[] = scripts/twitter.js](https://image.slidesharecdn.com/grokdrupaltheming-100428202145-phpapp01/85/Grok-Drupal-7-Theming-presented-at-DrupalCon-San-Francisco-143-320.jpg)
Grok Drupal (7) Theming (presented at DrupalCon San Francisco)
- 1. Grok Drupal Theming Laura PINGV @lauras #grokd4d
- 2. Laura
- 3. Laura pal tor, Drunder Cr eative DinecCo-Fou r Ar chitect eatd e a iv PING V Cr drupal.org/u ser/18973 Drupal since 2004 @lauras #grokd4d
- 5. @lauras #grokd4d http://sf2010.drupal.org/ node/add/eval/8278
- 6. More on Drupal Theming this week
- 7. More on Drupal Theming this week • Theming with Skinr! (Jacine Rodriguez) — Right after this session, right here in this room. • All your html are belong to us (Morten) — Wednesday at 4:15pm. • Sprint on Thursday — Free! Open! Friendly!
- 8. Grok Drupal
- 9. Grok Drupal Grok means to understand so thoroughly that the observer becomes a part of the observed — to merge, blend, intermarry, lose identity in group experience. Robert A. Heinlein, Stranger in a Strange Land
- 10. Grok Drupal
- 11. <h1 id="title"> Grok Drupal </h1>
- 12. <h1 id="title"> Grok Drupal </h1>
- 13. <h1 id="title"> Grok Drupal </h1> How Drupal displays content (templates)
- 14. <h1 id="title"> Grok Drupal </h1> How Drupal displays content (templates) How to start theming
- 15. <h1 id="title"> Grok Drupal </h1> How Drupal displays content (templates) How to start theming Other things to consider
- 16. Assumptions
- 17. Assumptions • You know HTML/xhtml
- 18. Assumptions • You know HTML/xhtml • You know CSS 2.1
- 19. Assumptions • You know HTML/xhtml • You know CSS 2.1 • You are at least getting to know CSS 3 (or want to)
- 20. Assumptions • You know HTML/xhtml • You know CSS 2.1 • You are at least getting to know CSS 3 (or want to) • Drupal theming confuses or mystifies you
- 21. Assumptions • You know HTML/xhtml • You don't know PHP (but if you do, we won't • You know CSS 2.1 hold it against you) • You are at least getting to know CSS 3 (or want to) • Drupal theming confuses or mystifies you
- 22. Assumptions • You know HTML/xhtml • You don't know PHP (but if you do, we won't • You know CSS 2.1 hold it against you) • You are at least getting • You understand some to know CSS 3 (or want basic Drupal to) architecture concepts • Drupal theming confuses or mystifies you
- 23. Assumptions • You know HTML/xhtml • You don't know PHP (but if you do, we won't • You know CSS 2.1 hold it against you) • You are at least getting • You understand some to know CSS 3 (or want basic Drupal to) architecture concepts • Drupal theming confuses • You want to learn this or mystifies you
- 24. Some PHP required • Mainly to print pre-defined variables … e.g., $title (for the page title). • You can do a lot in the "preprocess" and "process" functions. • You can avoid it if it totally scares the living daylights out of you. Just stick to copy and paste from '<?php' to '?>'.
- 26. Drupal 7 is more complex than Drupal 6 ...but it's also more simple
- 28. Anatomy of a Drupal "page" • xhtml, CSS, images
- 29. Anatomy of a Drupal "page" • xhtml, CSS, images • Content presented via templates
- 30. Anatomy of a Drupal "page" • xhtml, CSS, images • Content presented via templates • JavaScript
- 31. The Drupal theme
- 32. The Drupal theme • CSS files • Image files • Template files • JavaScript files • Preprocess and process files • .info file
- 33. The Drupal theme • CSS files • Image files • Template files • JavaScript files • Preprocess and process files • .info file
- 34. • CSS files • Image files • Template files • JavaScript files • Preprocess and process files • .info file
- 36. Which template?
- 37. Which template? It depends....
- 38. Which template?
- 39. Which template? page.tpl.php • logo • main title • regions • footer and • other templates
- 40. Which template? html.tpl.php new! page.tpl.php • !DOCTYPE • <head> stuff • Drupal calls for CSS and JavaScript* • <body> container
- 41. Which template? html.tpl.php page.tpl.php node.tpl.php • node title • node author • post date • node content • node taxonomy terms • node links
- 42. Which template? html.tpl.php page.tpl.php node.tpl.php comment-wrapper.tpl.php • Comment area title? • Comment templates
- 43. Which template? html.tpl.php page.tpl.php node.tpl.php comment-wrapper.tpl.php comment.tpl.php • Comment title? • Comment author • Comment content • Comment links
- 44. Which template? html.tpl.php page.tpl.php node.tpl.php block.tpl.php • Block title • Block content comment-wrapper.tpl.php comment.tpl.php
- 46. Every module's output also has a template file. (In theory.)
- 47. 42 *.tpl.php files in D7's /modules folder. Each can be copied and used to override.
- 48. One theme might have dozens of template files.
- 50. There are only a few basics.
- 51. There are only a few basics. (It's not rocket science.)
- 53. What's inside a template?
- 54. html.tpl.php
- 55. html.tpl.php
- 56. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>>
- 57. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>>
- 58. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>> <head profile="<?php print $grddl_profile; ?>"> <?php print $head; ?> <title><?php print $head_title; ?></title> <?php print $styles; ?> <?php print $scripts; ?> </head>
- 59. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>> <head profile="<?php print $grddl_profile; ?>"> <?php print $head; ?> <title><?php print $head_title; ?></title> <?php print $styles; ?> <?php print $scripts; ?> </head>
- 60. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>> <head profile="<?php print $grddl_profile; ?>"> <?php print $head; ?> <title><?php print $head_title; ?></title> <?php print $styles; ?> <?php print $scripts; ?> </head> <body class="<?php print $classes; ?>" <?php print $attributes;?>> <div id="skip-link"> <a href="#main-content"><?php print t('Skip to main content'); ?></a> </div> <?php print $page_top; ?> <?php print $page; ?> <?php print $page_bottom; ?> </body> </html>
- 61. <body class="<?php print $classes; ?>" <?php print $attributes;?>> <div id="skip-link"> <a href="#main-content"><?php print t('Skip to main content'); ?></a> </div> <?php print $page_top; ?> <?php print $page; ?> <?php print $page_bottom; ?> </body> </html>
- 62. <body class="<?php print $classes; ?>" <?php print $attributes;?>> <div id="skip-link"> <a href="#main-content"><?php print t('Skip to main content'); ?></a> </div> <?php print $page_top; ?> <?php print $page; ?> <?php print $page_bottom; ?> </body> </html>
- 63. page.tpl.php
- 64. page.tpl.php
- 65. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 66. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 67. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 68. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 69. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 70. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 71. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> messages </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 72. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> messages </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> highight </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 73. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> messages </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> highight </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <h1> title <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 74. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> messages </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> highight </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <h1> title <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> tabs <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 75. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> messages </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> highight </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <h1> title <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> tabs <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> help <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 76. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> messages </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> highight </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <h1> title <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> tabs <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> help <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> content <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 77. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> messages </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> highight </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <h1> title <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> tabs <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> help <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> content <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> feed icons <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 78. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> messages </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> highight </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <h1> title <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> tabs <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> help <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> content <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> feed icons <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> sidebars <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 79. page.tpl.php <div id="page-wrapper"><div id="page"> <div id="header"><div class="section clearfix"> <?php if ($logo): ?> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo"> logo <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" /> site name </a> <?php endif; ?> <?php if ($site_name || $site_slogan): ?> <div id="name-and-slogan"> <?php if ($site_name): ?> <?php if ($title): ?> site slogan <div id="site-name"><strong> <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </strong></div> <?php else: /* Use h1 when the content title is empty */ ?> <h1 id="site-name"> main menu <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a> </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> breadcrumb <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> messages </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> highight </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <h1> title <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> tabs <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> help <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> content <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> feed icons <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => sidebars footer 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer --> </div></div> <!-- /#page, /#page-wrapper -->
- 80. The Semantic Page • Logo/branding/site name • [main nav]* • <h1> Title (of article, view, blog post, etc.) • Main content • Then sidebar(s), footer * and that's debated
- 81. <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><? php print $site_name; ?></span></a> page.tpl.php </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></ div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer -->
- 82. <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><? php print $site_name; ?></span></a> page.tpl.php </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> </div></div> <!-- /.section, /#header --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></ div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer -->
- 83. <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home"><span><? php print $site_name; ?></span></a> page.tpl.php </h1> <?php endif; ?> <?php endif; ?> <?php if ($site_slogan): ?> <div id="site-slogan"><?php print $site_slogan; ?></div> <?php endif; ?> </div> <!-- /#name-and-slogan --> <?php endif; ?> <?php print render($page['header']); ?> </div></div> <!-- /.section, /#header --> <?php print $messages; ?> <div id="main-wrapper"><div id="main" class="clearfix"> <div id="content" class="column"><div class="section"> <?php if ($page['highlight']): ?><div id="highlight"><?php print render($page['highlight']); ?></ div><?php endif; ?> <a id="main-content"></a> <?php print render($title_prefix); ?> <?php if ($title): ?><h1 class="title" id="page-title"><?php print $title; ?></h1><?php endif; ?> <?php print render($title_suffix); ?> <?php if ($tabs): ?><div class="tabs"><?php print render($tabs); ?></div><?php endif; ?> <?php print render($page['help']); ?> <?php if ($action_links): ?><ul class="action-links"><?php print render($action_links); ?></ul><?php endif; ?> <?php print render($page['content']); ?> <?php print $feed_icons; ?> </div></div> <!-- /.section, /#content --> <?php if ($page['sidebar_first']): ?> <div id="sidebar-first" class="column sidebar"><div class="section"> <?php print render($page['sidebar_first']); ?> </div></div> <!-- /.section, /#sidebar-first --> <?php endif; ?> <?php if ($page['sidebar_second']): ?> <div id="sidebar-second" class="column sidebar"><div class="section"> <?php print render($page['sidebar_second']); ?> </div></div> <!-- /.section, /#sidebar-second --> <?php endif; ?> </div></div> <!-- /#main, /#main-wrapper --> <?php if ($main_menu): ?> <div id="navigation"><div class="section"> <?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Main menu'))); ?> </div></div> <!-- /.section, /#navigation --> <?php endif; ?> <?php if ($breadcrumb): ?> <div id="breadcrumb"><?php print $breadcrumb; ?></div> <?php endif; ?> <div id="footer"><div class="section"> <?php print theme('links__system_secondary_menu', array('links' => $secondary_menu, 'attributes' => array('id' => 'secondary-menu', 'class' => array('links', 'clearfix')), 'heading' => t('Secondary menu'))); ?> <?php print render($page['footer']); ?> </div></div> <!-- /.section, /#footer -->
- 84. node.tpl.php
- 85. node.tpl.php
- 86. node.tpl.php <div id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>> <?php print $user_picture; ?> <?php print render($title_prefix); ?> <?php if (!$page): ?> <h2<?php print $title_attributes; ?>><a href="<?php print $node_url; ? >"><?php print $title; ?></a></h2> <?php endif; ?> <?php print render($title_suffix); ?> <?php if ($display_submitted): ?> <div class="submitted"> <?php print t('Submitted by !username on !datetime', array('!username' => $name, '!datetime' => $date)); ?> </div> <?php endif; ?> <div class="content"<?php print $content_attributes; ?>> <?php // We hide the comments and links now so that we can render them later. hide($content['comments']); hide($content['links']); print render($content); ?> </div> <?php print render($content['links']); ?> <?php print render($content['comments']); ?> </div>
- 87. node.tpl.php <div id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>> <?php print $user_picture; ?> <?php print render($title_prefix); ?> <?php if (!$page): ?> <h2<?php print $title_attributes; ?>><a href="<?php print $node_url; ? >"><?php print $title; ?></a></h2> <?php endif; ?> <?php print render($title_suffix); ?> <?php if ($display_submitted): ?> <div class="submitted"> <?php print t('Submitted by !username on !datetime', array('!username' => $name, '!datetime' => $date)); ?> </div> <?php endif; ?> <div class="content"<?php print $content_attributes; ?>> <?php // We hide the comments and links now so that we can render them later. hide($content['comments']); hide($content['links']); print render($content); ?> </div> <?php print render($content['links']); ?> <?php print render($content['comments']); ?> </div>
- 88. node.tpl.php <div id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>> <?php print $user_picture; ?> <?php print render($title_prefix); ?> <?php if (!$page): ?> <h2<?php print $title_attributes; ?>><a href="<?php print $node_url; ? >"><?php print $title; ?></a></h2> <?php endif; ?> <?php print render($title_suffix); ?> <?php if ($display_submitted): ?> <div class="submitted"> <?php print t('Submitted by !username on !datetime', array('!username' => $name, '!datetime' => $date)); ?> </div> <?php endif; ?> <div class="content"<?php print $content_attributes; ?>> <?php // We hide the comments and links now so that we can render them later. hide($content['comments']); hide($content['links']); print render($content); ?> </div> <?php print render($content['links']); ?> <?php print render($content['comments']); ?> </div>
- 89. block.tpl.php
- 90. block.tpl.php
- 91. 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 $title_attributes; ?>><?php print $block->subject ?></h2> <?php endif;?> <?php print render($title_suffix); ?> <div class="content"<?php print $content_attributes; ? >> <?php print $content ?> </div> </div>
- 92. 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 $title_attributes; ?>><?php print $block->subject ?></h2> <?php endif;?> <?php print render($title_suffix); ?> <div class="content"<?php print $content_attributes; ? >> <?php print $content ?> </div> </div>
- 95. comment-wrapper.tpl.php <div id="comments" class="<?php print $classes; ?>"<?php print $attributes; ?>> <?php if ($content['comments'] && $node->type != 'forum'): ?> <h2 class="title"><?php print t('Comments'); ?></h2> <?php endif; ?> <?php print render($content['comments']); ?> <?php if ($content['comment_form']): ?> <h2 class="title comment-form"><?php print t('Add new comment'); ?></h2> <?php print render($content['comment_form']); ?> <?php endif; ?> </div>
- 96. comment.tpl.php
- 97. comment.tpl.php
- 98. comment.tpl.php <div class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>> <?php print $picture ?> <?php if ($new): ?> <span class="new"><?php print $new ?></span> <?php endif; ?> <?php print render($title_prefix); ?> <h3<?php print $title_attributes; ?>><?php print $title ?></h3> <?php print render($title_suffix); ?> <div class="submitted"> <?php print $permalink; ?> <?php print t('Submitted by !username on !datetime.', array('!username' => $author, '!datetime' => $created)); ?> </div> <div class="content"<?php print $content_attributes; ?>> <?php // We hide the comments and links now so that we can render them later. hide($content['links']); print render($content); ?> <?php if ($signature): ?> <div class="user-signature clearfix"> <?php print $signature ?> </div> <?php endif; ?> </div> <?php print render($content['links']) ?> </div>
- 99. polls
- 100. node.tpl.php node.tpl.php poll-vote.tpl.php poll-results.tpl.php poll-bar.tpl.php
- 101. block.tpl.php block.tpl.php poll-vote.tpl.php poll-results--block.tpl.php poll-bar--block.tpl.php
- 103. Fields are in core It's nice to have a home.
- 104. field.tpl.php
- 105. field.tpl.php
- 106. field.tpl.php <div class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>> <?php if (!$label_hidden) : ?> <div class="field-label"<?php print $title_attributes; ?>><?php print $label ?>: </div> <?php endif; ?> <div class="field-items"<?php print $content_attributes; ?>> <?php foreach ($items as $delta => $item) : ?> <div class="field-item <?php print $delta % 2 ? 'odd' : 'even'; ?>"<?php print $item_attributes[$delta]; ?>><?php print render($item); ?></div> <?php endforeach; ?> </div> </div>
- 107. html.tpl.php page.tpl.php node.tpl.php block.tpl.php comment-wrapper.tpl.php comment.tpl.php
- 108. html.tpl.php page.tpl.php region.tpl.php region.tpl.php region.tpl.php node.tpl.php block.tpl.php comment-wrapper.tpl.php comment.tpl.php region.tpl.php
- 109. region.tpl.php
- 110. region.tpl.php
- 111. region.tpl.php <div class="<?php print $classes; ?>"> <?php print $content; ?> </div>
- 112. So if all regions use the same template, how does Drupal know which region?
- 116. <?php print render($page['header']); ?> <?php print render($page['help']); ?> <?php print render($page['highlight']); ?> <?php print render($page['content']); ?> <?php print render($page['sidebar_first']); ?> <?php print render($page['sidebar_second']); ?> <?php print render($page['footer']); ?>
- 117. All regions in your theme must be declared, or else you get these defaults.
- 118. Where the heck are all these templates?
- 119. example.com/modules
- 120. example.com/modules BUT DON'T EDIT THEM THERE!
- 122. Preprocess
- 123. Preprocess
- 124. Preprocess scary doesn't have to be
- 126. May I recommend.... !"!#$%& '&()*+#',-./0,&- PHP for Drupal Designers, !"#$%%&#'&()#*+,-.(# by Emma Jane Hogbin !""#$%!&'()*+*,!"!-.+"!"!///-%!&'()*+*,!"!-.+"! designtotheme.com
- 127. So how to go about creating a theme?
- 128. Create a theme from scratch, making everything
- 129. Create a theme from scratch, making everything • theme .info file • page.tpl.php • *.tpl.php files as needed to override core • template.php for your preprocess and postprocess • background images
- 130. or make a baby!
- 131. Sub-themes inherit everything from parent theme, except what is overridden.
- 132. Inheritance base.css base.css style.css style.css forms.css
- 133. Inheritance page.tpl.php page.tpl.php node.tpl.php node.tpl.php block.tpl.php
- 134. Many good base themes • AdaptiveTheme • Mobile • Basic • NineSixty • Blueprint • Stark • Framework • Studio • Fusion • Zen • Genesis
- 135. Create your theme
- 139. yourtheme.info
- 140. yourtheme.info
- 141. yourtheme.info name = yourtheme description = This is where you describe your theme in words. version = 1.0 ; Requirements base theme = ninesixty core = 7.x engine = phptemplate ; Stylesheets stylesheets[screen][] = styles/base.css stylesheets[screen][] = styles/layout.css stylesheets[screen][] = styles/colors.css stylesheets[screen][] = styles/forms.css stylesheets[print][] = styles/print.css ; Regions regions[header] = Header regions[help] = Help regions[highlight] = Highlight regions[content] = Content regions[page_top] = Page top regions[page_bottom] = Page bottom regions[indicators] = Indicators regions_hidden[] = indicators ; Scripts scripts[] = scripts/twitter.js
- 142. yourtheme.info name = yourtheme description = This is where you describe your theme in words. version = 1.0 ; Requirements base theme = ninesixty core = 7.x engine = phptemplate ; Stylesheets stylesheets[screen][] = styles/base.css stylesheets[screen][] = styles/layout.css stylesheets[screen][] = styles/colors.css stylesheets[screen][] = styles/forms.css stylesheets[print][] = styles/print.css ; Regions regions[header] = Header regions[help] = Help regions[highlight] = Highlight regions[content] = Content regions[page_top] = Page top regions[page_bottom] = Page bottom regions[indicators] = Indicators regions_hidden[] = indicators ; Scripts scripts[] = scripts/twitter.js
- 143. yourtheme.info name = yourtheme description = This is where you describe your theme in words. version = 1.0 ; Requirements base theme = ninesixty core = 7.x engine = phptemplate ; Stylesheets stylesheets[screen][] = styles/base.css stylesheets[screen][] = styles/layout.css stylesheets[screen][] = styles/colors.css stylesheets[screen][] = styles/forms.css stylesheets[print][] = styles/print.css ; Regions regions[header] = Header regions[help] = Help regions[highlight] = Highlight regions[content] = Content regions[page_top] = Page top regions[page_bottom] = Page bottom regions[indicators] = Indicators regions_hidden[] = indicators ; Scripts scripts[] = scripts/twitter.js
- 144. Template Suggestions • Create a base template of that type • Create variations on it to apply in certain circumstances • No coding necessary http://drupal.org/node/190815
- 145. Template Suggestions by content type
- 146. Template Suggestions by content type node.tpl.php blog event classified product
- 147. Template Suggestions by content type node.tpl.php blog node--blog.tpl.php event node--event.tpl.php classified node--classified.tpl.php product node--product.tpl.php
- 148. Template Suggestions by content type node.tpl.php blog node--blog.tpl.php event node--event.tpl.php classified node--classified.tpl.php product node--product.tpl.php
- 149. Template Suggestions by content type node.tpl.php blog node--blog.tpl.php event node--event.tpl.php classified node--classified.tpl.php product node--product.tpl.php
- 150. Template Suggestions by content type node.tpl.php blog node--blog.tpl.php event node--event.tpl.php classified node--classified.tpl.php product node--product.tpl.php
- 151. Delimiters use two: '--' Words still use one: '-'
- 152. Delimiters use two: '--' Words still use one: '-' event-meeting node--event-meeting.tpl.php event-party node--event-party.tpl.php
- 153. Be nice to robots! photo: Don Solo flickr.com/photos/donsolo/3950364004/
- 155. RDFa • Robot food photo: Don Solo flickr.com/photos/donsolo/3950364004/
- 156. RDFa • Robot food • An entire language to learn photo: Don Solo flickr.com/photos/donsolo/3950364004/
- 157. RDFa • Robot food • An entire language to learn • Theming just got a lot more technical photo: Don Solo flickr.com/photos/donsolo/3950364004/
- 160. Robots just want to Hand over I'm hungry! your RDF! understand your site. Hmmmmm…. data….. Image: bbaltimore flickr.com/photos/bbaltimore/6778028/
- 162. Dance with them! It's easy! Image: Eric__I_E flickr.com/photos/deadling/256390679/
- 163. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml- rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>>
- 164. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml- rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>>
- 165. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml- rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>>
- 166. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml- rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>>
- 167. html.tpl.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml- rdfa-1.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" version="XHTML+RDFa 1.0" dir="<?php print $language->dir; ?>" <?php print $rdf_namespaces; ?>>
- 168. Do I really need to do RDFa to use Drupal? Photo: FlySi flickr.com/photos/flysi/183272970/
- 169. Do I really need to do RDFa to use Drupal? No, you can just ignore it, and work on the same level as other systems. But you'll be missing out. Photo: FlySi flickr.com/photos/flysi/183272970/
- 170. Points of Modification • CSS • xhtml in the template that applies • preprocess • module
- 171. Basics to Remember • Create your theme in sites/all/themes/yourtheme • Copy templates into your theme to make overrides • Use template suggestions to break out distinct structures and stylings • Use base theme to get a jump on things • Let Drupal do what it does best
- 172. Resources • Drupal 6 » Drupal 7 theming changes drupal.org/update/theme/6/7 • Template suggestions drupal.org/node/190815* • RDFa buytaert.net/semantic-web-and-drupal-video * Drupal 6
- 174. Get Drush! Yeah yeah yeah, I know, you don't like command line, but this will really really and for true help you save time developing so that you can spend more time designing and theming, and isn't that what you'd rather do anyway? Video to make it easy: http://is.gd/ aZe 33
- 175. @lauras #d4dgrok rarepattern.com/contact ©2010 Laura Scott
- 176. Questions?
- 177. Questions? Feedback is good! @lauras #grokd4d http://sf2010.drupal.org/ node/add/eval/8278
Editor's Notes
- #3: About me
- #4: About me
- #5: About me
- #6: About me
- #7: About me
- #8: About me
- #9: About me
- #10: About me
- #11: About me
- #12: About me
- #13: About me
- #14: Most of the most interesting theming sessions have already happened But stay here in this room for Jacine's session. - If you care about clean markup, check out Morten's session tomorrow - On Thursday is the big sprint. Even if you're new, come join in. Lots of breakout groups.
- #15: Most of the most interesting theming sessions have already happened But stay here in this room for Jacine's session. - If you care about clean markup, check out Morten's session tomorrow - On Thursday is the big sprint. Even if you're new, come join in. Lots of breakout groups.
- #16: Most of the most interesting theming sessions have already happened But stay here in this room for Jacine's session. - If you care about clean markup, check out Morten's session tomorrow - On Thursday is the big sprint. Even if you're new, come join in. Lots of breakout groups.
- #22: * MOSTLY templates, but more than templates
- #23: * MOSTLY templates, but more than templates
- #24: * MOSTLY templates, but more than templates
- #33: The bad news The good news
- #34: The bad news The good news
- #35: Gross oversimplifcation
- #36: Gross oversimplifcation
- #37: Gross oversimplifcation
- #38: Gross oversimplifcation
- #49: Templates are the most involved, but provide the foundation for theming
- #50: The question is when you come to a page... which template applies? And the answer is clear: [X] It depends
- #51: The question is when you come to a page... which template applies? And the answer is clear: [X] It depends
- #52: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #53: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #54: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #55: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #56: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #57: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #58: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #59: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #60: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #61: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #62: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #63: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #64: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #65: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #66: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #67: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #68: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #69: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #70: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #71: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #72: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #73: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #74: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #75: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #76: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #77: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #78: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #79: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #80: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #81: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #82: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #83: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #84: because a Drupal page has many templates controlling the output presentation. Let's start with the basics [X] page.tpl.php **now don't fret over that php extension on the filename - get into it later**
- #96: What's this? It's new in D7. So where is the page template?
- #97: RDF namespaces we'll get into later
- #99: First is the doctype declaration. We'll get a bit more into that later. [X] Then is the head information Yes, there is PHP, but look at how simple and contained it is. Scared? If you leave the stuff between the php tags, you'll be fine [X] Then is the body. An example of the power you have. Look at that ugly "skip-link" div. Why? [X] (to focus)
- #100: The anchor tag could be given that id and you could skip that div. This is the power of templates. You can change this kind of stuff. Aside: If you define custom regions, it is important to remember that you need to include the page_top and page_bottom regions in your set of regions.
- #131: One of my things is why sidebar blocks would have h2 tags. If you're looking at a river of news, nodes will have h2 tags for their titles. The blocks should have h3 tags at the least. This is supplementary info with a lower semantic importance.
- #139: Life is good, because [X] fields are now in core
- #140: Life is good, because [X] fields are now in core
- #141: Life is good, because [X] fields are now in core
- #142: Life is good, because [X] fields are now in core
- #143: Life is good, because [X] fields are now in core
- #144: Life is good, because [X] fields are now in core
- #147: My previous chart was omitting a big thing. Left out to focus on what we see But now let's get into it: [x} REGIONS
- #148: My previous chart was omitting a big thing. Left out to focus on what we see But now let's get into it: [x} REGIONS
- #152: Every region has its own content, own blocks. The tpl file is just a potato sack. The sack is the same, but what's in it makes the sack different.
- #153: So when printing, you tell Drupal which sack is printing. The syntax in Drupal 7 is new, but it's a simple, consistent syntax Header [X]
- #154: So when printing, you tell Drupal which sack is printing. The syntax in Drupal 7 is new, but it's a simple, consistent syntax Header [X]
- #155: So when printing, you tell Drupal which sack is printing. The syntax in Drupal 7 is new, but it's a simple, consistent syntax Header [X]
- #156: So when printing, you tell Drupal which sack is printing. The syntax in Drupal 7 is new, but it's a simple, consistent syntax Header [X]
- #157: So when printing, you tell Drupal which sack is printing. The syntax in Drupal 7 is new, but it's a simple, consistent syntax Header [X]
- #158: So when printing, you tell Drupal which sack is printing. The syntax in Drupal 7 is new, but it's a simple, consistent syntax Header [X]
- #159: So when printing, you tell Drupal which sack is printing. The syntax in Drupal 7 is new, but it's a simple, consistent syntax Header [X]
- #162: We'll get into where and how to get started in a moment. There's one more major part of the Drupal theming system you'll want to be aware of.
- #169: Think of it as a way of adding your own creation to the templates
- #171: So with all of these templates, where do you start?
- #172: One way or [X]
- #174: Subthemes inherit everything, except what's overridden Which makes them the best and easiest way to "modify" a theme.
- #175: As an illustration
- #176: Same goes for templates. And JavaScripts.
- #178: You may want to put your theme in the themes folder Makes sense, right? [X] Don't do that!
- #179: You may want to put your theme in the themes folder Makes sense, right? [X] Don't do that!
- #180: You may want to put your theme in the themes folder Makes sense, right? [X] Don't do that!
- #189: You can define custom specific templates by using "template suggestions" [X] For example, node templates can be made for each content type [X] Note something new in Drupal 7
- #190: You can define custom specific templates by using "template suggestions" [X] For example, node templates can be made for each content type [X] Note something new in Drupal 7
- #191: You can define custom specific templates by using "template suggestions" [X] For example, node templates can be made for each content type [X] Note something new in Drupal 7
- #192: You can define custom specific templates by using "template suggestions" [X] For example, node templates can be made for each content type [X] Note something new in Drupal 7
- #193: Note something new in Drupal 7 You now use a double-hyphen delimiter
- #194: Note something new in Drupal 7 You now use a double-hyphen delimiter
- #195: Note something new in Drupal 7 You now use a double-hyphen delimiter
- #196: Note something new in Drupal 7 You now use a double-hyphen delimiter
- #197: Word phrases still use one hyphen. For example.
- #198: Word phrases still use one hyphen. For example.
- #199: Word phrases still use one hyphen. For example.
- #200: Word phrases still use one hyphen. For example.
- #201: Word phrases still use one hyphen. For example.
- #202: Word phrases still use one hyphen. For example.
- #203: Word phrases still use one hyphen. For example.
- #205: Resource Description Framework More technical because the theming layer is presenting more things that you cannot see, but robots CAN see
- #206: Resource Description Framework More technical because the theming layer is presenting more things that you cannot see, but robots CAN see
- #207: Resource Description Framework More technical because the theming layer is presenting more things that you cannot see, but robots CAN see
- #208: Robots don't have to be scary
- #209: Robots are your friends
- #210: Robots are your friends
- #211: Robots are your friends
- #212: Robots are your friends
- #213: Robots are your friends
- #214: Robots are your friends
- #215: Robots are your friends
- #216: Robots are your friends
- #217: Robots are your friends
- #218: Robots are your friends
- #219: Robots are your friends
- #220: Robots are your friends
- #221: Robots are your friends
- #222: Robots are your friends
- #223: Robots are your friends
- #224: Robots are your friends
- #236: And the biggest resource of all is Drush.
- #237: And the biggest resource of all is Drush.
- #238: And the biggest resource of all is Drush.
- #239: And the biggest resource of all is Drush.