如何优雅地排版微信公众号
图腾
为什么要用 Markdown
大家都知道公众号只支持富文本写作，这就有了很大的限制，尤其对于程序员来说很不友好，不能插入代码成了很多人的痛点。
而往往你看到的很好看的排版，这也是人家经过了几个小时的选材排版后的结果。虽然市面上也有很多排版网站，如：秀米、135 、365，不否认它们都很优秀，但是要想有一个不错的排版，也是费尽心力。
而现在有一种只需要关注语法本身，不需要担心排版的 神器 —— Markdown
Markdown 是一种可以使用普通文本编辑器编写的标记语言，通过简单的标记语法，它可以使普通文本内容具有一定的格式。
其语法简单易用，富文本能做到的它都能做到，同时又支持 HTML、以及代码插入，很受程序员喜欢。
Markdown 编辑器
Markdown 只是一种语法格式，使用它写作，只需要记住简单的几个语法即可。正所谓：工欲善其事必先利其器，你现在还需要一款合适的能够支持 Markdown 语法的编辑器。
推荐几款比较好用的编辑器：
-
Typora：所见即所得，神器，推荐
-
VScode：巨硬家族，很棒
-
Sublime Text：需要安装插件
-
Atom：GitHub 推出，转为程序员设计，很强大
-
简书：一个写作平台
上面五种编辑器，除了 Typora 与简书以为，其余三种都需要自己配置 Markdown 插件，在这里不在赘述。
Markdown 语法
标题
# 一级标题
## 二级标题
### 三级标题
...
一级标题
二级标题
三级标题
文本加粗
**文本加粗**
文本加粗
斜体
*斜体*
斜体
下划线
<u>下划线</u>
<u>下划线</u>
删除线
~~删除线~~
删除线
分割线
***
---
+++
文本引用
> 这是一段文本，正在被引用...
这是一段文本，正在被引用...
链接
[描述](链接地址)
[百度](https://www.baidu.com)
文本居中
<center>文本居中</center>
<center><font color=grey>文本居中</font></center> # 指定颜色
换行
<br/>
换行<br/>换行 # 示例
换行
换行
首行缩进
  # 缩进一个空白（字符）
  首行缩进
首行缩进
无序列表
+ 无序列表 # + 与文本之间有空格
- 无序列表
* 无序列表
-
无序列表
-
无序列表
-
无序列表
有序列表
1\. 有序列表
2\. 有序列表
1. 有序列表
2. 有序列表
复选框
* [x] 第一只青蛙 # 已勾选，* 与 [ ] 之间有空格
* [ ] 第二只青蛙 # 未勾选
* [ ] 第二只青蛙
-
[x] 第一只青蛙
-
[ ] 第二只青蛙
-
[ ] 第二只青蛙
插入图片
冥想
代码块
这是`行内代码`，xxx
```
代码块
```
这是行内代码，行内代码。
代码块
表格
|序号|名称|类型|
|---|----|---|
|1 |表格 |Table1|
|2 |表格 |Table2|
|3 |表格 |Table3|
| 序号 | 名称 | 类型 |
|---|---|---|
| 1 | 表格 | Table1 |
| 2 | 表格 | Table2 |
| 3 | 表格 | Table3 |
Markdown 样式
同样地使用 Markdown 写作，你可能最终看到的效果却不同，这是由于 CSS 样式不同导致的。下图就是不同样式的引用，其表现方式也不同：
鬼吹灯
鬼吹灯
鬼吹灯
上面这些样式都是引用了别人已经写好的，第一个样式是我在别人的基础上，对其稍作修改，目前自己日常使用。
推荐几个 CSS 样式：
-
李笑来：https://gist.github.com/xiaolai/aa190255b7dde302d10208ae247fc9f2
-
阳志平：https://github.com/veganshe/CodeBlock/blob/master/Markdown-here/markdown-here-yzp.css
-
王小杰：https://github.com/veganshe/CodeBlock/blob/master/Markdown-here/markdown-here-veganshe.css
Markdown 样式使用
因为微信公众号只支持富文本，对 Markdown 语法不支持，因此就需要将 Markdown 转换为富文本，转换方法大致分为以下几种：
-
在线网站转换：Md2All
-
浏览器插件：Markdown Here
在线转换
能够在线将 Markdown 转换为富文本的网站有很多，目前发现 Md2All 挺好用的，支持自定义 CSS 样式，同时也有很多自己的样式可以使用。
操作流程：将用 Markdown 写好的文章，粘贴到网站的左侧（右侧为预览）—— 点击一建排版，将 CSS 样式粘贴进去，然后选择保存，此刻就能看到右侧的内容一建变换 —— 选择复制，然后将其粘贴到微信公众号即可。
Markdown-Here 插件
另一种方式就是安装 Markdown-Here 插件，然后将 CSS 样式拷贝到插件中，再将用 Markdown 写好的文章拷贝到公众号，全选，最后点击插件（或 CTRL+ALT+M，将会一键转换）。
可以通过 Chrome、Firefox 浏览器安装，在这里就不在赘述。
Markdown-Here
将 CSS 样式拷贝到基本渲染 CSS 即可，还可以选择自己喜欢的语法高亮 CSS。
参考文章：
浅谈微信公众号排版 —— Markdown 入门和进阶
Markdown 你应该学会的文章编辑利器
推荐阅读：
总有那么一个人，愿翻山越岭为你而来
记阳朔之行
在简书，有幸遇到你
喜欢我，欢迎来 公众号 找我哟~ :)
苍白露
