Joomla文档中文翻译 - 怎样创建基本的Joomla模板 III - VII II X - Joomla控，Drupal粉 - 开源CMS建站新闻杂谈、文档教程、案例介绍、扩展相关、个人博客及收藏

Joomla文档中文翻译 - 怎样创建基本的Joomla模板 III

Joomla文档中文翻译 - 模板相关 Sunday, 10 January 2010 10:49

joomla_documentation_168 在昨天的文档中，我们学习了怎样为Joomla模板创建基本的templateDetails.xml文件；今天，我们来看看怎样创建一个基本的index.php文件。

index.php文件是Joomla用来组织输出所有页面最核心的文件。通常，我们可以根据自己的内容布局需求创建一个基本的PHP页面。下面我们来看一个代码实例；首先来看看页面头部的代码：

<?php defined( '_JEXEC' ) or die( 'Restricted access' );?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" 
   xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >

第一行的代码会出现在几乎所有的Joomla模板文件中，它的作用是防止用户在浏览器中输入该文件路径而查看到页面代码。第二行开始是常规的文档类型声明；第三行是XHTML的命名空间以及页面语言种类的声明。

接下来看index.php的<head>部分：

<head>
  <jdoc:include type="head" />
  <link rel="stylesheet" href="/<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
  <link rel="stylesheet" href="/<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
  <link rel="stylesheet" href="/<?php echo $this->baseurl ?>/templates/<?php echo $this->template?>/css/style.css" type="text/css" />
</head>

第一行代码通过jdoc调用Joomla输出的头部内容，包括页面的title，meta信息，JavaScript文件链接等。另外三行代码用来调用Joomla的两个系统CSS(system.css和general.css)以及当前模板所使用的CSS文件(style.css)。

接着我们来看页面内容的主体<body>部分：

<body>
  <jdoc:include type="modules" name="top" /> 
  <jdoc:include type="component" />
  <jdoc:include type="modules" name="bottom" />
</body>

这三行代码分别调用了Joomla所输出的两个模块(top和bottom)以及主要内容组件(component)；我们可以将主菜单(main menu或top menu放在top模块位，将页脚内容及菜单放在bottom模块位。关于模块位，可以参考“Joomla文档中文翻译 - 什么是模块位(module positions)”。

最后，关闭<html>标签：

</html>

这样，一个简单基本的index.php文件就生成了；完整的代码如下：

<?php defined( '_JEXEC' ) or die( 'Restricted access' );?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" 
   xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
  <jdoc:include type="head" />
  <link rel="stylesheet" href="/<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
  <link rel="stylesheet" href="/<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
  <link rel="stylesheet" href="/<?php echo $this->baseurl ?>/templates/mynewtemplate/css/style.css" type="text/css" />
</head>
<body>
  <jdoc:include type="modules" name="top" /> 
  <jdoc:include type="component" />
  <jdoc:include type="modules" name="bottom" />
</body>
</html>