由于django后台管理没有富文本编辑器,看着好丑,展示出来的页面不美观,无法做到所见即所得的编辑方式,所以我们需要引入第三方富文本编辑器。
之前找了好多文档已经博客才把这个功能做出来,有些博客虽然写的很好,但是毕竟不是自己写的好多地方要么不够全面,要么看不懂,整理了一些大神的
博客,所以这次自己实现就决定写这篇博客记录下,以后如果有需求就不用到处找资料了,同时也分享给大家看看,提供借鉴。这次我使用的是kindeditor 富
文本编辑器。之所以选择这个编辑器主要看是它功能齐全还美观。下面这张图是kindeditor的样子,没错功能就是这么多,外观就是这么好看。
好了开始我们的django 使用kindeditor之路。
在应用中使用
第一步:
到官网下载 kindeditor
下载好后删除这些没有的文件asp,asp.net,jsp,php.在django中这些都没用。
第二步:将删除后的文件引入自己的项目中。根目录下的static/js/editor/
第三步,将kindeditor 的js文件引入到要做富文本编辑器的网页中,
<script src="/static/js/editor/kindeditor/kindeditor-all-min.js"></script> <script src="/static/js/editor/kindeditor/lang/zh-CN.js"></script> <script src="/static/js/editor/kindeditor/themes/default/default.css"></script> <script> KindEditor.ready(function (k) { window.editor = k.create('#editor_id',{ resizeType:1, allowPreviewEmoticons : false, allowImageRemote : false, {#处理url#} uploadJson : '/upload/kindeditor', }); }) </script>