当把Markdown编辑器搬进博客

学长冷月

发布于 2020-08-02 18:21:52

68600

代码可运行

文章被收录于专栏：冷月带你手撕代码冷月带你手撕代码

运行总次数：0

代码可运行

写文的朋友会发现有很多编辑器可以选用，但是经常遇到不同平台的格式差异等问题。冷月要给大家介绍的是一款我比较喜欢又简洁多用的编辑器：

markdown

，这样的一款好用的文章编辑器除了你看到的微信编辑，也可以把他搬进博客！

怎样让自己的博客也支持？

首先，我们来看一下效果图：

需要怎么做呢？冷月找到一个开源的Markdown编辑器叫Editor.md，但是官方已经没有维护这个项目了。不过~~冷月已经下载好了插件并且放到了公众号中。大家只需要关注冷月的微信公众号：学长冷月。回复：markdown。冷月将整理好的资料发给您。

大家下载好了插件后，只需要按照我下面的介绍来就可以成功。

首先，大家看到的目录结构是这样的，index.html是官方给的一个示例代码，可以参考使用。如下所示：

<link rel="stylesheet" href="editormd/css/editormd.css" />
<div id="test-editor">
    <textarea style="display:none;">### 关于 Editor.md

**Editor.md** 是一款开源的、可嵌入的 Markdown 在线编辑器（组件），基于 CodeMirror、jQuery 和 Marked 构建。
    </textarea>
</div>
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script src="editormd/editormd.min.js"></script>
<script type="text/javascript">
    $(function() {
        var editor = editormd("test-editor", {
            // width  : "100%",
            // height : "100%",
            path   : "editormd/lib/"
        });
    });
</script>