Как сделать шаблон темы для Drupal
1. Две колонки
Шаблон темы Друпала — это один обязательный файл page.tpl.php который включает переменные заключённые в HTML-теги. Это «схематический» пример, если вы совсем не представляете с чего начать.
Берём голый HTML:
<html>
<head></head>
<body></body>
</html>
Добавляем вывод названия названия документа и названия сайта в заголовке окна браузера:
<html>
<head>
<title> <?php print $head_title ?> </title>
</head>
<body></body>
</html>
Добавляем вызов мета-тегов, стилей и JS:
<html>
<head>
<title> <?php print $head_title ?> </title>
<?php print $head ?> <?php print $styles ?> <?php print $scripts ?>
</head>
<body>
</body>
</html>
Добавляем вывод логотипа и названия сайта в слой shapka:
<html>
<head>
<title> <?php print $head_title ?> </title>
<?php print $head ?> <?php print $styles ?> <?php print $scripts ?>
</head>
<body>
<div id=»shapka»> <?php print $logo ?> <?php print $site_name ?> </div>
</body>
</html>
Добавляем левую колонку в слой menu:
<html>
<head>
<title> <?php print $head_title ?> </title>
<?php print $head ?> <?php print $styles ?> <?php print $scripts ?>
</head>
<body>
<div id=»shapka»> <?php print $logo ?> <?php print $site_name ?> </div>
<div id=»menu»> <?php print $sidebar_left ?> </div>
</body>
</html>
Добавляем вывод названия документа, вкладок и его содержания в слой content:
<html>
<head>
<title> <?php print $head_title ?> </title>
<?php print $head ?> <?php print $styles ?> <?php print $scripts ?>
</head>
<body>
<div id=»shapka»> <?php print $logo ?> <?php print $site_name ?> </div>
<div id=»menu»> <?php print $sidebar_left ?> </div>
<div id=»content»> <?php print $title ?> <?php print $tabs ?> <?php print $content ?> </div>
</body>
</html>
Добавляем слой podval:
<html>
<head>
<title> <?php print $head_title ?> </title>
<?php print $head ?> <?php print $styles ?> <?php print $scripts ?>
</head>
<body>
<div id=»shapka»> <?php print $logo ?> <?php print $site_name ?> </div>
<div id=»menu»> <?php print $sidebar_left ?> </div>
<div id=»content»> <?php print $title ?> <?php print $tabs ?> <?php print $content ?> </div>
<div id=»podval»> <?php print $footer_message ?> </div>
</body>
</html>
И наконец говорим Друпалу, что шаблон закрыт:
<html>
<head>
<title> <?php print $head_title ?> </title>
<?php print $head ?> <?php print $styles ?> <?php print $scripts ?>
</head>
<body>
<div id=»shapka»> <?php print $logo ?> <?php print $site_name ?> </div>
<div id=»menu»> <?php print $sidebar_left ?> </div>
<div id=»content»> <?php print $title ?> <?php print $tabs ?> <?php print $content ?> </div>
<div id=»podval»> <?php print $footer_message ?> </div>
<?php print $closure ?>
</body>
</html>
Вот и всё — простой двухколоночный шаблон с шапкой и подвалом готов. Осталось указать DOCTYPE, язык документа и приступить к оформлению через CSS. Дальнейшее усложнение шаблонов будет строиться только через использование большего количества переменных и конструкций вроде:
<?php if ($help): print $help; endif; ?>
Единственное что вам нужно будет знать для создания своих шаблонов — это переменные. Список переменных page.tpl.php, правила использования шаблонов и стандартный шаблон темы Garland можно посмотреть по этой ссылке: page.tpl.php.
2. Три колонки с резиновым центром
…если информация не выводится в одну или обе боковые колонки, то их место занимает центральная колонка. Ниже, почти гирляндовский подход.
template.php
function phptemplate_body_class($sidebar_left, $sidebar_right) {
if ($sidebar_left != » && $sidebar_right != ») {$class = ‘sidebars’;}
else {
if ($sidebar_left != ») {$class = ‘sidebar-left’;}
if ($sidebar_right != ») {$class = ‘sidebar-right’;}
}
if (isset($class)) {
print ‘ class=»‘. $class .'»‘;}
}
?>
page.tpl.php
<!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Strict//EN»
«http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd»>
<html>
<head>
<title>…</title>
<style>…</style>
</head>
<body>
<div id=»header»>
<div id=»primary-links»>…</div>
<div id=»logo_name»>…</div>
<div id=»secondary-links»>…</div>
</div>
<div id=»container»>
<div id=»column-left»>
<div class=»searchbox»>…</div>
</div>
<div id=»column-center»>
<div id=»squeeze»>…</div>
</div>
<div id=»column-right»>
<div class=»searchbox»>…</div>
</div>
</div>
<div id=»footer»>…</div>
</body>
</html>
style.css
#container #column-left {float:left;width:250px;position:relative;z-index:2;}
#container #column-center {float:left;width:100%;position:relative;z-index:1;}
#container #column-right {float:left;width:250px;position:relative;z-index:2;}
body.sidebar-left #column-center {margin-left:-250px;}
body.sidebar-right #column-center {margin-right:-250px;}
body.sidebars #column-center {margin:0px -250px;}
body.sidebar-left #squeeze {margin-left:250px;}
body.sidebar-right #squeeze {margin-right:250px;}
body.sidebars #squeeze {margin:0px 250px;}
#footer {float:none;clear:both;text-align:center;}
Всё, что осталось сделать в этом примере, расставить переменные в page.tpl.php.
Популярные CMS - для новичка 