Drupal文档教程翻译 - 编外 - 怎样打造Drupal主题(1)

logo-drupal-documentation本站原创编译,转载请给面子,尊重劳动果实,欢迎交流指正。

各位早,继续Drupal文档中文翻译。昨天的文档中,我们了解了怎样打造静态首页一类的高自定义化页面模板,今天来看另外一篇编外,How to Make a Drupal Theme,怎样打造Drupal主题;这篇相对综合,其中很多知识点我们都在之前的官方文档翻译中有做了解。

直接进入话题。打开当前Drupal站点中的“/themes”路径我们使用其中的“/bluemarine”默认主题作为本文的范例。首先我们需要将bluemarine文件夹整体复制并粘贴到“/sites/all/themes/”路径中。

打开复制过来的bluemarine文件夹,可以看到如下文件:

blumarine-drupal-theme

来看下该主题的文件结构;详细说明也可参见“Drupal文档教程翻译 - 模板主题文件概览(1)”:

  • bluemarine.info - 包含了整个主题的元数据(meta data)、样式表(CSS)、脚本(JavaScript)、区块位置定义等信息。
  • page.tpl.php - 默认的页面主模板文件,定义了多数页面的绝大部分输出。
  • style.css - 该主题的主样式表。
  • node.tpl.php - 默认的节点模板文件,定义了包含在page.tpl.php框架中的具体节点的输出。
  • block.tpl.php - 默认的区块模板文件。
  • comment.tpl.php - 默认的评论部分的模板文件。
  • logo.png - 默认logo文件。
  • screenshot.png - 主题截图,会呈现在后台主题管理中的主题列表里面。
  • box.tpl.php - 默认的盒容器模板文件,为页面元素提供盒容器;详情可以参见http://drupal.org/node/11814
  • style-rtl.css - 默认的用来设定从右到左语言输出样式的CSS文件。

page.tpl.php

这两个文件对于主题是很重要的。前者混搭着HTML与PHP代码;下面的代码从page.tpl.php的head部分提取,我们可以在任何新打造的主题中使用相同的代码来调用样式表和脚本等文件:

<head>
<title><?php print $head_title ?></title>
<?php print $head ?>
<?php print $styles ?>
<?php print $scripts ?>
<script type="text/javascript"><?php /* Needed to avoid Flash of Unstyle Content in IE */ ?> </script>
</head>

下面的代码也是从bluemarine的page.tpl.php中提取出来,用来判断并输出主导航、次级导航及slogan;这些元素的显示状态都可以在后台主题管理中设置,详情可以参见“Drupal文档教程翻译 - 在管理后台启用页面元素设置”。bluemarine大部分输出由table布局,这里我们只做范例演示,更好的方式是使用Garland主题那样的非table布局输出来打造自己的主题。

<table border="0" cellpadding="0" cellspacing="0" id="header">
<tr>
<td id="logo">
<?php if ($logo) { ?><a href="/<?php print $base_path ?>" title="<?php print t('Home') ?>">
<img src="/<?php print $logo ?>" alt="<?php print t('Home') ?>" /></a><?php } ?>
<?php if ($site_name) { ?>
<h1 class='site-name'><a href="/<?php print $base_path ?>"
title="<?php print t('Home') ?>"><?php print $site_name ?></a></h1><?php } ?>
<?php if ($site_slogan) { ?><div class='site-slogan'><?php print $site_slogan ?></div><?php } ?>
</td>
<td id="menu">
<?php if (isset($secondary_links)) { ?>
<div id="secondary"><?php print theme('links', $secondary_links) ?></div><?php } ?>
<?php if (isset($primary_links)) { ?>
<div id="primary"><?php print theme('links', $primary_links) ?></div><?php } ?>
<?php print $search_box ?>
</td>
</tr>
<tr>
<td colspan="2"><div><?php print $header ?></div></td>
</tr>
</table>

其他模板文件

其他默认模板文件包括block.tpl.php、box.tpl.php、comment.tpl.php和node.tpl.php,每一个都负责特定部分的页面元素输出;下面的代码来自comment.tpl.php,我们可以看到它的作用很明显,判断用户是否拥有头像,如果有则显示;输出评论标题;判断当前评论条目是否为新近添加,是则添加“new”表示;依次输出提交日期等信息、评论内容及“回复”、“编辑”等链接。

<div class="comment<?php if ($comment->status == COMMENT_NOT_PUBLISHED) print ' comment-unpublished'; ?>">
<?php if ($picture) {
print $picture;
} ?>
<h3 class="title"><?php print $title; ?></h3>
<?php if ($new != '') { ?><span class="new"><?php print $new; ?></span><?php } ?>
<div class="submitted"><?php print $submitted; ?></div>
<div class="content"><?php print $content; ?></div>
<div class="links">&raquo; <?php print $links; ?></div>
</div>

今天就到这里,明天继续 =)

译者:Viiiix7210

如需转载,请注明官方英文文 档及本人译文的出处,谢谢。查看英文原文: How to Make a Drupal Theme


收藏与分享

添加评论


Security code
换一张图