Editor.md官网:https://pandao.github.io/editor.md/index.html

下载后解压放到项目内,和引入ueditor差不多

1、引入项目资源

<!--markdown编辑器-->
<script src="{$Think.config.__STATIC__}/admin/plus/editormd/jquery.min.js"></script>
<link rel="stylesheet" href="{$Think.config.__STATIC__}/admin/plus/editormd/css/editormd.css" />
<script src="{$Think.config.__STATIC__}/admin/plus/editormd/editormd.min.js"></script>

2、在自己的页面中加上对应的id

 <div id="test-editormd">
<textarea></textarea>
</div>

3、配置编辑器

<script>
var testEditor;
testEditor = editormd("test-editormd", {
placeholder:'本编辑器支持Markdown编辑,左边编写,右边预览', //默认显示的文字,这里就不解释了
width: "100%",
height: 640,
syncScrolling: "single",
path: "{$Think.config.__STATIC__}/admin/plus/editormd/lib/", //你的path路径(原资源文件中lib包在我们项目中所放的位置)
theme: "white",//工具栏主题
previewTheme: "white",//预览主题
editorTheme: "pastel-on-white",//编辑主题
imageUpload : true,
imageFormats : ["jpg","jpeg","gif","png","bmp","webp"],
imageUploadURL : "{:url('Knowledge/uploadImg')}",//上传图片使用方法
saveHTMLToTextarea: true,
emoji: true,
taskList: true,
tocm: true, // Using [TOCM]
tex: true, // 开启科学公式TeX语言支持,默认关闭
flowChart: true, // 开启流程图支持,默认关闭
sequenceDiagram: true, // 开启时序/序列图支持,默认关闭,
toolbarIcons : function() { //自定义工具栏,后面有详细介绍
return editormd.toolbarModes['full']; // full, simple, mini
},
});
testEditor.getMarkdown();
// 在js中调用getMarkdown这个方法可以获得Markdown格式的文本。
</script>

4、tp5后台图片上传代码

 //Markdown上传图片
public function uploadImg(){
if(request()->isPost()){
$file = request()->file('editormd-image-file');
$info = $file->move( './uploads/knowledge');
if($info){
$value=config('uploadFiles').'/knowledge/'.$info->getSaveName();
return json(['url'=>$value,'success'=>1,'message'=>'图片上传成功!']);
}
else{
echo $file->getError();
} }else{
$this->error('非法请求');
} }

thinkphp5使用Markdown编辑器Editor.md并上传图片的更多相关文章

  1. Markdown编辑器editor.md的使用---markdown上传图片

    http://kindeditor.org/ 确定下有没有查找替换功能 http://pandao.github.io/editor.md/ http://pandao.github.io/edito ...

  2. Markdown编辑器editor.md的使用

      目录(?)[-] 一Markdown和editormd简介 二editormd的使用 1下载 2简单使用 21在自己的页面上引入相关的css和js代码如下 22在自己的页面中加上DIV 23在同页 ...

  3. Markdown编辑器Editor.md使用方式

    摘要: 搭建个人博客时,涉及文章上传,文章展示,这里需要一个Markdown插件,mark一下. Editormd下载地址:http://pandao.github.io/editor.md/ 由于前 ...

  4. PHPCMS调用form类编辑器editor函数动态上传图片附件

    http://w3note.com/web/49.html phpcms v9的系统类库有一个表单类,它封装了表单的一些组件,如编辑器.图片上传.时间选择器.模板选 择器等,更详细请参考form.cl ...

  5. JAVA WEB项目中使用并改造editor.md实现Markdown编辑器

    Markdown和Editor.md简介 Markdwon编辑器在技术工作者圈子中已经越来越流行,简单的语法,统一的格式,强大的扩展功能,最重要的是:你可以用Markdown,设计一篇精彩绝伦的文档而 ...

  6. editor.md实现Markdown编辑器

    editor.md实现Markdown编辑器 Markdown和Editor.md简介 Markdwon编辑器在技术工作者圈子中已经越来越流行,简单的语法,统一的格式,强大的扩展功能,最重要的是:你可 ...

  7. 好用的Markdown编辑器一览 readme.md 编辑查看

    https://github.com/pandao/editor.md https://pandao.github.io/editor.md/examples/index.html Editor.md ...

  8. Markdown编辑器的使用

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/LoveJavaYDJ/article/details/73692917 一.Markdown和edi ...

  9. springboot结合开源editor.md集成markdonw编辑器

    今天来实现一个简单的功能,通常blog后台编辑大多使用的是富文本编辑器,比如百度的Ueditor,比较轻巧的wangEditor,那么如何使用开源editor.md的markdown呢? 搭建一个sp ...

随机推荐

  1. MarkDown不支持图片放缩。。

    ![](http://images2015.cnblogs.com/blog/573995/201604/573995-20160430162211050-1357272526.jpg =100x20 ...

  2. Swift中的参数内部名称和外部名称

    1.什么是参数的内部名称和外部名称? struct Color { let red, green, blue: Double init(red redColor: Double,green green ...

  3. 系列文章--8天学通MongoDB

    随笔分类 - MongoDB 8天学通MongoDB——第八天 驱动实践 摘要: 作为系列的最后一篇,得要说说C#驱动对mongodb的操作,目前驱动有两种:官方驱动和samus驱动,不过我个人还是喜 ...

  4. 系统原生文件MD5值获取

    windows: certutil -hashfile filePath MD5 certutil -hashfile filePath SHA1   Linux md5sum  filePath s ...

  5. 笔者带你剖析轻量级Sharding中间件——Kratos1.x

    之所以编写Kratos其实存在一个小插曲,当笔者满山遍野寻找成熟.稳定.高性能的Sharding中间件时,确实是翻山越岭,只不过始终没有找到一款合适笔者项目场景的中间件产品.依稀记得当年第一款使用的S ...

  6. node包管理工具nvm

    去NVM官网下载NVM压缩包,下载nvm-setup.zip,直接傻瓜式安装 安装成功后运行命令: nvm -v 常用命令: nvm install <version> ## 安装指定版本 ...

  7. html锚链接

    锚点(anchor):其实就是超链接的一种,一种特殊的超链接 普通的超链接,<a href="路径"></a> 是跳转到不同的页面 而锚点,<a hr ...

  8. Rreplication 性能差(转储200万门诊处方zjysb012)

    ETLDB性能差(HIS转储200万门诊处方zjysb012) 解决方法: 1.禁用cdc.Hismz_capture 2.停止cdc.Hismz_capture 3.关闭zjysb012,zjysb ...

  9. VS 关于无法打开项目文件,此安装不支持该项目类型的问题

    用VS打开后有时会出现类似: 无法打开项目文件,此安装不支持该项目类型 的错误,这个错误一般都是由于用低版本VS打开高版本项目文件造成的 其中包括: 1.用VS2003 打开包括VS2005以上版本项 ...

  10. [cf839d]Winter is here容斥原理

    题意:给定一个数列${a_i}$,若子序列长度为$k$,最大公约数为$gcd$,定义子序列的权值为$k*\gcd (\gcd  > 1)$.求所有子序列的权值和. 答案对10^9+7取模. 解题 ...