8788 / blog

博客迁移到GitHub,采用issues方式发布
24 stars 7 forks source link

使用sublime text2/3来编辑markdown #3

Open 8788 opened 5 years ago

8788 commented 5 years ago

历史文章,发布于2014年,现迁移到issues PS:当前已经有很多编辑器可以实时编辑和预览markdown,如Visual Studio Code/Atom等,历史文章,仅供参考

markdown简介

markdown是一种简单的、轻量级的标记语言,由John Gruber和Aaron Swartz创建。markdown的优点非常多,如:语法简单,能让文档更易阅读、维护和修改,但是我觉得更吸引人的一个优点是:

markdown让我们专注于文章内容,而不是关注排版

确实是这样,不管是写博客还是写其他文章,如果用word来写,排版势必会是一个让人烦恼的问题。而如果用html来写的话,虽然很直观,但是不停的输入标签必然大大降低了写作效率。比如写一个简单的列表:

<ul>
  <li>sublime text2</li>
  <li>markdown</li>
  <li>notepad++</li>
</ul>

其实我们只是想输出一个简单的列表,但是编辑标签花费的时间都快要赶上编辑内容的时间了。那么我们来看下用markdown来实现这个列表。

- sublime text2
- markdown
- notepad++

只需在每个列表内容前加上“-”符号,便可以直接生成一个无序列表。

  • sublime text2
  • markdown
  • notepad++

再来看一下怎样用markdown输出标题

# This is h1
## This is h2
### This is h3
#### This is h4
##### This is h5
###### This is h6

This is h1

This is h2

This is h3

This is h4

This is h5
This is h6

更多markdown语法可参考http://wowubuntu.com/markdown/ 这里不在一一列举,基本上花个5-10分钟的时间便可以掌握markdown的基本语法

在sublime上使用markdown

那么作为一个sublime爱好者我们要怎样使用markdown呢?首先当然是安装sublime和Package Control了。。。具体可参考文章Sublime Text 2 入门及技巧

安装markdown Preview插件

markdown插件这里只推荐markdown Preview,其他的确实也没怎么用过。Mardown Preview不仅支持在浏览器中预览markdown文件,还可以导出html代码,这样极大方便了我们导出代码发布到博客上。

下面简单说明下markdown Preview插件的安装和使用

  1. 在插件安装面板找到markdown Preview并安装

markdown-preview

  1. ctrl + shift + p(windows下快捷键)调出命令面板,输入mdp,下图中红框圈出的就是在浏览器中预览markdown文件。另外一个常用功能是图中第四个,Export HTML in Sublime Text,即导出html文件到sublime text。

markdown-preview-browser

markdown语法高亮

sublime自带的主题风格中没有markdown语法的高亮功能,于是从网上找了一个做了些简单的修改,感觉色彩搭配还行。 附上代码地址:Monokai-custom.tmTheme

将上面代码下载并命名为:Monokai-custom.tmTheme,放入"Packages/User/"文件目录中,然后在面板中选择:Preferences-->Color Scheme-->User-->Monokai-custom,如下图所示:

highlight

高亮后的效果如上图中所示。

总结:整体来说用markdown语法来写文章还是挺方便的,这篇文章也是通过markdown来写的,比之前用Windows Liver Writer效率要高。当然美中不足的一点就是图片的处理,因为markdown中只能插入图片地址,没法上传图片,而我是先通过ftp将图片上传到站点上再获取链接插入。日后若发现更好的方法再进行补充。