菜鸟日记（yzy）：opencMS系统-XML内容管理文件开发

  个人认为，openCms系统最强大的功能就是在线编辑功能，也就是模板开发，只要开发团队已经实现好模板布局和位置

布局，那么，即使是完全不懂代码的维护人员，只要赋予编辑权限，也可以轻松的更改网站的文字，图片，甚至是模板的位置

和布局。实现的原理简单来说是将文字，图片，链接等资源放入到XML文件中，因此通过，更改XML文件便可及时改变网站内容。

----------------------------------------------------------------------------------------------------------------------------------

 一  设置内容元素的布局和操作流程如图所示

     

二 实现步骤

步骤一 首先打开模块功能，并在相应模块中添加资源文件，如图所示(注意标签的首字母要大写)

通过创建资源文件，openCms在模块的schemas目录自动生成具有Title，Text，images元素的XSD文件，并在

opencms-modules.xml文件中进行的XSD文件的配置工作，无需开发人员进行复杂的编辑和配置工作。其中标签和框架类

名称可相同，标志XML内容的根元素。XSD文件存放在schemas文件目录中，生成文件如图所示:

步骤二 创建内容元素

打开浏览功能，可以找到你之前创建的站点目录，在根目录中标志位网站地图内容文件夹的目录.content,此文件夹专门用

来存放xml文件，建立新建文件，可以在内容文件中看到开发人员之前创建的XSD文件，如图所示：

之前创建的目录文件名称为ResourceDemo, 然后编辑xml文件，如图所示，内容包括创建XSD文件时的代码中包括的Title，

Text，Image，link等内容。到此，XML资源文件的创建工作已经结束。如果想要用到自己创建的XML文件，在站点目录打开

页面容器，显示要使用xml文件的网站，在编辑功能中点击新建文件，出现之前创建的xml文件。

将xml文件拖入页面，点击右上角的圆标，可进行模块的编辑，替换和拖动工作。

步骤三：更改模板的布局格式

打开formatters文件目录，会有两个和创建的内容元素命名相关的JSP文件和XML文件，如：ResourceDemo-formatter.jsp

和ResourceDemo-formatter-config.xml文件。而与之相关的内容元素布局便是通过JSP文件ResourceDemo-formatter.jsp

来实现布局。代码如下

<%@page buffer="none" session="false" trimDirectiveWhitespaces="true"%>
<%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<cms:formatter var="content">
<div style="width:260px;height:230px;text-align:center;margin:auto;margin-top:10px">
<c:if test="${content.value.Image.exists}">
<cms:img src="${content.value.Image}" scaleColor="transparent" width="80" scaleType="0" noDim="true" cssclass="img-responsive" />
</c:if>

<p style="font-size:15px;font-weight:800;">${content.value.Title}</p>
<div style="width:260px;height:45px;text-align:center;margin:auto;color:#999999">
<p style="font-size:12px">${content.value.Text}</p>
</div>
<c:if test="${content.value.Link.exists}">
<input type="button" style="width:100px;height:30px;border-radius:8px" value="查看详情" οnclick="window.location.href='..${content.value.Link}'"/>
</c:if>
</div>
</cms:formatter>

end