网站实现markdown功能

前言

因为我的一直想弄一个博客网站,因此写博客的功能也就必须存在啦,而以前想过用富文本编辑器来实现的。可是接触了markdown后,发现真的是太好玩了,并且使用markdown的话能够在博客园、CSDN、公众号等各个地方使用。若是使用富文原本实现的话。。那可就惨了,发一篇文章在不一样的地方就要从新弄一下样式。真的是很是蛋teng。因此建议不会markdown语法的童鞋仍是得好好去看看。


在这里我要介绍的是如何在你的网站接入Markdown功能javascript

实现功能

实现markdown的功能主要实现两部分,找到能够转换markdown语法的功能。而后去找一下你本身喜欢的markdown主题样式。(若是你追求至简的话,你只须要实现第一部就能够了,只是有点丑。。。)css

showdown.js

为何使用showdown.js?肤浅的我只认star数(手动吾眼)
入口在此:https://github.com/showdownjs/showdown
用法也是灰常之简单:
只需使用到 dict\showdown.js文件,引入了以后,只需以下使用:html

var converter = new showdown.Converter(),
    text      = '# hello, markdown!',
    html      = converter.makeHtml(text);

这样就能够获取到markdown语法转换后的html啦。
其实仍是很丑的。。。由于没有样式。。。java

主题样式

Typora

入口:http://theme.typora.io/git

貌似挺多人喜欢用这个,可是我我的以为麻麻地。并且有些主题对中文不太支持。不过里面的主题还挺多的。能够搞一下。github

Markdownhere

入口:https://markdown-here.com/markdown

Markdownhere 是李笑来制做的一套 CSS 主题,。我如今用着他的CSS主题,其实也是麻麻地,而后本身也改了一点。感受没啥变化(一名CSS的菜鸟)。编辑器

少数派

为何叫少数派?我也不知道,我一直觉得是少数人使用的流派(本身yy的)。网站

入口:https://cdn.sspai.com/minja/sspai.css.zipspa

相关文章
相关标签/搜索