热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

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

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

我一直觉得微信公众号是最难用的文章编辑器,直到我开始写知乎专栏。作为两个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{},{}里填写需要加下划线的内容即可。

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

样式如下:

斜体

加粗

删除线

<3>列表


  • 无序列表

1.有序列表

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

样式如下:

•无序列表

1.有序列表

<4>引用

> 引用内容

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

样式如下:


引用内容嵌套


<5>图片

![图片alt](图片地址 &#39;图片title&#39;)

图片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.io :https://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


推荐阅读
  • 申请地址:https://developer.apple.com/appstore/contact/?topic=expedite 常见申请理由:1. 我们即将发布新产品,这是一个媒体活动,我们无法承担任何风险,因此在多个方面努力提升应用质量。 ... [详细]
  • 本文介绍了多种Eclipse插件,包括XML Schema Infoset Model (XSD)、Graphical Editing Framework (GEF)、Eclipse Modeling Framework (EMF)等,涵盖了从Web开发到图形界面编辑的多个方面。 ... [详细]
  • 在创建带有左侧图标的按钮时,遇到了文本与图标对齐的问题。本文提供了几种使用Bootstrap 4解决此问题的方法。 ... [详细]
  • iOS 小组件开发指南
    本文详细介绍了iOS小部件(Widget)的开发流程,从环境搭建、证书配置到业务逻辑实现,提供了一系列实用的技术指导与代码示例。 ... [详细]
  • 使用 ModelAttribute 实现页面数据自动填充
    本文介绍了如何利用 Spring MVC 中的 ModelAttribute 注解,在页面跳转后自动填充表单数据。主要探讨了两种实现方法及其背后的原理。 ... [详细]
  • CentOS7通过RealVNC实现多人使用服务器桌面
    背景:公司研发团队通过VNC登录到CentOS服务器的桌面实现软件开发工作为防止数据外泄,需要在RealVNC设置禁止传输文件、访问粘贴板等策略过程&# ... [详细]
  • 本文详细介绍了如何使用Python中的smtplib库来发送带有附件的邮件,并提供了完整的代码示例。作者:多测师_王sir,时间:2020年5月20日 17:24,微信:15367499889,公司:上海多测师信息有限公司。 ... [详细]
  • Backup Exec 11d 初学者使用心得与技巧
    随着企业应用程序的不断扩展,数据备份的需求日益增加。本文通过介绍Symantec Backup Exec 11d的实际应用体验,旨在为初学者提供一些实用的操作指南和建议。 ... [详细]
  • ZOJ 2760 - 最大流问题
    题目链接:How Many Shortest Paths。题目描述:给定一个包含n个节点的有向图,通过一个n*n的矩阵来表示。矩阵中的a[i][j]值为-1表示从节点i到节点j无直接路径;否则,该值表示从i到j的路径长度。输入起点vs和终点vt,计算从vs到vt的所有不共享任何边的最短路径数量。如果起点和终点相同,则输出无穷大。 ... [详细]
  • 深入解析轻量级数据库 SQL Server Express LocalDB
    本文详细介绍了 SQL Server Express LocalDB,这是一种轻量级的本地 T-SQL 数据库解决方案,特别适合开发环境使用。文章还探讨了 LocalDB 与其他轻量级数据库的对比,并提供了安装和连接 LocalDB 的步骤。 ... [详细]
  • 行为设计模式:命令模式详解
    命令模式是一种行为设计模式,它通过将请求封装为对象,使得可以使用不同的请求来参数化客户端,支持请求的排队、日志记录以及提供命令的撤销和恢复功能。 ... [详细]
  • 优雅地记录API调用时长
    本文旨在探讨如何高效且优雅地记录API接口的调用时长,通过实际案例和代码示例,帮助开发者理解并实施这一技术,提高系统的可观测性和调试效率。 ... [详细]
  • 详解MyBatis二级缓存的启用与配置
    本文深入探讨了MyBatis二级缓存的启用方法及其配置细节,通过具体的代码实例进行说明,有助于开发者更好地理解和应用这一特性,提升应用程序的性能。 ... [详细]
  • 本文介绍了两个重要的Node.js库——cache-content-type和mime-types,它们在处理HTTP响应头时非常有用。cache-content-type是基于mime-types构建的,并且实现了缓存机制以提高性能。 ... [详细]
  • 专业人士如何做自媒体 ... [详细]
author-avatar
潘巧军_837
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有