业余草微信公众号Markdown编辑器, 适合代码排版

简介: 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/xmt1139057136/article/details/79825204 随着大家都转战微信公众平台,如何快速的编写文章就摆在了首要位置。
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/xmt1139057136/article/details/79825204

随着大家都转战微信公众平台,如何快速的编写文章就摆在了首要位置。不可否认,使用微信自带的编辑器可以做出好看的排版,甚至用第三方编辑器有更多的模板。但是,这些全部都需要手动的调整。本来公众平台就算是自媒体,非全职的自媒体哪有那么多时间和精力去搞排版。那么,寻找一种简单的排版方式也势在必得。

markdwon自然是首选,然而微信公众平台并没有提供翻译模板,只能自己寻找了。市场上的模板很多,我们可以找一款自己合适的,复制渲染后的html到微信公众平台。我寻找了好久,发现关注的几个大佬都采用一种样式,果然,都是采用的一个开源的markdwon编辑器,为开源点赞。我fork了一个版本,修改了本地开发模式,更适合小白入手。更改了标题样式。最终结果如下: https://md.rmiao.top/

微信公众号格式化工具

使用微信公众号编辑器有一个十分头疼的问题——粘贴出来的代码,格式错乱,而且特别丑。这块编辑器能够解决这个问题。

用法

  • 复制你的markdown
  • 粘贴到这里
  • 点击预览
  • 选择样式
  • 复制到微信公众号编辑页面

代码示例

 
 
  1. var OnlineMarkdown = {
  2. init: function() {
  3. var self = this;
  4. self.load().then(function() {
  5. self.start()
  6. }).fail(function(){
  7. self.start();
  8. });
  9. },
  10. start: function() {
  11. this.updateOutput();
  12. },
  13. load: function() {
  14. return $.ajax({
  15. type: 'GET',
  16. url: params.path || './d.md',
  17. dateType: 'text',
  18. timeout: 2000
  19. }).then(function(data) {
  20. $('#input').val(data);
  21. });
  22. },
  23. updateOutput: function () {
  24. var val = this.converter.makeHtml($('#input').val());
  25. $('#output .wrapper').html(val);
  26. PR.prettyPrint();
  27. }
  28. };
  29. OnlineMarkdown.init();

上面是 JavaScript,下面是 php

 
 
  1. echo 'hello,world'

表格示例

品类 个数 备注
苹果 1 nice
橘子 2 job

以上是用的比较多的,还装了几十个使用频度比较低的插件,主要包括 Snippet 和文件高亮配置,可以在这里查看:https://gist.github.com/barretlee/a5170eb6ca1805f66687063d2e3a4983,你也可以通过 SettingsSync 将这个配置下载下来,id 就是后面半截: a5170eb6ca1805f66687063d2e3a4983

在命令行打开 VSC

在安装好 VSC 后,直接配置 .bash_profile 或者 .zshrc 文件:

 
 
  1. alias vsc='/Applications/Visual\ Studio\ Code.app/Contents/Resources/app/bin/code';
  2. VSC_BIN='/Applications/Visual\ Studio\ Code.app/Contents/Resources/app/bin';
  3. PATH=$VSC_BIN:$PATH;
  4. export PATH;

然后让配置生效,在控制台执行:

 
 
  1. # 如果没有安装 zsh,可能是 ~/.bash_profile
  2. source ~/.zshrc

这个时候就可以在全局打开了:

 
 
  1. # -a 的意思是不要新开窗口,在当前已经打开的 vsc 中打开文件
  2. vsc path/to/file.ext -a

有同学提到,VSC 的面板上搜索 install 就可以在命令行安装 code 这个命令了,不过我更喜欢使用 vsc来打开文件,这也算是折腾吧


目录
相关文章
|
1月前
《使用「Markdown」编辑器的那些天 |CSDN编辑器测评》
《使用「Markdown」编辑器的那些天 |CSDN编辑器测评》
26 0
|
1月前
|
机器学习/深度学习 uml
Markdown编辑器用法保存自用
Markdown编辑器用法保存自用
|
2月前
|
存储 小程序 UED
微信小程序代码包限制2M 怎么解决?
微信小程序代码包限制2M 怎么解决?
|
2月前
|
Web App开发 监控 JavaScript
1号防红网:什么是微信防红不死短链接?微信防红不死短链接代码示例
1号防红网:什么是微信防红不死短链接?微信防红不死短链接代码示例
51 0
|
3月前
|
Linux Docker 容器
Linux本地搭建StackEdit Markdown编辑器结合内网穿透实现远程访问
Linux本地搭建StackEdit Markdown编辑器结合内网穿透实现远程访问
34 0
|
2月前
|
存储 JavaScript 前端开发
使用Strve.js来搭建一款 Markdown 编辑器
今天,我们来使用Strve.js来搭建一款 Markdown 编辑器,没错!你没听错。我们需要创建了一个实时 Markdown 编辑器,用户可以在 textarea 中输入 Markdown 文本,然后实时显示转换后的 HTML。你可能会说使用 Strve.js 开发会不会写的特别复杂难懂啊,还不如用 Vue.js 呢!
|
10天前
设置WebStorm用Ctrl+鼠标滚轮上、下调整编辑器代码字体大小
设置WebStorm用Ctrl+鼠标滚轮上、下调整编辑器代码字体大小
|
27天前
|
机器学习/深度学习 uml
欢迎使用Markdown编辑器
欢迎使用Markdown编辑器
36 0
|
3月前
|
小程序 API
微信小程序飞机大战游戏步骤及代码
微信小程序飞机大战游戏步骤及代码
51 0
|
3月前
|
存储 小程序 开发者
微信小程序猜拳游戏步骤及代码
微信小程序猜拳游戏步骤及代码
70 0

热门文章

最新文章