«

微信markdown自动化工作流

最近开始将博客上的文章同步到微信上去了,因为无意间有了个个人的微信账号,闲着也是闲着, 贴了两篇文章后, 发现转移编辑器的成本过程中产生了复杂的排版问题, 在排了两篇文章,修改了点原先的错别字(通假字)之后, 我不想要再做这种重复的体力劳动了, 这种劳作应该全部变成自动化🤖。

于是我想到微信编辑器,也可以通过插件的方式支持 Markdown, 在这里记录一下自动工作流。

第一步: 安装Chrome插件

👉Markdown here

第二步: 修改CSS 语法

这边需要一丢丢前端的基本知识( 其实我就是因为第一次学习html和CSS失败,才转战Sketch画图的啊哈哈, 好在后来我能徒手写一点基本的CSS了)

这里为大家划几个重点,看懂这几个就能改了。 首先需要找到基本渲染CSS 和 预览这两块, 在基本渲染CSS里面修改代码即可。

01.修改标题

👇下图是Markdown here默认的代码设置,找到h1,h2,h3…(这里h的意思是headline) 这样开头的文字,我们将font-size : 1.6em 里面的字体大小进行修改, 这里你不需要知道em是什么意思, 直接用微信里面常用的px就行了, 比如我希望h1也就是大标题的字体大小是24px。 我只要把 1.6em改成24px 就可以了。

修改h1之后,你会发现,预览里的header1的确变大了。 👇

这里我还把 h1 的border-bottom 的大小改成了0px,因为我不需要下划线,当然你可以直接把 border - bottom:0px solid #ddd;这些代码直接删掉, #后面跟上一串数字的意思是,一个颜色的色号。 这个学设计的同学肯定都懂。

再来我们想要修改各种标题的颜色, 默认设置如下👇

如果我们要修改, 就可以在大括号里面写上 color:#8756FF 看,颜色是不是变成了我们需要的了。

02.修改正文

接下去的基本操作就是文本的字体大小了: 我将代码的基本信息简单写在下方,各位需要的话可以直接复制黏贴:

  font-size:14px;
  letter-spacing:1.5px;
}

第三步: 复制黏贴Markdown语法的文本

将Markdown语法的文本直接黏贴到微信编辑器里, 使用快捷键CTRL+ALT+M就能过上愉快的生活, 一键发布了。

来看一下这个见证奇迹的时刻👇

但其实这整个方案还不完美,因为微信并不支持Markdownhere渲染后图片的上传。 我找了很多解决方案, 但不知道是时间久远还是啥的,微信现在不管你怎么搞这个Markdown的图片, 就是上传不了。。。

工作效率这件事情,有时候不是别人速度快, 而是要动脑子, 只要痛苦得学习一点基本的代码知识,便能为工作生活节约大量的生活, 何乐而不为~

啊可惜自从七牛不支持图片存储之后, 我博客上的图片都木有了, 原本可以很愉快的三件套, Mweb + 七牛+ GitHub 发布个人博客的自动化生活就这样一去不复返, 我要再继续研究新的替代方案了。 💪

最后叨叨两句。。。

大抵15年成功学Python失败后,我学习了一个伪代码写作方式 – Markdown,然后到处给其他人安利Markdown, 感觉从此就能过上不要鼠标的生活,效率杠杠的。

那时候也测试边了市面上所有支持MD笔记软件, 从尤利西斯,到Bear, 到中间无数想不起名字的,到后起之秀Notion,17年用Notion的时候我还是iOS端内测用户🤦‍♀️。

现在只留下Bear,和MWeb了。 用Mweb是为了一键发布我的文章到Github搭建的Jekyll上, 当时为了变得极客(zhuangbi), 折腾了好一阵Github。留下Bear是因为长得美, 轻。 我不需要那些复杂的功能, 能让我写字就行了✍️。


这些链接或许对你有用👀

  1. Markdown是什么? 🔗 Markdown 语法说明

  2. 查找关于CSS语义标签的所有用法: 🔗 W3school

  3. 关于Markdown 图床的问题 🔗 用Github做图床

Share Comment on Twitter