Drupal7 安装 CKEditor 和 IMCE 模块 及配置

转载 2012年03月22日 14:54:02

习惯了使用所见即所得(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


http://www.sinzi.org/drupal7-ckeditor-imce-moudles/


Drupal7下 CKEditor + IMCE 安装和配置图文教程

CKEditor介绍: CKEditor是新一代的FCKeditor,是一个重新开发的版本。CKEditor是全球最优秀的网页在线文字编辑器之一,因其惊人的性能与可扩展性而广泛的被运用于各大网站...
  • wxl0610
  • wxl0610
  • 2014年10月24日 10:32
  • 446

Drupal 7 模块开发 建立

为Drupal 7建立一个简单的模块
  • stevenhzhang
  • stevenhzhang
  • 2014年09月29日 05:08
  • 1427

Django CKEditor 安装与配置手札

说明本文是我在搭建网站(Django)的时候,需要用到一个富文本编辑器,综合调研了一下,决定使用CKEditor。 首先说明下我的环境,依然是Ubuntu + Python 3.4 + Django...
  • MebiuW
  • MebiuW
  • 2016年08月12日 16:56
  • 2893

drupal7自带body编辑+IMCE实现图片上传

※drupal版本 7.26 1.下载drupal7对应的IMCE模块。(下载地址:https://www.drupal.org/project/imce) 2.安装IMCE模块 如下图:201501...
  • chenjintaoxp
  • chenjintaoxp
  • 2015年01月20日 21:18
  • 1162

CKEditor 安装及使用

CKEditor即大名鼎鼎的FCKeditor,它终于在最近发布新版本了,与增加版本号不同,这次完全把它改名了,更名为CKeditor。这应该是和它的开发公司CKSource(波兰华沙的公司)的名字有...
  • wang544831183
  • wang544831183
  • 2017年08月09日 15:42
  • 604

CKEditor 4的初始化配置与开启上传功能(JAVA EE)

在JAVA工程项目中配置CKEditor4,同时开启其上传功能,包括图片的上传,超链接的中文件上传(主要用于正文中的附件下载),flash上传。同时不用与CKfinder集成,简单快捷,复用性强。 配...
  • lyy396
  • lyy396
  • 2016年01月13日 12:03
  • 2567

ckeditor 工具栏配置

toolbar的配置,有两个Full和Basic,默认是Full,可以通过上面的config.toobar="Basic";设置成简单模式。插件本身这两种模式的定义如下 注意工具按钮是分组的,一...
  • zh_fn
  • zh_fn
  • 2014年03月18日 12:26
  • 3634

ckeditor详细配置与使用说明

一、使用方法: 1、在页面中引入ckeditor核心文件ckeditor.js  cript" src="ckeditor/ckeditor.js"> 2、在使用编辑器的地方插入HT...
  • Gavid0124
  • Gavid0124
  • 2016年08月02日 11:00
  • 6827

Drupal 7 模块开发 创建自定义表(table) (hook_schema)

Drupal 7 模块开发,创建自定义表。hook_schema 详细说明,通用数据类型分析。
  • stevenhzhang
  • stevenhzhang
  • 2014年10月02日 08:12
  • 2015

CKEditor全部配置参数

凡是文件名或文件夹名前面有”_”的文件或文件夹都可以删除,这些文件是一些说明文件或者实例文件。另外,./lang文件夹中,只保留:zh_cn.js文件即可,这个文件夹是程序的语言包,因为其它语言大家用...
  • virus2014
  • virus2014
  • 2016年05月17日 11:41
  • 10818
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Drupal7 安装 CKEditor 和 IMCE 模块 及配置
举报原因:
原因补充:

(最多只允许输入30个字)