第一步，下载CKEditor 4.6.2
http://ckeditor.com/download
一般选择 Standard Package（标准插件包），如下图
第二步、下载完，解压，放到public目录下。
第三步、如果还没有配置config.php的 __PUBLIC__ 所在目录，那么打开做一个配置，(http://www.mysite.com/Public需要修改成你自己的所在目录)
// 视图输出字符串内容替换
'view_replace_str' => ['__PUBLIC__' => 'http://www.mysite.com/Public'],第四步、在页面导入CKEditor脚本：<script type="text/javascript" src="__PUBLIC__/ckeditor/ckeditor.js"></script>第五步、在页面需要的位置插入一个文本域，我们假定id是mycontent。<!--注意：提交的路径根据你自己的需要来改-->
<form class="form-inline" action="url{index.php/index/article/addarticle}" method="post">
<textarea id="mycontent" name="content">这是我们的CKEditor内容</textarea>
<input type="submit" value="提交文章">
</form><textarea>元素也可以改成<input>元素。<input id="mycontent" name="content" type="text" value="这是我们的CKEditor内容">页面效果如下：
第六步、用JS初始化CKEditor的编辑界面：
<script type="text/javascript">
CKEDITOR.replace( 'mycontent' ,{ //这里的 mycontent就是上面我们设置的textarea或者input元素的id
filebrowserBrowseUrl:'__PUBLIC__/ckfinder/ckfinder.html',//设置上传图片的页面为ckfinder.html
filebrowserImageBrowseUrl:'__PUBLIC__/ckfinder/ckfinder.html?type=Images',
filebrowserFlashBrowseUrl: '__PUBLIC__/ckfinder/ckfinder.html?type=Flash',
filebrowserUploadUrl: '__PUBLIC__/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
filebrowserImageUploadUrl: '__PUBLIC__/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images',
filebrowserFlashUploadUrl: '__PUBLIC__/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash',
width:900,//设置默认宽度为900px
height:300 //设置默认高度是300px，这个高度是不包含顶部菜单的高度
}
);
</script>第七步、在数据提交页面控制器后台代码如下：接收一下提交的文本内容。namespace app\index\controller;
use think\Request;
use think\Controller;
class Article extends Controller
{
public function addarticle(Request $request)
{
return $request->param('mycontent');//注意，这里content是标签的name属性，不是ID属性
}
}浏览表单页面，点击“提交文章”按钮，可以看到成功获取了CKEditor输入的内容了，如图：
其实CKEditor本身官方文档（请点击 http://docs.cksource.com/Main_Page）是非常完善的，不过是英文的，对于英文不是很好的同学，这里做一个非常简单基础的分享，给一个快速参考的线索。
如果有需要微信交流的伙伴，也可以加我微信：[phone]zhongsion[/phone]，和大家一起学习。
最佳答案
