markdown在项目中的使用

前瞻

本文档主要介绍editor.md的使用，editor.md是国内开发的开源项目，可以实现markdown编辑器的所有功能，editor.md真的是很强大，在博客中使用很方便

使用框架

thinkphp3.2

使用

• 下载editor.md
  下载地址：https://git.oschina.net/pandao/editor.md
  网盘地址：链接：http://pan.baidu.com/s/1gf5KIAZ 密码：8ebh
• 在项目中的使用
  • 将下载的文档放到Public目录
    
    
    
    上面标注的几个文件很重要
• 后台代码

展示效果如下：

                                {$art['test-editormd-markdown-doc']}
                                

上面的本地图片上传地址imageUploadURL : "/index.php/Admin/News/uploadFileMark",uploadFileMark方法的代码如下:

/**
     * 本地markdown图片上传方法
     */
    public function uploadFileMark()
    {
        // 实例化上传类
        $upload = new \Think\Upload();
        // 设置附件上传大小     PHP配置文件限定(upload_max_filesize = 2M),需要修改下配置文件
        $upload->maxSize = 3145728;
//        // 设置附件上传类型
//        $upload->exts = array('jpg', 'gif', 'png', 'jpeg');
        // 设置附件上传目录
        $upload->savePath = '/Uploads/';
        //文件上传保存的根路径 (必写)
        $upload->rootPath = './Public';
        // 执行上传文件
        $info = $upload->upload();
        $fileName = trim($upload->rootPath, '.') . $info['editormd-image-file']['savepath'] . $info['editormd-image-file']['savename'];
        if( $info ){
            $msg = array('success' => 1,'message' => '上传成功!', 'url' => $fileName);
            echo json_encode( $msg );
        }else{
            $msg = array('success' => 0,'message' => '上传失败!');
            echo json_encode( $msg );
        }
    }

• 注意
  是默认的显示mark文本的区域，默认的name值是test-editormd-markdown-doc，如果想更换content修改为即可
  插入数据我就不管了，比较简单，自己弄下就可以了，我这块没有保留html，当开启saveHTMLToTextarea : true,然后在上面的下面加入打印就可以看到转换成html的内容，但是我打印的时候有些没有转换成html，所有我没有要，只是插入了test-editormd-markdown-doc，然后在前台利用editor.md自带函数markdownToHTML转换成html，这种方式当用户访问量大时，对服务器压力会大些

• 前台展示代码

    
{$field['art_title']}
    
{:Date('Y-m-d',$field['art_time'])}










    {$field['test-editormd-markdown-doc']}

搞定，我用的的是官网的完整示例（ https://pandao.github.io/editor.md/examples/full.html ），除了moji表情，其他都显示了，展示效果如下

如果想做什么功能，去官方示例（ https://pandao.github.io/editor.md/examples/index.html ） 看效果，然后在你下载的目录里面有个examples，有对应的html，对应着添加配置文件即可
如果没弄好不行，还可以参考下其他的文档：http://blog.csdn.net/hj960511/article/details/53037618