《通元内容管理GPowerCMS6.0模板制作指南》由会员分享，可在线阅读，更多相关《通元内容管理GPowerCMS6.0模板制作指南（25页珍藏版）》请在金锄头文库上搜索。
1、1. Gpower CMS 模板制作指南1.1.概述网站的表现形式为多个 html 页面，包括栏目的页面、栏目下文章的页面。这些页面的来源是企业的介绍、新闻、活动、产品、宣传的资料等不同的信息，即内容。如何将企业的内容转化为丰富多彩的 html 页面，这就是由模板实现的。1.2.模板制作步骤模板制作过程，是在企业网站的定位、内容确定之后，并已设计好栏目之后，开始进行模板制作，其步骤为：1、 网页设计人员，根据企业网站的定位、结构、公司的 CI 等，进行首页栏目、二级栏目的页面设计，这只是网站搭建的第一步；2、 页面设计完后，由企业对网页设计的效果、风格进行评估，提出修改意见；3、 上述第 1、
2、2 步骤反复，最后确定下网页设计；4、 确定好企业网页的风格和效果之后，由模板制作工程师，根据网页设计的 html 页面和网站栏目，进行模板的制作；5、 录入内容，发布生成 html 页面，并根据需要进行部分调整、完善。1.3.模板分类模板一共分为三类：1、 索引模板索引模板即为每个栏目首页的模板，即点击哪一栏目，出现的那个页面。每个栏目可以根据不同需要创建不同的索引模板，但大多数栏目为了体现整体风格的统一，同级栏目基本使用同一个索引模板。特殊情况下可以独立创建索引模板。2、 文章模板文章模板即为栏目下文章的模板，又称为记录模板，即最后文章的显示页面。3、 包含模板包含模板为被索引、文章模板所
3、引用的模板。如网站的页面头、页面左边、页面下边等通用的，每个栏目基本一样，就可拆分为包含模板，如下图所示。通过包含模板，可最大利用模板的可重用性，也使得网站改版非常方便。1.4.模板置标在模板制作过程中，最重要是掌握模板的置标。模板标记符的功能是否完善，是设计好模板的一个重要步骤，也决定了内容管理系统的功能。Gpower CMS 模板置标的功能非常强大，可实现任意风格的页面显示，是国内同类产品功能最先进，技术最领先的模板引擎。如下是一个简单的模板文件的例子：模板示例 $curArticle.name (*当前文章的标题)$curArticle.content (*当前文章的内容)下面来详细介绍
4、如何实现页面的各种表现形式：1、 栏目列表：用于各种模板，主要是针对企业内容列出栏目的名称。是各个 html 页面相互切换的主要桥梁，利用这个置标之后，用户可以根据企业的内容需要，随时添加、更改和删除栏目；#foreach($channel in $cms.getChildren($curChannel.ID)$channel.title#end标题内容其中：$curChannel.ID 指当前栏目的地址$channel.title 指栏目的名称2、 文章列表：主要用于索引模板，主要列出文章题目或相关信息。点击其中一条，可以直接进入相应的文章记录页面；#foreach($article in
5、$cms.getContents($curChannel, 10)$article.name($cms.format($content.publishDate)#end其中：$curChannel 代表当前栏目10 代表取当前栏目下的前 10 条新闻$article.name 指文章的标题$cms.format($content.publishDate) 格式化显示日期 取指定栏目的文章列表：例如列出公司新闻栏目下的十篇文章列表，可以这样表示：#foreach($article in $cms.getContents(“公司新闻”, 10)$article.name#end 取当前栏目下的头条
6、新闻列表：取当前栏目下头条新闻中的 10 条头条新闻题目：#foreach($article in $cms.getContents($curChannel.name, “头条新闻”, 10)$article.name#end 取指定栏目下的头条新闻列表：取首页中头条新闻中的 10 条头条新闻题目：#foreach($article in $cms.getContents(“首页”, “头条新闻”, 10)$article.name#end 显示更多列表：如图所示，公司新闻中包括四条新闻题目，点击更多，可以看其他新闻内容，那么“更多”则由以下置标来完成：更多*其中$curChannel 指当前
7、的栏目名“更多”可以替换成相应的图片，如上图的 3、 栏目路径：用于各种模板，主要体现当前栏目的所在位置；#foreach($channel in $cms.getPathChannels($curChannel)$channel.title»#end4、 文章内容：主要用于记录模板，列出文章题目或内容等相关信息；$curArticle.name$curArticle.content*仅用于记录模板5、 相关新闻：用于记录模板，是与文章内容相关的文章列表；#foreach($article in $cms.getRelatesByKeyword($curArticle, 0, 5)
8、 $content.name($cms.format($content.publishDate)#end其中：在录入关键词中，多个关键词按空格隔开0表示范围在本栏目 1表示在整个站点5表示条数6、 相关附件：用于记录模板，是与文章内容相关的内容，以表格、图片等表现；#foreach($doc in $cms.getAttachments($curArticle)$doc.srcFile#end7、包含静态模板：用于各种模板，指模板的内容中，没有 Gpower CMS 的置标符，仅为 html 代码。如网站页面的底部：#include(“foot.vm”)8、 包含动态模板：用于各种模板，指模板
9、的内容中，有 Gpower CMS 的置标符，仅为html 代码。如页面左边的子栏目列表，每个一级栏目下的子栏目列表都不相同。#parse(“foot.vm”)内容实体说明：名称 说明$article 新闻对象$article.name 标题$article.source 来源$article.summary 摘要$article.keyword 关键词 $artcile.grade 级别$article.content 正文1.5.模板制作实例下面我们延庆水资源局网站为例，来共同了解一下网站的模板是如何生成的。1.5.1. 静态 html首先已经存在美工设计好的 html 页面，我们如何把他
10、们转化成模板呢？针对延庆水资源局页面，建立好栏目之后，我们需要建立三个模板，首页索引模板、二级栏目（如新闻快讯、综合频道、热点话题和大话论坛）的栏目索引模板、文章模板。（首页页面）（二级页面）（三级页面）（文章页面）在新建模板之前，我们必须把设计好的静态页面中包含的图片和样式表，放入我们站点设置的，图片本地存放路径下面。1.5.2. 索引模板制作过程点击站点管理中的模板管理，进入模板管理界面。我们按照事先建好的栏目进行相应的模板制作（ 新建栏目请参考 5.1.1） 。模板信息包含以下几项： 名称：首页，如果是二级栏目索引就在名称中填写“二级栏目索引” ，模板名称没有特定的要求，只是为了方便用户
11、在栏目管理中进行选择，最好用比较好区分的名称。如：首页模板的名称为首页； 文件名：文件名为 home.vm，其中 home 是用户个人设定的，可以是任意的英文字符，不能是其他的非法字符，但系统规定，在任意的英文字符后必须加.vm 后缀； 类型：又三种选择类型，索引、文章和记录，在新建的首页模板里，在名称中添加模板名称首页，因为是首页模板，它属于索引模板，因此我们在类型中选择索引。 模板头：把已有的静态的 html 页面用 UltraEdit、记事本等（其他可以显示静态 html 的源代码的编辑器）打开，会出现我们我们之前看到页面的源代码，如下图：或者把 index.html 文件用 Ultra
12、Edit 打开，或在 IE 中打开此静态的页面，选择右键查看源文件，会得到 sample.html 的源代码。如图所示：我们把从开始到第一个上面的这一段代码全部放到模板头里面，其中要注意在模板头里面要改成，即把原来的相对路径改成绝对路径。这样模板头新建完成。为了防止数据丢失，可以先点击一下确定在进行模板的内容添加。内容：如上图，为首页的 html 代码，我们已经说过，第一个上的代码为模板头，那么它下面的代码为模板的内容，把从第一个（不包括 ）到结束，为模板的内容，把它拷贝到模板的内容里。其中，在内容中也是与模板头一样，把所有图片的相对路径也改成绝对路径。改成，因为页面中图片的地址都是相对路径，
13、用户可以进行批量替换，替换完毕后，点击确定。这样一个首页模板的框架基本完成，但是模板的功能还没有实现，这样我们可以通过高级编辑器来完成，系统提供模板所见即所得的编辑功能，使用户能实现所见即所得效果。1.5.2.1. 可视化的编辑环境打开首页模板，点击选用高级编辑器，进入高级编辑器的界面：第一个上的代码为模板头强大的高级编辑器，提供给用户一个可视化的模板编辑环境，不懂 html 的人也可以自己独立完成模板的制作，模板基于浏览器的所见即所得的编辑方式，用户可以在模板编辑中完成。选用高级编辑器简单以表格的形式介绍一下每个工具的用途：模板置标 全选 剪切 复制 粘贴删除选择 清除样式 重做 撤销 清楚
14、 word 标记删除线 下标 上标 左对齐 居中对齐右对齐 项目列表 数目列表 文本缩进 文本左缩进文本颜色 背景颜色 水平条 超连接 上传图片插入 flash Html 代码 插入表格 显示 0 边框 插入行( 上)插入行( 下) 删除行 拆分为两行 插入列( 左) 插入列( 右)删除列 前插单元格 后插单元格 删除单元格 拆分为两列合并单元格 查找替换1.5.2.2. 方便快捷的模板置标向导我们已经新建了首页模板，并且基本的框架已经搭建起来了，下面我们就充分利用高级编辑器，将系统的功能完善起来。我们自上而下，分别来完成模板置标：首先页头的一部分，即如下图，这里需要分析一下，我们所要建的三个
15、模板的页头是一样的，我们利用这一特点，可以将页头作成一个包含模板，包含到几个模板之中，如下图，为页头的静态 html 页面：选择模板置标向导图标 ，即进行模板置标的选择，分析一下整个页头，我们选择模板置标中的“子频道列表” ，因为页头上是网站首页的子频道列表。就可以把相应的置标符加到频道列表的相应位置，操作过程如下图：选择栏目时选择当前栏目，显示风格一共有表格形式、列表形式和换行形式三种，我们选择列表形式，点击确定之后在模板中的相应位置就会自动出现置标，而无需手写置标。点击确定保存模板之后，新建包含模板成功。这个模板就可以包含在其他的索引模板和文章模板之中了。包含形式有#include(“he
16、ader.vm”)和#parse(“header.vm”)。其中 header.vm 是页头包含模板的文件名。第二步，我们进行栏目路径的置标，它对应如下页面中红框里面的内容：红框里面的内容是对应模板置标里面的栏目路径，是指从根栏目向子栏目递进的路径，选择模板置标中的栏目路径，添加到页面的相应位置，如图所示：红框中就会相应的加入如下图的置标：如果模板管理中添加了宏定义模板，即global.vm，则栏目路径只须置标为#channelNav()，文章路径只须置标为#articleNav()。下面我们主要完成各个文章列表的模板置标，即确定哪个栏目的文章列表，以“最新公告”这个栏目为例，我们在模板上显示这个栏目的文章列表。点击 模板置标向导，会弹出模板置标向导的网页对话框，选择文章列表，点击下一步，会出现如下图所示界面：因为我们设置的是在“最新公告”
