您的位置：首页 > 其它

【四】搭建Markdown的编辑器

2016-01-10 12:10 351 查看

本系列有五篇：分别是
【一】Ubuntu14.04+Jekyll+GithubPages搭建静态博客：主要是安装方面
【二】jekyll的使用：主要是jekyll的配置
【三】Markdown+jekyll在Gitpages上写blog的常用操作：主要Markdown的使用

【四】搭建Markdown的编辑器

【五】将博客从jekyll迁移到了hexo

一、在线编辑器：StackEdit

二、gedit安装MarkdownPreview

Ubuntu自带的gedit编辑器也是有很强大的功能的，且支持插件的安装。对于喜欢用Markdown的我来说，这当然是很好的了，gedit本身就支持Markdown的语法高亮，在加上预览功能那就很完美了，MarkdownPreview插件就很好的解决了这个问题，可以让我们在当前窗口就能预览.

系统版本：Ubuntu14.04
gedit版本：3.10.4
Markdownpreviewversion:2

1.根据自己的gedit版本去下载对应的文件，gedit3.8以上的版本可以去以下链接下载

Downloadthearchiveofgedit-markdownv2.

2.解压文件

3.在解压的文件夹中打开终端，输入以下安装命令

./gedit-markdown.shinstall

卸载命令为:

./gedit-markdown.shuninstall

4.完成安装..

5.gedit默认不起用插件，所以我们要去编辑>首选项>插件将MarkdownPreview插件启用，重启gedit即可。

（如果导入不成功，请参考异常1）

6.当我们编辑Markdown文件时，使用快捷键Ctrl+Alt+M即可预览，如果没有预览请先Ctrl+Alt+V切换到MarkdownPreview的显示面板

7.MarkdownPreview的显示面板可以设为侧边栏显示或底部面板显示，具体设置如下:
打开文件

$HOME/user/.config/gedit/gedit-markdown.ini

修改行

Panel=bottom

user为你的用户名
Panel=bottom;底部面板显示
Panel=side;侧边栏显示

当然我们也可以在这个配置文件中修改熟悉的快捷键

异常1:
Q：无法启用MarkdownPreview插件,显示无法加载插件
A：请检查包

python3-markdown

是否安装，如果你的系统版本为Ubuntu11.10或更高，还需要安装

gir1.2-webkit-3.0

.安装完成后，重启gedit即可。在部分情况下重启gedit无果，需要重启系统才能生效。

更多功能和设置详情请阅读压缩包中的READE.md文件

二、MarkdownPad

用户可以通过键盘快捷键和工具栏按钮来使用或者移除Markdown格式。MarkdownPad左右栏的分割方式令用户可以实时看到HTML格式的Markdown文档。

下载地址：http://markdownpad.com/

下载完直接安装即可；然后打开就可以操作了。

若打开后出现异常，请参考异常2

异常2：LivePreview不能渲染。

LivePreviewisnotworking-itdisplaysanerrormessagestating
Thisviewhascrashed!

ThisissuehasbeenspecificallyobservedinWindows8.Youmayseeanerrormessageasshownhere,andnoHTMLwillberenderedwhenyoutypeintheMarkdownEditorpane.

Tofixthisissue,pleasetryinstallingtheAwesomium1.6.6SDK.

Ifyoucontinuetoexperienceissues,pleaseinstallMicrosoft'sDirectXEnd-UserRuntimes(June2010).

参考官网，下载Awesomium1.6.6SDK（是一个webkit内核的浏览器插件，渲染需要）.并安装后，问题解决。

三、SublimeText3

SublimeText3

作为一个优秀的文本编辑器，拥有很多的扩展插件。我们可以利用这些插件为SublimeText增加扩展的功能，在这里我们借助两个插件来将SublimeText3变成一个

Markdown

的编辑器。

1、安装sublime3：下载地址：http://www.sublimetext.com/3

注册码：

-----BEGINLICENSE----
AndrewWeber
SingleUserLicense
EA7E-855605
813A03DD5E4AD9E66C0EEB94BC99798F
942194A602396E98E62C99794BB979FE
91424C9DA45400BFF6747D882FB88078
90F5CC941CDC92DC8457107AF151657B
1D22E383A997F0164239764033F41CFC
E1D0AE85A0BBD0390E9C8D55E1B89D5D
5CDB7036E56DE1C0EFCC0840650CD3A6
B98FC99C8FAC73EED2B95564DF450523
------ENDLICENSE------

