《TinyMCE 4.0.11 Upload File Demo》 - 文档说明

运行环境

需求说明

在web实际开发中,网站后台管理肯定少不了一种内容编辑器支持。

以前php开发是用ckeditor+fckeditor,但问题是在python语言下不支持,只能寻找其他编辑器。

TinyMCE以前的版本都很简陋的不考虑,可是搜索发现他的4.0.11版本兼容改进那么多,ui也不错,就决定用它,进一步使用发现,它对插入图片这一块没有完善,官方是用了一个要收费的moxiemanager插件。无语·····

于是决定自己动手,折腾了出一个基于bottle框架的upload file 扩展

三、应用目录设计

基于bottle框架,搭建的web开发目录,其各目录用途介绍:

根目录
app.wsgi:apache2.2 WSGIScriptAlias指向的文件
static文件夹:静态文件,如css,js,images等
Fly文件夹:个人开发框架标识,核心目录
  • WebApp.py: fly 框架入口,协调各个模块,并可独立运行框架
  • config/settings.py: 全局配置文件
  • module文件夹: 模块化设计,如uploads,前台Export
  • theme文件夹: web各个模块的模板文件,和module里面的模块一一对应

TinyMCE Upload File Demo 预览

TinyMCE Upload File Demo 1
TinyMCE Upload File Demo 2
TinyMCE Upload File Demo 3
TinyMCE Upload File Demo 4

开发总结

关键就是tinymce 的init配置file_browser_callback,然后tinyMCE.activeEditor.windowManager.open弹出一个对话框进行交互。

窗口之间的交互问题,和旧版不同,新版是top.tinymce.activeEditor.windowManager.getParams().argsname和关闭窗口top.tinymce.activeEditor.windowManager.close()

参考推荐