这个编辑器的模板文件决定了它在后台的布局、样式和功能按钮的显示,下面我将从 文件位置、核心代码解析、自定义修改 三个方面为您详细说明。

核心文件位置
织梦后台的编辑器模板文件主要位于以下目录:
/dede/templets/
这个目录下存放了后台大部分页面的HTML模板,与文章编辑框相关的文件主要有两个:
article_edit.htm:这是 发布新文章 页面的主模板文件,它包含了文章标题、栏目选择、发布选项等所有表单元素,并且内嵌了编辑器的HTML和JavaScript初始化代码,我们通常所说的“编辑框模板”主要指的就是这个文件里的编辑器部分。article_edit_full.htm:这是 编辑已有文章 页面的模板文件,它的结构和article_edit.htm几乎完全一样,只是加载的数据是已存在的文章内容。
注意:从织梦DedeCMS 5.7版本开始,默认集成的是 KindEditor 编辑器,我们看到的编辑器相关代码主要是KindEditor的初始化脚本。

article_edit.htm 中的编辑器代码解析
打开 article_edit.htm 文件,您会找到一大段与编辑器相关的代码,它主要由HTML容器和JavaScript初始化脚本构成。
HTML容器 (编辑器的“画布”)
这部分代码定义了编辑器将被渲染到页面上的哪个位置,通常是一个 这段代码是核心,它负责加载KindEditor库,并将其附加到上面的 注意:织梦早期版本可能使用的是 了解了核心文件和代码结构后,我们就可以进行自定义修改了,常见的修改需求包括:调整编辑器大小、增减工具栏按钮、修改上传目录等。 这非常简单,直接修改HTML容器的 操作步骤: 保存文件,然后刷新后台发布文章页面,即可看到效果。 CKEditor的功能通过工具栏配置,我们可以通过修改初始化脚本来定制。 操作步骤: 示例: 默认情况下,上传的文件会存入 操作步骤: 更推荐的方法:通过织梦后台设置 织梦本身有上传设置,修改这里会影响整个系统的上传行为,是更标准、更安全的方式。 修改这些选项后,所有通过编辑器上传的文件都会遵循这些规则。 通过以上方法,您就可以灵活地自定义织梦后台的文章编辑框模板,使其更符合您的使用习惯和网站需求。textarea
<!-- 在 article_edit.htm 文件中查找类似这样的代码 -->
<textarea name='body' id='body' style='width:100%; height:400px;visibility:hidden;'></textarea>
name='body':这是表单提交时的字段名,非常重要,后台PHP代码通过 $_POST['body'] 来获取编辑器里的内容。id='body':这是JavaScript用来定位和初始化编辑器的唯一标识符。style='...':这里定义了编辑器显示区域的基本大小(宽度和高度)。visibility:hidden; 表示在编辑器初始化完成前,这个文本框是隐藏的,避免出现闪烁。JavaScript初始化脚本 (编辑器的“灵魂”)
textarea 容器上,最终渲染出我们看到的富文本编辑界面。<!-- 通常在 article_edit.htm 文件的底部,在 <body> 标签结束前 -->
<script type="text/javascript">
CKEDITOR.replace('body', {
// 在这里配置编辑器的各种参数
// 工具栏、语言、上传配置等
});
</script>
KindEditor,其初始化方式为 KindEditor.create('#body'),新版本(如DedeCMS V5.7 SP2之后)为了更好的兼容性和功能,默认切换到了更现代的 CKEditor 4,所以您看到的很可能是 CKEditor 的初始化代码。
如何自定义修改编辑器模板
调整编辑器的高度或宽度
style 属性即可。
/dede/templets/article_edit.htm 文件。<textarea name='body' id='body' ...> 这一行。style 中的 height 值,从 height:400px; 改为 height:500px;。<!-- 修改前 -->
<textarea name='body' id='body' style='width:100%; height:400px;visibility:hidden;'></textarea>
<!-- 修改后 -->
<textarea name='body' id='body' style='width:100%; height:500px;visibility:hidden;'></textarea>
增减工具栏按钮 (以CKEditor为例)
/dede/templets/article_edit.htm 文件。CKEDITOR.replace('body', { ... }); 的脚本块。toolbar 属性。
<script type="text/javascript">
CKEDITOR.replace('body', {
// 自定义工具栏
toolbar: [
{ name: 'basicstyles', items: ['Bold', 'Italic', 'Underline', 'Strike', 'RemoveFormat'] },
{ name: 'paragraph', items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote'] },
{ name: 'links', items: ['Link', 'Unlink', 'Anchor'] },
{ name: 'insert', items: ['Image', 'Table', 'Smiley'] },
{ name: 'tools', items: ['Maximize', 'Source'] }
],
// 语言设置
language: 'zh-cn'
});
</script>
Bold, Italic, Underline, StrikeFont, FontSizeTextColor, BGColorJustifyLeft, JustifyCenter, JustifyRight, NumberedList, BulletedListImage, Table, Link, Unlink, Smiley, SpecialChar, HorizontalRuleSource (源码), Maximize (最大化), About修改图片/附件上传目录
/uploads/ 目录,我们可以通过修改配置来改变它。
/dede/templets/article_edit.htm 文件。CKEDITOR.replace 的配置对象中,添加 filebrowserUploadUrl 和 filebrowserImageUploadUrl 等配置。<script type="text/javascript">
CKEDITOR.replace('body', {
// ... 其他配置 ...
// 配置图片上传的处理脚本
filebrowserImageUploadUrl: '/dede/fileupload.php?dtype=image', // 这是织梦默认的图片上传处理地址
// 如果你想修改上传到的目录,通常需要修改 'fileupload.php' 这个文件,
// 但更推荐的方式是通过织梦后台的系统设置来修改,而不是直接编辑这个JS。
// 如果想直接在JS里指定上传路径(不推荐,因为会绕过织梦的安全检查),
// 需要修改上传处理脚本,这比较复杂,建议直接使用织梦默认的上传功能。
});
</script>
./uploads/ (这是根目录)./uploads/ (文件存放在此)./uploads/ (音视频等)./uploads/
需求
修改位置
操作方法
调整编辑器大小
/dede/templets/article_edit.htm修改
<textarea> 标签的 style 属性中的 width 和 height。
增减工具栏按钮
/dede/templets/article_edit.htm修改
CKEDITOR.replace('body', {...}) 配置中的 toolbar 数组。
修改上传目录
首选:后台“系统基本参数” -> “附件设置”
在后台界面中修改“上传目录”等选项,这是最安全、最标准的方式。
修改上传目录
备选:
/dede/templets/article_edit.htm修改
filebrowserUploadUrl 等配置,但通常需要配合修改上传处理脚本,不推荐。
