强推Markdown神器,一秒钟拯救微信公众号排版

我一直觉得微信公众号是最难用的文章编辑器,直到我开始写知乎专栏。作为两个UGC内容为主的产品,用户体验如此之差真的大大降低了写作者的创作欲望。

基于这个痛点,滋养了一大批像365编辑器、壹伴、秀米等第三方微信图文排版编辑工具,但是页面杂乱繁复,模版花里胡哨,还要忍受粘贴后样式全乱的崩溃感。

有一天偶然在github上发现了lyric大神的微信公众号排版编辑器项目,可以直接将Markdown格式转换成微信的HTML,终于让我从操控感极差的自带编辑器中解放出来了!

在线版地址:

https://lab.lyric.im/wxformat
github项目地址:

https://github.com/lyricat/wechat-format
工具介绍:

https://mp.weixin.qq.com/s/pn0LzyfgUj6rGUfVHUksjg

微信公众号排版编辑器

Markdown

A.Markdown简介

Markdown 是一个 Web 上使用的文本到HTML的转换工具,可以通过简单、易读易写的文本格式生成结构化的HTML文档。

官网地址:

http://www.markdown.cn/#overview

Markdown官网首页

Markdown在15年前由作家和程序员共同开发创建,作为一个文本编辑语言它可以让你不用再花时间和心思在样式、排版、格式上,通过一些简单轻量的的语法,让你清楚写作层级,从而更加专注于写作本身,为你创建一种无干扰的写作环境,提升写作效率。近年来由于它的简便性,得到了越来越多写作者的喜爱,在各种写作平台上得到了蓬勃的发展,如果你厌倦了word或者其他传统编辑器没完没了的格式限制,不妨试试这种新型文本编辑形式吧,让我们回归写作本身。

我们可以设想这样一种场景,如果所有的主流内容网站都支持Markdown格式,那我们只需要编辑一份文档,并且在写作中就可以直观的看到它输出后的样式,即使在不同的平台发布,也不用再费时间去处理各个平台的格式问题,而且实现了样式的统一。

目前很多技术网站都支持Markdown的文本编辑格式,比如:简书、github。流行的笔记应用像有道云笔记,Bear也大多支持Mardown格式。

B.适用于微信公众号的常用语法

在官方网站上可以查看Markdow的完整语法,这里我主要简单整理一些公众号排版常用语法。

<1>标题

一级标题

二级标题

标题前面加两个“#”代表一级标题,加三个“#”代表二级标题,公众号只支持一级标题和二级标题,#和文字中间不要忘记加空格。

样式如下:

一级标题

这是一级标题

二级标题

上面是二级标题

<2>字体样式

斜体:英文输入法模式下输入一个“*”嵌套内容即可)

加粗:英文输入法模式下输入三个“*”嵌套内容即可)

删除线:英文输入法模式下输入两个“~”嵌套内容即可)

下划线:两个$符号中间包裹\underline{},{}里填写需要加下划线的内容即可。

这些基本的字体样式公众号已经提供了快捷按钮,了解即可。

样式如下:

斜体

加粗

\underline{下划线}

删除线

<3>列表

  • 无序列表

1.有序列表

无序列表是“-”符号,空格加列表项,会在前方自动生成圆点样式。有序列表按照顺序编写序号,使用数字、一个英文句号和一个空格即可。。

样式如下:

•无序列表

1.有序列表

<4>引用

> 引用内容

引用内容是用“>”实现的,多个“>”符号还可以实现嵌套

样式如下:

引用内容嵌套

<5>图片

![图片alt](图片地址 '图片title')

图片alt就是显示在图片下面的文字,相当于对图片内容的解释。图片tilte就是图片的标题,当鼠标移到图片上时显示的内容,title可加可不加。

样式如下:

产品图片

<6>代码块

代码块

内联代码

微信官方针对代码块有高亮配色,粘贴至公众号后点击一下即可显示。

样式如下:

function filterMenu(html){
var $ = cheerio.load(html);
var arr = [];
$(".node-index").each(function(index,item){
    arr.push($(item).find("a").text().trim());
})
return arr;
}

<7>表格

| Header 1 | Header 2 | Header 3 |
| --- | --- | --- |
| Key 1 | Value 1 | Value 1
| Key 2 | Value 2 | Value 2
| Key 3 | Value 3 | Value 3
| Key 3 | Value 3 | Value 4

利用以上语法可以轻松在公众号中制作表格。

样式如下:

语言 职业 兴趣爱好
JavaScript 程序猿
PHP 码农
HTML5 攻城狮 rap和篮球

Markdown编辑器推荐

A.轻量级在线工具

stackEdit 官网地址:

https://stackedit.io/
github地址:

https://github.com/benweet/stackedit/

这是一个可以在任何浏览器中运行的开源编辑器,在谷歌浏览器的应用里搜索名字就能找到相应的插件,它能够实现同步编辑和预览,并且能将本地缓存同步到云端,以便跨多个设备同步文件,也可以从本地上传md文件进行编辑,完成后可以导出markdown格式或者html格式的文件。

界面干净简洁,功能强大,可以让用户方便的新建、删除和管理文档,你所有的操作它都会自动保存到浏览器缓存。如果你在编辑的时候偶尔忘记了Markdown语法,也可以在左上角菜单->settings->Utils->welcomedocument找到它的帮助文档。该项目在github中的标星已经达到了14380,足以可见它的受欢迎程度。

类似的轻量级在线工具:
dillinger.iohttps://dillinger.io/
MaHua :http://mahua.jser.me/
MdEditor:https://www.mdeditor.com/

B.功能完整的本地工具

Typora

官网地址:

https://www.typora.io/
github地址:

https://github.com/benweet/stackedit/

刚开始看到Typora这款软件的时候就被它简洁美观的界面吸引,这是一个可以实时预览的免费编辑器,当你在文本区写完markdown语法,软件立马自动识别并且帮你转成markdown格式,插入本地图片的时候直接拖入即可,非常方便快捷,支持多种格式的导出,例如word和pdf,相信深入体验之后还会发现很多它的隐藏功能。

类似的功能完整的本地工具:
MarkdownPad :http://www.markdownpad.com/
MaHua :http://mahua.jser.me/
Miu:https://github.com/egoist/Miu

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,902评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,037评论 2 377
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,978评论 0 332
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,867评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,763评论 5 360
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,104评论 1 277
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,565评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,236评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,379评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,313评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,363评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,034评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,637评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,719评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,952评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,371评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,948评论 2 341

推荐阅读更多精彩内容