2.安装PackageControl套件：sublime上的包管理器，可以用来装其他插件
我们借助

PackageControl

来安装插件(如果SublimeText3还没有安装

PackageControl

，请参考这里：PackageControlInstallation)。

（1）开启SublimeText3程序，如下圖顯示主控台視窗，或直接按下Ctrl+`組合鍵開啟：

（2）直接複製貼上這個網頁提供的指令到主控台命令列中，並直接按下Enter執行，即可動安裝完畢。
請注意：這段安裝程式碼，僅適用於SublimeText3版本！

importurllib.request,os,hashlib;h='2915d1851351e5ee549c20394736b442'+'8bc59f460fa1548d1514676163dafc88';pf='PackageControl.sublime-package';ipp=sublime.installed_packages_path();urllib.request.install_opener(urllib.request.build_opener(urllib.request.ProxyHandler()));by=urllib.request.urlopen('http://packagecontrol.io/'+pf.replace('','%20')).read();dh=hashlib.sha256(by).hexdigest();print('Errorvalidatingdownload(got%sinsteadof%s),pleasetrymanualinstall'%(dh,h))ifdh!=helseopen(os.path.join(ipp,pf),'wb').write(by)

安裝好之後重启程序：
（3）然後你就可以在[Preferences]–>[PackageControl]啟用這個SublimeText套件管理員：

（4）未來有許多好用套件都會透過這個套件管理員協助安裝，最常用的就是InstallPackage命令了

（5）快速叫用InstallPackage命令的快速鍵是：Ctrl+Shift+P然後輸入inst之後按下Enter鍵

【sublime更详细内容可参考】SublimeText3新手上路：必要的安裝、設定與基本使用教學

3.安装MarkdownEditing和MarkdownPreview插件
点击

Preferences

-->选择

PackageControl:intall

，

然后再插件库中分别选择和安装

MarkdownEditing

和

MarkdownPreview

即可。

可在控制台看到安装的信息：

然后重启SublimeText3，创建一个以

md

为后缀的文件，既可以开始编辑

Markdown

文件了。

MarkdownEditing

为提供了

Markdown

格式的高亮显示，如图：

4.使用MarkdownPreview生成HTML
输入

Shift

Ctrl

，输入

MarkdownPreview

，可以看到如下选项：

通过给出的选项，我们可以在浏览器中预览生成HTML的效果，也可以保存，或者导出生成的HTML文件。现在我们选择第一个选项：PreviewinBrowser，然后再选择一个生成HTML的CSS模板，就可以在浏览器中看到生成的HTML了。

5、自定义快捷键

如果我们想要直接在浏览器中预览效果的话，可以自定义快捷键：点击

Preferences

-->选择

KeyBindingsUser

，输入：

{"keys":["alt+m"],"command":"markdown_preview","args":{"target":"browser"}}

保存后，直接输入快捷键：

Alt

就可以直接在浏览器中预览生成的HTML文件了。

设置语法高亮和mathjax支持

在

Preferences

PackageSettings

->MarkdownPreview
->
Setting-User
中添加如下参数：

{
/*
Enableornotmathjaxsupport.
*/
"enable_mathjax":true,

/*
Enableornothighlight.jssupportforsyntaxhighlighting.
*/
"enable_highlight":true,
}

因为SublimeText3开始不能直接修改[code]Setting-Default

中的设置了，我们需要在对应的

Setting-User

选项里面对Default中的默认参数重写覆盖即可。[/code]

渲染结果：

6、更换Markdown的语法主题，自带的Markdown语法高亮等不是很好看，更换成Markdown-Extended的，
同样使用Ctrl+Shift+P使用包管理器进行安装：搜索MarkdownExtended，然后安装即可

然后在View-->Synytax中选择MarkdownExtended

【注意】关于linux下sublimetext3不能输入中文的问题，可参考【完美解决Linux下SublimeText中文输入】

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

【四】搭建Markdown的编辑器

目录：

一、在线编辑器：StackEdit

二、gedit安装MarkdownPreview

二、MarkdownPad

三、SublimeText3