开发dedeCMS自定义模板不是一件容易的事,它需要同时具备以下几方面的条件,缺一不可:
(1)会一些Photoshop的基本操作,例如:切片、吸管工具等。
(2)熟练掌握html+CSS布局。
(3)熟悉dedeCMS模板的文件结构及其命名规则。
(4)熟练使用dedeCMS的标签。
之所以开发出像dedeCMS这样的二次开发系统,本意是希望开发者能够尽量做最少的修改就可以完成系统的开发。原则上,能够操作dedeCMS后台实现的功能,绝不改动模板,能够改动模板即可实现的功能,绝不动dedeCMS的php源代码。但是在某些特殊情况下,我们还是要修改php源代码。程序结构需要读者通过很多例子以及以后的开发去慢慢理解。所以本章将首先介绍dedeCMS的文件结构,然后讲解一些例子。
为什么要熟悉dedeCMS的模板文件结构呢?
因为dedeCMS的模板文件不是可以任意命名的。新模板的命名要跟默认模板default里面的模板命名一样,例如:首页只能叫index.htm,文章列表页只能叫list_arti cle.htm。所以要先了解dedeCMS的模板文件结构,知道哪个文件是什么页面。
下面进入templets/default,来看看dedeCMS的模板文件结构,如图 3.11 所示。
图 3.11 模板文件构成
下面讲解一下一些重要的模板,见表 3.1。
表 3.1
还有很多模板文件,由于篇幅限制不能一一讲解,如果想一一的了解模板文件,可以在如下路径中找到注释。
操作路径:【后台】->【模板】->【默认模板管理】,如图 3.12 所示。
图 3.12 模板管理
图 3.13 标签原理
新手对于dedeCMS的“标签”一定会感到很好奇,标签是什么?是HTML标签吗?dedeCMS标签不是HTML标签。如果读者在学习这一章之前学习过Smarty模板引擎,那就更好理解dedeCMS标签了。
综上所述,标签的作用就是用来代表数据库里面的数据,也就是调用数据。
标签语法:
(1)dedeCMS标签以“{”为定界符,具体的字段“[”为定界符。例如标签{dede:arclist}{/dede:arclist}。
(2)dedeCMS标签总是以这样的形式出现{dede:*},其中dede是每个标签都必须写的,“:”后面是标签的名字,例如arclist是一个标签的名字,另外还有很多标签,例如:adminname、ask、flink等等。
(3)dedeCMS标签有两种标签:无底层模板标签、有底层模板标签。
第一种:无底层模板标签
Dede系统无底层模板标签通用书写格式为:{dede:标签名 参数='值'/}
无底层标签不是成对出现的,整个标签一般具体代表某个值。例如:{dede:adminname/}代表“责任编辑”的名称。
第二种:有底层模板标签
Dede系统有底层模板标签通用书写格式为:
{dede:标签名 参数 1='值 1' 参数 2='值 2' ... 参数N='值N'}
底层模板样式
{/dede:标签名}
有底层模板标签一般是成对出现,并且这种标签一般是调用列表信息,一般是调用多条信息。比如:文章列表。而标签之间的“底层模板样式”可以写成html代码,或者是dedeCMS标签。下面我们以arclist标签作为例子来讲解有底层模板标签的用法:
标签名称:arclist
功能说明:文章列表调用标记
使用实例:
参数说明:(见表 3.2)
表 3.2
例 3.1: 在default/index.htm中我们可以找到下面的代码:
titlelen='60'表示新闻标题最大长度为 60 个字符,row='8'表示最多查询 8 条新闻。
补充说明:[field:* ]表示调用某个字段,[field:pubdate]代表该新闻发布的时间。[field:title]表示新闻标题,如图 3.14 所示。
图 3.14 aclist调用效果
由于篇幅的原因不可能一一介绍织梦系统里的标签,但是这里提供一个方法。
了解更多标签的方法:
操作路径:【后台】->【模板】->【默认模板管理】
在右侧的页面中找到一个模板文件,例如:index.htm,点击相应的“修改”链接,出现的界面如图 3.15 所示。
图 3.15 点击标签名—了解更多
页面的上半部分列出了该页面用到的所有标签。每一个按钮代表一个标签。任意点击一个按钮,便可以查看该标签的详细信息,如图 3.16 所示。
图 3.16 标签注解
用上述方法便可以学习织梦系统的标签。
开发技巧:
在开发过程中,其实可以不用写标签代码,因为网上有一个叫作标签生成器的软件。用这类软件可以自动生成标签代码,只需要复制这些代码,贴到相应的html里面就行了。下面以“老李dedecms仿站专用器”来讲解(下载安装过程省略),如图 3.17 所示。
图 3.17 老李标签生成器
如上图,在界面上点击,就会在“标签显示”处显示代码,然后“复制标签”,最后粘贴到html文件里相应的地方就可以了。
网上不一定能下载到如意的模板,特别是客户已经给出网页设计图,要照着设计图布局页面的时候,就需要自己制作模板了。在学习了以上的知识后,我们已经能够制作一个自己的dedeCMS模板了。下面以自定首页的制作讲解自定义模板的制作过程:
步骤一:设计网页图片。
制作网页的第一步是将网页的样子设计出来。这一步可以请设计师帮忙设计或者自己设计一张图片,如图 3.18 所示。
图 3.18 首页设计图
步骤二:用html+CSS将页面布局出来。
这个步骤需要读者具备扎实的网页制作功底。读者可以选择制作好的网页,再将html文件和css等文件拷贝至dedeCMS系统内部。也可以直接在dedeCMS内部新建文件进行页面开发。下面讲解直接在dedeCMS内开发页面的过程。
(1)在dedeCMS的templets文件夹下,新建一个文件夹,任意命名,例如命名为new_model。这个文件夹就是模板文件夹(如果读者不明白为什么新建这个文件夹,可以温习dedeCMS模板的安装过程,在此不再赘述)。
(2)在new_model下,新建三个文件夹:js、images、style。Js里存放所有需要的javascript脚本文件,images里存放图片,style里面存放样式文件。
(3)在new_model下新建三个文件:index.htm、head.htm、footer.htm。
提示
这里为什么开发一个首页需要新建三个模板文件呢?因为网页的头部和尾部是公用性文件,不仅首页需要有头部和尾部,其他页面也需要。所以将网页头部放在head.htm里面开发,尾部放在footer.htm里面开发。在index.htm里只需要用标签{dede:include fi lename="head.xhtml"/}即可引入网页头部,{dede:include fi lename="footer. htm"/}引入网页尾部;
步骤三:在html页面中写入dedeCMS标签调用数据库数据。
步骤二中开发好的网页只是一个静态的网页,不能显示数据库里面的数据。需要在静态的首页中写入标签,使页面成为“动态”的页面。读者可以直接进入【后台】->【模板】->【默认模板管理】,点击首页index.htm的“修改”,研究index.htm中用过的每一个标签。研究标签过后就可以轻易的在首页中正确的位置写入标签,显示动态数据了。