`
空xiao白
  • 浏览: 5122 次
最近访客 更多访客>>
社区版块
存档分类
最新评论

FCKEDITOR中文配置手册----内容模版配置 (三)

阅读更多
Templates 模板
译者附注:本章所讲的模板 在fck 完整的示例中 即_samples/default.html 文件中的编辑器的工具条 第一行的第六个按钮,如果不在这个位置,可以在附近根据气泡提示找找,在dedecms中把这个按钮也去掉了,因为不是很常用,这个模板按钮点开后,有个类似于对话框的东东,里面列举了一些模板,这些都是已经编辑好的html 代码,点击其中一个,就可以在编辑器中显示出来。

Templates Configuration 模板的配置
With FCKeditor, the end user can select a template from a list by clicking in the "Templates" icon in the toolbar. A template is a piece of HTML that is placed inside the editor, in this way the user doesn't need to start writing it from scratch, but a designer can prepare well designed templates, avoiding user errors before they happen.使用FCKeditor ,终端用户可以通过点击工具条上的"模板" 图标按钮 选择一个列举的模板。一个模板就是一段预先定义好的 可以直接写入编辑器的 html 代码。这样通过设计好的模板,用户就不用自己设计文章的排版了,很方便快捷。

The editor comes with three sample templates that are used just to show the way it works. It is quite easy to configure and customize it to use your templates. You just need to edit the "fcktemplates.xml" file. Even better, you can create a separated template file (XML file) outside the editor's directory and just configure the editor to use it. 在编辑器中默认设置了三个示例模板,这几个模板只是用来显示他们是如何工作的。你可以很轻松的配置和定义你自己的模板。在FCKeditor的安装目录下有个默认的模板文件 "fcktemplates.xml"  。你可以修改该文件来创建自己的模板,或者,你可以在编辑器安装目录外新建一个模板文件(xml 文件),然后在配置文件中指定你的模板文件的路径即可。

Pointing the editor to your Templates Definitions file 指定你自定义的模板文件的位置
Lets assume you have created a custom Templates Definitions file named "mytemplates.xml" and have placed it in the document root of your web site. Now, just set the following configuration in the fckconfig.js file or in your own Configuration File:  假设你已经创建了一个名为 "mytemplates.xml"的模板文件,并且将它放置到了你网站的根目录下。现在,你只需在fckconfig.js配置文件中或你自己的配置文件中设置如下的配置选项:

FCKConfig.TemplatesXmlPath = '/mytemplates.xml' ;The Templates Definitions XML file     xml 模板文件的定义
This is a sample XML that defines two simple templates:  下面是个XML示例,其中定义了两个简单的模板:

<?xml version="1.0" encoding="utf-8" ?>
<Templates imagesBasePath="/images/templates/">
  <Template title="My Template 1" image="template1.gif">
    <Description>Description of my template 1.</Description>
    <Html>
      <![CDATA[
        <b>Template 1 HTML</b>
      ]]>
    </Html>
  </Template>
  <Template title="My Template 2">
    <Html>
      <![CDATA[
        <b>Template 2 HTML</b>
      ]]>
    </Html>
  </Template>
</Templates>

All you have here is a root <Templates> element with many <Template> elements inside it.   在这个模板文件中,其实就是一个 <Templates> 根节点 ,在该根节点中又包含了 许多的 <Template> 节点。

Let's analyze each element:  让我们分析下其中的每个节点元素

      ●  <Templates>: it is the root element of our XML document. It has the following attributes: <Templates>:这是XML文档的根节点,他有下面的属性:

          ●  imagesBasePath: (optional) sets the base path used to build the full path of the preview images. If not set, it means that each template defines the full path of the image, or no images will be used for preview.
imagesBasePath: (可选)此属性设置要在模板列表对话框中用于演示的图片的基路径(该路径加上后面设置的图片名就可以得到图片的完整路径了)。如果没有设置,意味着后面的每个模板节点的图片属性都要给出完整的路径。或者是模板不需要显示演示图片。(如果你对"演示图片"的概念不是很清楚,你可以点击 编辑器工具条上的 "模板"按钮,在弹出的对话框中,可以看到定义的模板,其中在每个模板的左侧一般都有个演示图片,这个图片就可以直观的告诉用户该模板是怎样的排版。)

     ●  <Template>: defines a single template. It has the following attributes: <Template>: 定义一个模板。他有如下的两个属性:

         ● title: (optional) defines the title to show in the templates list. If not set, a default template name will be built using the word "Template" followed by the ordinal position of the template in the list (ex: "Template 5"). Of course, "Template 5" doesn't make much sense and could confuse the user, so it is recommended to set an intuitive name for new templates. title: (可选)用于定义在弹出的模板列表对话框中,该模板对应的标题。如果没有设置,那么就会采用默认标题"Template" 再加上该模板在列表中的位置(例如:"Template 5")。当然,"Template 5"之类的模板名字没什么意义,可能还会让用户感到困惑,所以最好还是自己设置一个直观的标题。

        ● image: (optional) defines the name of the image file to show as the preview of the template. It will be concatenated with the "imagesBasePath" attribute value of the root "Templates" element (if set). If the image attribute is not set, no preview will be shown. There is no fixed size for the image file.  image: (可选)用于定义模板列表对话框中该模板 对应的演示图片 的名称或路径。如果前面的<Templates>节点设置了imagesBasePath属性,那么这里的image属性就只需定义图片名,编辑器会用这个图片名加上imagesBasePath指定的基路径,从而得到该图片的完整路径,否则就要在image属性里定义完整的路径。

       ● <Description>:(optional) defines the textual description of the template. This description is shown in the templates list. No attributes are available for it and is enclosed contents are used as its value. It must be placed inside a <Template> element.  <Description>(可选)用于定义模板的描述性文本内容。在模板列表对话框中 每个模板除了左边的演示图片,以及右上方的粗体显示的模板标题外,在标题的下方的内容就是对模板的描述信息。该标签没有属性,并且必须位于<Template> 标签中。

      ● <Html>: defines the HTML to be set in the editor when the user selects a template. No attributes are available for it and its enclosed contents are used as its value, but we have to create a well formed XML file, so the HTML must be placed inside a CDATA section; in this way the HTML tags are not parsed as XML elements of our template file. A CDATA section starts with "<![CDATA[" and ends with "]]>".  <Html>:用于定义该模板要在编辑器中设置的HTML代码。该标签没有属性,所有的HTML代码都必须包含在 <![CDATA[ 和 ]]> 之间,这样,HTML代码里的标签才不会破坏XML文档里的标签。

To be sure you have produced a valid template file, just open it with Internet Explorer. It will be shown correctly if the XML is well formed and valid, otherwise IE will point out the errors.  在完成XML 模板文件后,如果要验证该XML文档是否有效,可以使用IE浏览器打开它,如果该XML文件格式正确有效,那么浏览器就会正确显示出来,否则IE 就会指出其中的错误。

分享到:
评论

相关推荐

    FckEditor中文配置手册详细说明

    FCKEditor 中文配置手册详细说明 FCKEditor 是一个功能强大且广泛使用的富文本编辑器,它提供了多种功能,如格式化文本、插入图片、插入链接、表格操作等。下面是 FCKEditor 中文配置手册详细说明。 一、下载和...

    fckeditor2.6.4+fckeditor-java-2.4.1配置及中文乱码解决

    包括fckeditor2.6.4+fckeditor-java-2.4.1配置所需资源包及fckeditor-java-2.4.1源码和配置说明文档。 配置中解决了中文乱码,并为上传文件自动创建日期文件夹。

    fckeditor2.3-2.6-java

    在Java开发中,FCKeditor作为一个强大的文本编辑组件,可以帮助开发者在后台系统中创建内容编辑界面,支持各种格式的文本、图片、链接等富媒体内容的编辑。FCKeditor的Java版本通常通过一个名为"Fckeditor-java"的...

    fckeditor-java-2.6-bin

    2. **API使用**:通过Java API,开发者可以在网页中嵌入FCKeditor,设置编辑器的配置,如宽度、高度、初始内容等。 3. **服务器端处理**:FCKeditor与服务器端交互,处理文件上传和保存编辑内容。对于Java应用,这...

    fckeditor-java-2.4.1-src.zip_FCKeditor jsp_fckeditor-java_fcked

    而"fckeditor-java-2.4.1"可能包含了编译后的Java类库文件、示例程序、配置文件等,供开发者直接引用和学习。 在实际应用中,使用FCKeditor-java-2.4.1,开发者需要按照官方文档或提供的示例进行配置,包括设置编辑...

    fckeditor-java-2.4.1-bin

    9. **配置和定制**:FCKeditor支持自定义配置,允许开发者调整编辑器的外观和功能,如改变工具栏布局,添加自定义插件等。 10. **部署与集成**:将FCKeditor整合到Java Web项目中,可能涉及Web.xml配置、JSP页面...

    FckEditor 中文配置手册

    FckEditor 中文配置手册,对于fckeditor不是很熟悉的朋友可以看下。快速的掌握这个应用比较广泛的网页在线编辑器。

    fckeditor-java-demo-2.5.war资源下载

    fckeditor2.5资源关于fckeditor-java-demo-2.5.war下载

    FCKeditor的相关资源fckeditor-java-2.6-bin,fckeditor-java-2.6-src,fckeditor-2.6.6

    FCKeditor是一款经典的开源富文本编辑器,广泛应用于Web应用中,允许用户在网页上进行类似于桌面文字处理软件的文本编辑。在这个压缩包中,包含了FCKeditor与Java相关的资源,便于开发者集成到Java Web项目中。以下...

    FCKeditor_2.6.5.zip,fckeditor-java-demo-2.5.war

    FCKeditor_2.6.5.zip是该编辑器的一个特定版本,版本号为2.6.5,通常包含了编辑器的所有源代码、资源文件以及必要的配置文件。这个版本可能修复了一些已知的错误,增加了新功能,或者对性能进行了优化。 FCKeditor...

    fckeditor-java-2.6-src

    要将FCKeditor集成到Java应用中,你需要了解如何在Servlet或JSP中嵌入编辑器,配置相应的路径,处理上传的文件,以及在服务器端接收和返回编辑内容。这通常涉及设置JavaScript变量,配置URL映射,以及处理HTTP请求...

    fckeditor-java-demo-2.4.1.war

    FCKeditor是一个流行的开源富文本编辑器,它允许用户在网页上创建和编辑内容,类似于Microsoft Word的功能。这个war文件是Java Web应用程序的标准打包格式,可以直接部署在支持Servlet容器(如Tomcat)上运行。 该...

    FCKeditor_2.6.6.zip+fckeditor-java-2.4.1.rar

    FCKeditor_2.6.6.zip+fckeditor-java-2.4.1.rar+fckeditor-java-2.4.1-bin.zip+fckeditor-java-2.4-src.zip+fckeditor-java-demo-2.4.war.zip 分享几个包,让你学习有成。加油

    FCKEditor2.6.3-----asp.net版

    - **说明.txt**: 配置和使用FCKEditor的指南,详细解释了如何在项目中集成和配置FCKEditor。 - **FCKeditor**: 这是一个目录,包含FCKEditor的所有前端资源,如JavaScript文件、CSS样式表、图片和其他必要的静态...

    FCKEditor2.6和fckeditor-java2.4的使用.doc

    #### 三、集成FCKEditor **步骤1:在JSP页面中使用** 1. **引入JavaScript文件**: - 在JSP页面底部引入FCKEditor的JavaScript文件。 ```html ${ctx}/FCKeditor/fckeditor.js"&gt; ``` 2. **初始化FCKEditor**:...

    FckEditor中文配置手册详细说明.doc

    FckEditor中文配置手册详细说明.doc

Global site tag (gtag.js) - Google Analytics