跳转到主要内容
iSunya 提交于 19 August 2011

习惯了使用所见即所得(Wysiwyg)编辑器, Drupal7 安装 CKEditor 编辑器的方法及配置:

  1. 首先要下载模块和编辑器 CKEditor Moudle: http://drupal.org/project/ckeditor IMCE Module: http://drupal.org/project/imce CKEditor 编辑器: http://ckeditor.com/download
  2. 安装 CKEditor MoudleIMCE Moudle 将解压的 CKEditor Moudle 和 IMCE Moudle 模块分别放到 sites/all/moudles/ckeditor/ sites/all/moudles/imce/ 然后将 CKEditor 编辑器压缩包里面的放到 /sites/all/moudles/ckeditor/ckeditor/中, 如下图 CKEditor 放好后的路径如: /sites/all/moudles/ckeditor/ckeditor/ckeditor.config.js /sites/all/moudles/ckeditor/ckeditor/ckeditor_php5.php /sites/all/moudles/ckeditor/ckeditor/ckeditor_php4.php /sites/all/moudles/ckeditor/ckeditor/ckeditor/plugins/* /sites/all/moudles/ckeditor/ckeditor/ckeditor/_samples/* /sites/all/moudles/ckeditor/ckeditor/ckeditor/_source/* /sites/all/modules/imce/css/* ...
  3. 在 Modules 中启用 CKEditor 和 ICME 这两个模块.
  4. Home » Administration » Configuration » Content authoring 中配置CKEditor ( 路径为 /admin/config/content/ckeditor) 选择 Full HTMLedit Operations 进入 CKEditor 配置. ( 路径为 /admin/config/content/ckeditor/edit/Full ) 然后点击 EDITOR APPEARANCE 选项进去, 在显示的表单中有个Toolbar, 这个是配置CKEditor显示哪些操作标签的. 在默认的这行 ['Image','Media','Flash','Table','HorizontalRule','Smiley','SpecialChar'], 中添加一个 ‘IMCE‘ 这样才能在编辑器里显示 IMCE上传图片的图标. 添加后为: ['Image','IMCE','Media','Flash','Table','HorizontalRule','Smiley','SpecialChar'], 接着在 Plugins 中选中 IMCE Window button in toolbar Toolbar CKEditor

    最后在 File browser settings 中的 File browser type (Link dialog) File browser type (Image dialog) File browser type (Flash dialog) 三个选项都选择IMCE, 如下图 File browser settings

  5. OK, 配置完毕, 在 add Content 时选择 FULL HTML就行了. 另外也可以配置 Filtered HTML, 在 Toolbar配置里面设置一下, 比如我的设置如下
    1 2 3 4 5 6 7 [ ['Source'], ['Cut','Copy','Paste','PasteText','Undo','Redo'], ['Bold','Italic','Underline','Strike','-'], ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'], ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'], ]

    显示在 Filtered HTML 的效果为: Filtered HTML

转自《Drupal7 安装 CKEditor 和 IMCE 模块 及配置