月度归档:2017年02月

运营用加强 Markdown 编辑器

运营用加强 Markdown 编辑器

初衷

我一个朋友需要参与公司针对 V2ex 的运营,而 V2ex 如果想要发富文本,就需要 markdown 语法,对于他一个长期担任运营岗的人来说,Markdown让他十分困扰。虽然有很多不错的编辑器,但是由于他会有一些特殊的需求,所以还是十分不舒服。因此我便打算帮他做一个运营用的插件,帮他完成他所需要的特殊功能

特性

  • 满足运营者常用功能需求(H1-H6)
  • 提供插入新窗口打开连接的功能
  • 提供插入含连接的图片的功能
  • 插入含描述的图片
  • 选中文字标红
  • 快速打开图床

Demo

http://co.ixiqin.com

功能说明

插入新窗口打开连接

可以在打开的对话框中输入标题和连接。自动生成一个基于HTML的新页面打开连接
需要注意的是,此连接的会生成在文章尾部,需要自行复制到适当位置。

插入含连接的图片

可以在打开的对话框中输入连接、标题、图片地址、图片描述生成对应代码。
需要注意的是,此连接的会生成在文章尾部,需要自行复制到适当位置。

插入含描述的图片

可以在打开的对话框中输入图片地址、图片描述生成对应代码。
需要注意的是,此连接的会生成在文章尾部,需要自行复制到适当位置。

选中文字标红

选择要标红的文字,点击特色功能区的按钮,即可对指定文字进行标红处理。

快速打开图床

编辑器未做图片上传,故而提供了一个图床的地址,可以将图片上传到sm.ms,复制其生成的图片的连接,使用菜单栏中的工具添加即可。

源码地址

https://github.com/bestony/CoEditor

涉及技术

前端开发、JavaScriptEditor.md