| « | September 2025 | » | | 日 | 一 | 二 | 三 | 四 | 五 | 六 | | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | | | | | |
|
公告 |
| 本博客在此声明所有文章均为转摘，只做资料收集使用。并无其他商业用途。 |
| Blog信息 |
|
blog名称:
日志总数:210
评论数量:205
留言数量:-19
访问次数:920793
建立时间:2007年5月10日 |
| |
|
 [openCMS]管理和定制OpenCms 6 - 第6章 定制网站(2)
文章收藏, 网上资源, 软件技术, 电脑与网络
李小白 发表于 2007/12/8 22:13:15 |
|
6.4.3 jsp模版
模板提供相关页面的内容布局. 模板可包括jsp标签和脚本,也可以包含其他JSP文件. 在这一节,我们将建立一个简单的JSP模板. 在其后的章节中,我们将进一步扩展这个模板.
这里的例子是一个非常简单的JSP模板. 创建一个基本的HTML文件,并将已请求的资源文件插入到body中。
<%@ page session="false" %> <%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms" %> <!DOCTYPE html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title><cms:property name="Title" escapeHtml="true"/></title> </head> <body> <h1><cms:property name="Title" escapeHtml="true"/></h1> <cms:include element="text1"/> </body> </html>
头两行,包含基本的jsp标签定义,在所有模板中可能都需要这两行. 页面标签指示JSP引擎不会创建Session对象，可以加快页面访问速度。
正如我们前面看到的那样,在这一章, 该taglib标签告诉服务器,我们是采用opencms标签库(其uri是http://www.opencms.org/taglib/cms ) , 任何以CMS为前缀的元素都属于该标签库。
大多数模板是HTML格式. 只有以cms开头的标签由jsp引擎来编译. 其余的都直接返回到客户端. 在这个模版中,只有两个要素引用了opencms标签库.property标签引用了两次,一次是获取页面的标题，另一个是把该标题加入到页面h1中. 让我们看一看这个标签:
<cms:property name="Title" escapeHtml="true"/>
前缀cms标示从opencms标签库获取property信息. 在opencms标签库提供从请求页面获得标题的接口. (见第三章和第四章对property的讨论)。
property标签有三个属性：name，file和escapehtml . name表明要获得的属性为Title. 该属性值对大小写敏感，不可以写为title. .
属性escapehtml设置为true, 表示取得属性值后将其中的HTML标签过滤掉.例如,如果页面的标题为"Using the <pre/> tag" , 这将转为"Using the >pre/< tag" . 这将防止属性值被解释为html.
file属性允许你指定你要获取访问的页面名称,如果未被指定. 如果没有文件被指定,像上面的例子,默认为当前页面。
你可以在资源管理器，右键查看文件的属性值。
上面的例子用到的第二个jsp标签为：
<cms:include element="text1"/>
这个标签用来获得请求的内容,并将它们插入模板并返回到客户端. 该标签应用有些复杂。
VFS（虚拟文件系统）中的每一个文件都存储在特定的xml文件中. 这个XML文件可以包含不同的语言,并且可以包含不同的分支. 举例来说,有些文件可能嵌套几个"sub-documents". 这些"sub-documents"被称为元素. 默认情况下,这些元素的命名是按照一定标准,首先是text1 ,而后递增最后的数字,text2 , text3 ,等等.
默认情况下,当我们建立新的文件,只创造的第一项内容, text1 , 在这个模版上将显示请求文件的第一部分. include标签用来指定在设置窗口所要显示的属性值为" text1 " .
element属性是必须. 当使用opencms标签时,你必须指明特定的元素,否则, opencms再加载模版时将会出现NullPointerException的错误.
新模版建立并保存后，我们就可以测试了。
6.4.4 测试新模版
从资源浏览器下拉菜单选择/sites/default, 回顾第三章创建文件的方法，我们将在这个文件下利用新模版创建一个新文件。
从浏览器工具窗口选择新建按钮，选择建立页面. 下一步可以设置文件的名称和一些常用属性，包括使用哪个模版。500)this.width=500'>
新建的模版将会出现在模版下拉菜单里。
该模版是如何添加到模版下拉菜单？这是因为opencms将会搜索模版文件夹，并将template下的文件添加到列表，如果该文件具有标题，则会将标题显示在此。
当名称和模版设置好后，进入下一属性设置界面，设置完毕选择“完成”。
返回浏览器窗口，可以看到新建的文件，点击该文件的图标，选择编辑该页面并添加页面内容。保存文件并测试新模版，点击该文件会在浏览器里预览结果，如下图：500)this.width=500'>
下面是该文档的html源代码：
<!DOCTYPE html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Testing Example Template</title> </head> <body> <h1>Testing Example Template</h1> This is some example content. We are using it to test a new template. </body> </html>
两个属性标签已经被文档的标题所代替，include标签已被编辑好的页面内容所代替。
下面我们将对该模版进行一些改进。第一步，为该模版定义一个样式。
6.4.5 在模版中使用资源
前面我们已经为该模版新建了一个resources文件夹，该文件主要存储css样式、javascript脚本和图像文件，现在开始在该文件夹建立css样式表。
样式表是有纯文本组成，并有特定的格式，我们建立一个名为main.css的样式表，然后添加如下内容：
/* * Cascading Style Sheet for Example OpenCms Templates */ h1 { color: navy; } body { font-family: serif; }
这是一个最基础的样式表，它会改变hl元素内的内容颜色为天蓝色，并将body默认字体修改为serif。
下面我们将样式表插入模版：
<%@ page session="false" %> <%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms" %> <!DOCTYPE html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title><cms:property name="Title" escapeHtml="true"/></title> <link type="text/css" rel="stylesheet" href="<cms:link>/system/modules/tv.alephnull.modules.templates/resources/main.css</cms:link>"/> </head> <body> <h1><cms:property name="Title" escapeHtml="true"/></h1> <cms:include element="text1"/> </body> </html>
增加的唯一元素为link标签（href内的参数），此标签将虚拟文件路径转换为浏览器可识别的实际路径，在任何时候只要引用虚拟文件，就必须使用opencms连接标签（cms:link）,后面将会讲述如何使用该标签。
6.4.6 使文件可编辑
在opencms 6.2你可以设置模板允许登录和授权用户编辑文件, 这就是所谓的"直接编辑" . 当管理员登陆并查看页面时，他会看到编辑按钮，点击编辑，可直接进入内容编辑页面，而不需要经过opencms工作空间。
实现该功能. 你需要在模版中加入一行并修改一行语句，如下：
<%@ page session="false" %> <%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms" %> <!DOCTYPE html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title><cms:property name="Title" escapeHtml="true"/></title> <link type="text/css" rel="stylesheet" href="<cms:link>/system/modules/tv.alephnull.modules.templates/resources/main.css</cms:link>"/> <cms:editable/> </head> <body> <h1><cms:property name="Title" escapeHtml="true"/></h1> <cms:include element="text1" editable="true"/> </body> </html>
第一高亮显示的行位于头部,包含从opencms标签库取得的编辑标签. 此标签使opencms加载编辑所需的CSS和JavaScript文件.
第二个高亮显示的条目包含opencms编辑标签. 与前面唯一不同是将editable属性设为true,他告诉opencms允许该条内容可以在页面直接编辑。
现在打开测试文件，将会出现如下界面：500)this.width=500'>
点击右边的按钮，就会出现内容编辑器：500)this.width=500'>
禁用直接编辑功能,只需要将editable属性取出即可。
接下来，我们将看看如何将其他jsp页面的内容加载进模版。
6.4.7 外部元素
有时需要将模版的某一部分单独存放，这样可以降低模版的复杂性，也可以提高复用性，让该段代码可被不同的模版调用。
生成导航的代码会被经常使用,而且往往重复使用. 不幸的是,没有在JSP标签来做到这一点,那么我们就不得不借助一个脚本. 然后就可以将脚本放在自己的文件中，并可重复使用。
最好将这些文件存储在模块中的elements文件夹. 我们将创建一个名为navigation.jsp JSP的文件. 这个文件就是一个很短的脚本.
6.5 简短脚本
以下脚本用来从opencms获取导航信息并显示在页面，该功能不能通过jsp标签实现。
如果你不是一个Java程序员,你可以跳过这一段, 或者,你想在你自己的应用力使用该功能，在代码后面有些简短的解释，你可以看看。
该文件的内容如下：
<%@ page session="false"import="java.util.Iterator,java.util.List,org.opencms.jsp.CmsJspNavBuilder,org.opencms.jsp.CmsJspNavElement,org.opencms.jsp.CmsJspActionElement"%><%/** Provides basic site navigation.*/// Create the class from which we will get navigation.CmsJspActionElement cms =new CmsJspActionElement( pageContext, request, response );// Get navigation infoCmsJspNavBuilder navigation = cms.getNavigation();List navItems = navigation.getNavigationForFolder();Iterator i = navItems.iterator();// Loop through all of the items in the ArrayList and print the// menu.while( i.hasNext() ) {CmsJspNavElement navElement = ( CmsJspNavElement )i.next();String link = cms.link( navElement.getResourceName() );String title = navElement.getTitle();out.println("»<a href=\"" + link + "\">" + title + "</a><br/>");}%>
这段脚本看起来很复杂，实际上他用了好多opencms API的东西，其实是非常简单的。
我们分部分解释该段代码。标签页引入了所有用到的java类. 那些以org.opencms.opencms开头的就是java类。
<%@ page session="false" import="java.util.Iterator, java.util.List, org.opencms.jsp.CmsJspNavBuilder, org.opencms.jsp.CmsJspNavElement, org.opencms.jsp.CmsJspActionElement" %>
下一步是建一个名为cms的cmsjspactionelement对象，该对象实例将提供到opencms导航信息的接口。
CmsJspActionElement cms = new CmsJspActionElement( pageContext, request, response );
到该对象建立后，我们可以从中取得导航信息，下面的代码将完成该功能：
CmsJspNavBuilder navigation = cms.getNavigation(); List navItems = navigation.getNavigationForFolder(); Iterator i = navItems.iterator();
第一行是获得cmsjspnavbuilder对象，并提供导航所需的一切信息。我们用getnavigationforfolder方法来获得当前文件夹内的所用导航信息列表并将它存储在变量navitems里。一旦我们得到该列表，就可以使用一迭代对象来按顺序输出该列表。
下面我们将输出该列表，一次输出一个，并以超链接显示在页面。
while( i.hasNext() ) { CmsJspNavElement navElement = ( CmsJspNavElement )i.next(); String link = cms.link( navElement.getResourceName() ); String title = navElement.getTitle(); out.println("»<a href=\"" + link + "\">" + title + "</a><br/>"); }
他的执行步骤:
1. 获得导航元素，它存储了特定文件的详细信息（第二行）。
2. 创建一个到该文件的链接（第三行）。
3. 获得该文件的标题（第四行）。
4. 打印出指向这个文件的超链接( 第五行) . 各位不要被引号和反斜线搞混. 反斜线可以告诉程序那些引号需要输出到html.
我们需要做的就是这些,下一步就是将它应用到模版。 |
|
|