CKEditor安装

CKEditor，富文本编辑器
CKFinder，图片文件上传和管理系统

安装CKEditor

1. 下载CKEditor

http://ckeditor.com/download

2. 解压放在www目录下

/www/ckeditor/...

3. 修改config.js，设置里图片上传使用了CKFinder

CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';

config.language = 'zh-cn';
config.image_previewText = '外链图片请直接输入图片地址。';

//The base href URL used to resolve relative and absolute URLs in the editor content.
config.baseHref = 'http://localhost/';

config.filebrowserBrowseUrl = '/ckfinder';
config.filebrowserImageBrowseUrl = '/ckfinder?type=Images';
config.filebrowserFlashBrowseUrl ='/ckfinder?type=Flash';
config.filebrowserUploadUrl = '/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files';
config.filebrowserImageUploadUrl = '/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images';
config.filebrowserFlashUploadUrl = '/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash';
config.filebrowserWindowWidth ='1000';
config.filebrowserWindowHeight = '700';

};

4. 新增文件index.html来测试CKEditor

# vi /www/ckeditior/index.html

################################ HTML Begin #############################################

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>

<title>CKEditor Sample</title>
<script src="/ckeditor/ckeditor.js""></script>
</head>

<body>

<form>
标题: <input type="text" name="title"/><br/>
内容: <br/>
<textarea name="rich_text_editor" id="rich_text_editor" rows="10" cols="80">
This is my textarea to be replaced with CKEditor.
</textarea>
<script>
CKEDITOR.replace('rich_text_editor');
</script>
</form>

</body>
</html>

################################### HTML End ##########################################

5. 访问CKEditor来进行测试

http://localhost/ckeditor

安装CKFinder

1. 下载CKFinder

https://cksource.com/ckfinder

2. 解压放在www目录下

/www/ckfinder/...

3. 将ckfinder.php重命名为index.php

访问http://localhost/ckfinder就可以访问了CKFinder了

也可以不做这步，直接访问http://localhost/ckfinder/ckfinder.php

4. 修改config.php，设置为不需要验证登录

$config['authentication'] = function () {
return true;
};

5. 修改config.php，设置上传文件存储目录和访问路径

/*=================================== Backends ========================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_backends

$config['backends'][] = array(
'name' => 'default',
'adapter' => 'local',
'baseUrl' => '/userfiles/',
'root' => '/data/app/userfiles', // Can be used to explicitly set the CKFinder user files directory.
'chmodFiles' => 0777,
'chmodFolders' => 0755,
'filesystemEncoding' => 'UTF-8',
);

如果访问有问题，可能需要修改目录权限
如果访问有问题，可能需要关闭SELinux或者设置SELinux权限，见PHP安装部分

CKEditor安装相关推荐

发布文章管理系统开发中遇到的问题整理 Django + Ckeditor + Apache
这几天打完了黑魂3,感觉黑魂3我都能通关,还有什么能难倒我的? 所以作为网站开发菜鸡的我,准备挑战实现给网站增加动态发布文章的需求,有点类似博客管理,构建一个可以发布文章的后台,然后通过循环的方式将数 ...
CKedit在线编辑器
在线编辑器在实现所见即得的编辑效果. FCK 是开发者的名字的缩写 CKEditor 功能很完善的,具有,在线编辑与图片上传JS插件 UEdit ...
django-ckeditor表情包修改
一.版本 Django==1.11 django-ckeditor==5.2.2 二.关键步骤 1.删除旧的ckeditor静态文件所在目录:项目目录下的static文件夹下的ckditor文件夹 ...
CKEditor的安装与基本使用
http://blog.csdn.net/liananse/article/details/6320617 CKEditor的安装与基本使用(JSP) 文章分类:Web前端一.下载CKEditor ...
CKEditor代码高亮显示插件Code Snippet安装及使用方法
CKEditor网页编辑器 CKEditor 即 FCKEDITOR .FCKeditor是目前最优秀的可见即可得网页编辑器之一,它采用JavaScript编写.具备功能强大.配置容易.跨浏览器.支持 ...
CKEditor的安装与基本使用（JSP）
文章分类:Web前端一.下载CKEditor 1. 直接下载地址,当前最新版本为3.5: http://download.cksource.com/CKEditor/CKEditor/CKEdito ...
如何安装配置CKEditor 3.0
如何安装配置CKEditor 3.0 ,感觉比较简单,但本次没有涉及上传文件的配置,只是简单的配置使用. 下载CKEditor 3.0,地址:http://ckeditor.com/ 1. 下载下来 ...
php set medias,laravel5.1 -- Integrate FileManager and CKeditor into laravel
FileManager中文名叫文件管理器,也叫文件浏览器,它给我们提供了一个可视化的界面来管理文件和文件夹.利用FileManager,我们可以对文件进行浏览.增加.打印.修改(文件属性).重命名.搜 ...
Ueditor和CKeditor 两款编辑器的使用与配置
一丶ueditor 百度编辑器 1.官方文档,演示,下载地址:http://ueditor.baidu.com/website/index.html 2.百度编辑器的好:Editor是由百度web前端 ...

CKEditor安装

CKEditor安装相关推荐

最新文章

热门文章