WIXOO

Digest

理解Joomla!模板

作者:JoomlaGate 发布时间 10/11/06 来源 JoomlaGate

所有的站点模板(用来改变你网站的外观,就是前台模板)都可以在模板目录找到。例如,如果你的模板名叫"mytemplate",那么它必定在文件夹 "path-to-Joomla!/templates/mytemplate"。

所有的管理员模板 (用来改变站点管理员单元的外观,就是后台模板)能在目录administrator/templates下找到。例如,如果你的管理员模板名叫 "myadmintemplate",它必然放在文件夹 "path-to-Joomla!/administrator/templates/myadmintemplate"。

 

典型模板目录结构

多数模板至少有四个文件:

  • index.php
提供模块和组件的显示和位置逻辑。
  • template.css
处理模板的显示方面,包括边缘,字体,图像边框,列表格式等。
  • templateDetails.xml
容纳模板的元信息并用于安装和模板管理。
  • template_thumbnail.ext - 把 .ext 用图像格式扩展替代 (.jpg, .png, .gif)
在模板管理中,当光标停留在模板名字上时通常会显示一个 200x150 像素的图像。这给站点管理员应用模板前提供一个快照视图。


典型的Joomla! 1.5模板包括下列目录:

  • css - 包含所有的 .css 文件
  • html - 包含核心输出与模组的模板覆写文件
  • images - 包含模板使用的所有图像

 

文件 templateDetails.xml file 容纳各种 模板管理 用于安装和维护的元数据。它有助于识别文件的不同单元。典型地,数据的每个单元缩进以使得文件更可读,但是缩进不是必须的。

基本细节

模板管理一开始显示的是可用模板列表和它们的基本细节。细节都来自于文件templateDetails.xml。

 

 

 

    <install version="1.5" type="template">
    <name>rhuk_milkyway</name>
    <creationDate>11/20/06</creationDate>
    <author>Andy Miller</author>
    <authorEmail>rhuk@rockettheme.com.com</authorEmail>
    <authorUrl>http://www.rockettheme.com</authorUrl>
    <copyright></copyright>
    <license>GNU/GPL</license>
    <version>1.0.2</version>
    <description>TPL_RHUK_MILKYWAY</description>

文件结构

所有和模板有关的文件都要列出。每个文件名包含从模板根开始的完整的路径信息。 管理员安装依照过该信息在安装过程中存储文件。

下面是rhuk_milkyway模板内列出的一小部分文件。 

    <files>
        <filename>index.php</filename>
        <filename>templateDetails.xml</filename>
        <filename>template_thumbnail.png</filename>
        <filename>params.ini</filename>
        <filename>images/arrow.png</filename>
        <filename>images/indent1.png</filename>
    </files>
 

 

语言

某些模板可能包括用以翻译模板静态文本的语言文件。下面就显示了两个语言文件。第一个是给用户查看的的转换文本的语言文件,标签内的第二个文件则是针对管理员的。

 <languages>
        <language tag="en-GB">en-GB.tpl_beez.ini</language>
    </languages>
    <administration>
        <languages folder="admin">
            <language tag="en-GB">en-GB.tpl_beez.ini</language>
        </languages>
    </administration>            
 

模块位置

模板可用的 模块位置 须定义。

 <positions>
        <position>breadcrumb</position>
        <position>left</position>
        <position>right</position>
        <position>top</position>
        <position>user1</position>
        <position>user2</position>
        <position>user3</position>
        <position>user4</position>
        <position>footer</position>
        <position>debug</position>
        <position>syndicate</position>
</positions>  
 

 

参数

模板也许会在模板管理中为管理员提供有关模板显示的选项。例如,模板 rhuk_milkyway就允许管理员改变边框颜色、背景色,并定义显示宽度。

 

 

下例显示添加参数和它的值。

    <params>
        <param name="colorVariation" type="list" default="white" label="Color Variation" description="Color variation to use">
            <option value="blue">Blue</option>
            <option value="red">Red</option>
            <option value="green">Green</option>
            <option value="orange">Orange</option>
            <option value="black">Black</option>
            <option value="white">White</option>
        </param>
    </params>
 

需要更多有关参数的信息,参见:

Defining a parameter in templateDetails.xml
Retrieving parameter data in a template file

 

    文件 index.php 是网站的骨架。 Joomla! 提交的每个页面都是由"index.php" 组合来自数据库的内容选择。

    模板的index.php文件是代码的混合,既有提交时不会变化的代码,也有在提交前会改变的php代码。 设计过简单html网页的人该很熟悉这些代码:主要是2个部分 -  <head> 和 <body>。index.php不同的是使用 php 代码来从数据库插入信息。

这里有个示例:

传统HTML头部:

<head>
<title>My Example Webpage</title>
<meta name="title" content="example" />
<link rel="stylesheet" href="www.example.com/css/css.css" type="text/css" />
</head>

Joomla! 的方式基本一致:

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

因而,除了在index.php文件内定义了头部,当中也嵌合了一些针对数据库的php 代码。该方法巧妙在这些脚本会给用户提交相同的代码。如果你查看joomla站点的代码,所有的<?php blah />将被常规html代码所替代。

良好的模板设计

Index.php应当尽量精简,因为每次载入新页面时它都将重复传送。 诸如样式等元素应当由存储在用户缓冲的css文件提交。本教程会讲解创建你的index.php文件的技术。

为何是index.php?

站点的主页历史上是Index.htm。因此当用户导航至 www.example.org, 网站服务器会提交 www.example.org/index.htm。因为 Joomla! 是PHP编写的, index.php 就是自动伺服文件。更进一步,当用户导航至joomla 网站,根目录的index.php 会重定向至当前默认模板的index.php。