文章详情

  • 游戏榜单
  • 软件榜单
关闭导航
热搜榜
热门下载
热门标签
php爱好者> php文档>Joomla 1.5 模板的功能特点与基本设计思路

Joomla 1.5 模板的功能特点与基本设计思路

时间:2009-04-01  来源:manbuzhe0301

Joomla1.5 的模板引擎比起Joomla 1.X时代有相当大的进步,在Joomla1.5中允许设计者为模板定制可选参数,这些参数对应不同的选项,例如修改模板背景颜色、字号大小、宽度… 。用户可以在管理后台的模板管理里修改,参数值保存在模板根目录下的“params.ini”文件里。

重写代码功能也非常不错,这个新的功能提高了Joomla 模板的可访问性,他允许设计者重写Joomla核心组件与模块的HTML代码,在以前Joomla的组件与模块应用了大量的表格,做为一个现代网站,网页布局中已经很少使用表格了,我们通过这个重写代码的功能,可以去掉所有Joomla组件与模块中的表格。

Joomla1.5在默认安装下,里面有一个叫“Beez”的模板,他是重写代码的完美案例,如果想使用重写代码功能,可以参考这个模板。在模板的根目录下,所有重写的组件、模块的代码都放在“html”文件夹里,Joomla在加载模板时会查看这个文件夹,如果里面有组件与模块的HTML代码,那么Joomla会使用这个文件夹里的代码代替原组件与模块的HTML代码。


模板可用参数示例 下面的文字介绍了设计制作Joomla 1.5模板的基本思路。

制作一个空白的Joomla 1.5 模板:

name/index.php
name/templateDetails.xml

这两个文件是必须的,并且文件名也必须与上面的例子相同,因为这两个文件是被joomla核心直接调用的,所以不能错。

templateDetails.xml,这个文件里的内容是告诉joomla使用这个模板时会被调用的其它所有文件,包括CSS,JS,图像文件等等。这里要注意,D是大写的,同时它还包括,作者名称,版权等信息。

Index.php,这个文件是模板的核心文件,用它来告诉joomla,我们如何放置组件与模块。它是php与(X)HTML的组合。

在大部分的模块里还包括下面这些文件:
name/template_thumbnail.png,这个文件是模板的预览图,方便在后台进行选择模板使用。
name/css/template.css,样式表,这里包含模板使用的所有样式,字体大小,颜色等等。
name/images/logo.png,任何的图像文件一般都会放在images目录下。

templateDetails文件内容示例:
templateDetails.xml,这个文件里必须包含所有模板使用到的文件,同时它还包含所有者的名称与版权,有些还会显示在网站管理后台,它的内容看起来像下面这样。

  1. <install version="1.5" type="template">  
  2.   <name>template name</name>  
  3.   <creationdate>2008.02.08</creationdate>  
  4.   <author>lyw0301</author>  
  5.   <copyright>GPL</copyright>  
  6.   <authoremail>[email protected] </authoremail>  
  7.   <authorurl>www.plili.com </authorurl>  
  8.   <version>1.0</version>  
  9.   <description>模板的描述信息</description>  
  10.   <files>  
  11.     <filename>index.php</filename>  
  12.     <filename>templateDetails.xml</filename>  
  13.     <filename>js/script.js</filename>  
  14.     <filename>images/header.gif</filename>  
  15.     <filename>images/logo.gif</filename>  
  16.     <filename>css/customize.css</filename>  
  17.     <filename>css/layout.css</filename>  
  18.     <filename>css/template.css</filename>  
  19.   </files>  
  20.   <positions>  
  21.     <position>user1</position>  
  22.     <position>top</position>  
  23.     <position>left</position>  
  24.     <position>banner</position>  
  25.     <position>right</position>  
  26.     <position>footer</position>  
  27.   </positions>  
  28.   <params>  
  29.     </params></install>  

 

templateDetails文件内容解释:

<install version="1.5" type="template">. 这行信息告诉后台安装安装器,我们要安装的内容是模板,版本是1.5
<name></name>. 定义模板的名称,这个名称同时还用做模板所在目录的名称,所以不能是中文或任何特殊字符
<creationDate></creationDate>. 模板建立的日期
<author></author>.模板的所有人
<copyright></copyright>.模板的版权信息
<authorEmail></authorEmail>. 模板制作人的email地址
<authorUrl></authorUrl>. 模板所有人的网站
<version>1.0</version>. 这个模板的版本号
<files> 所有模板用到的文件
<filename>index.php</filename>
</files>
<positions></positions>.模板用到的模块位置名称
<params></params>.定义模板使用的参数,可以在网站后台对模板进行控制,比如可以更改网站的字体颜色,网页宽度,等等

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="templates/<?php echo $this->template ?>/css/template.css" type="text/css" />
</head>

index.php文件内容解释:

<jdoc:include type="head" />,在默认安装的情况下,这行代码调入下面的内容:
<title>Welcome to the Frontpage</title>
<meta name="description" content="Joomla! - the dynamic portal engine and
content management system" />
<meta name="generator" content="Joomla! 1.5 - Open Source Content Management" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<meta name="keywords" content="joomla, Joomla" />
<link href="index.php?option=com_content&view=frontpage&format=feed&Itemid=1&type=rss" rel="alternate" type="application/rss+xml" title="RSS 2.0" />
<link href="index.php?option=com_content&view=frontpage&format=feed&Itemid=1&type=atom" rel="alternate" type="application/atom+xml" title="Atom1.0" />

模板主体代码:

<body>
<?php echo $mainframe->getCfg('sitename');?><br />
<jdoc:include type="module" name="breadcrumbs" />
<jdoc:include type="modules" name="top" />
<jdoc:include type="modules" name="left" />
<jdoc:include type="component" />
<jdoc:include type="modules" name="right" />
</body>

Joomla模块内容调入命令解释:

<jdoc:include type="" name="">这是Joomla模板的调入命令,例如:“<jdoc:include type="module" name="breadcrumbs" />”这条命令调入显示Joomla的“面包屑”模块,type="module"调入类型为“模块”,注意是“module”而不是 “modules”。“<jdoc:include type="modules" name="top" />”,这条命令调入显示模块位置“top”,需要注意的是,我们在这里使用的模块位置名称(name="")一定要包含在 “templateDetails.xml”文件中。“<jdoc:include type="component" />”这条调入命令会显示Joomla的主体内容。

结论:制作一个空白的Joomla模板很容易,完成一个复杂的设计就没那么简单,你需要考虑很多问题,比如用户使用的浏览器,隐藏模块位置,可用性等等。在自己着手设计前可以先参考别人的作品,有很多代码你直接就可以使用,本文提到的调入命令,文件头的信息,XML文件的结构等这些信息直接复制粘贴就可以使用了,不需要自己亲手编写。

排行榜 更多 +
辰域智控app

辰域智控app

系统工具 下载
网医联盟app

网医联盟app

运动健身 下载
汇丰汇选App

汇丰汇选App

金融理财 下载