业余草微信公众号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来打开文件,这也算是折腾吧


目录
相关文章
|
20天前
|
小程序 开发者
【微信小程序-原生开发】实用教程05-首页(含自定义调试模式、插入图片、图文排版、底部留白、添加本地图片)
【微信小程序-原生开发】实用教程05-首页(含自定义调试模式、插入图片、图文排版、底部留白、添加本地图片)
20 0
|
1月前
|
存储 移动开发 编解码
基于HTML5开发的Markdown在线编辑器
Markdown是一种轻量级标记语言,以其简洁易读的格式而备受程序员和作者们的青睐。随着互联网的发展,越来越多的在线Markdown编辑器应运而生,为用户提供了更加便捷、高效的写作和编辑环境。本文将探讨基于HTML5开发的Markdown在线编辑器的设计原理、功能特点以及技术优势。
74 4
|
2月前
|
JavaScript Java 测试技术
基于小程序的教学辅助微信小程序+springboot+vue.js附带文章和源代码说明文档ppt
基于小程序的教学辅助微信小程序+springboot+vue.js附带文章和源代码说明文档ppt
34 1
|
20天前
|
小程序
【微信小程序-原生开发】富文本编辑器 editor 的使用教程
【微信小程序-原生开发】富文本编辑器 editor 的使用教程
27 0
【微信小程序-原生开发】富文本编辑器 editor 的使用教程
|
27天前
|
Linux C++ 开发者
几款主流好用的markdown编辑器介绍
几款主流好用的markdown编辑器介绍
27 0
|
2月前
|
JavaScript Java 测试技术
基于小程序的健身管理系统及会员微信小程序+springboot+vue.js附带文章和源代码说明文档ppt
基于小程序的健身管理系统及会员微信小程序+springboot+vue.js附带文章和源代码说明文档ppt
27 2
|
2月前
|
JavaScript Java 测试技术
基于微信小程序的医院体检管理系统附带文章和源代码
基于微信小程序的医院体检管理系统附带文章和源代码
85 1
|
1月前
Markdown编辑器--冷门实用知识总结
Markdown编辑器--冷门实用知识总结
|
2月前
|
Web App开发 存储 机器学习/深度学习
欢迎使用CSDN-markdown编辑器
欢迎使用CSDN-markdown编辑器
32 0
|
2月前
|
JavaScript Java 测试技术
微信点餐小程序+springboot+vue.js附带文章和源代码说明文档ppt
微信点餐小程序+springboot+vue.js附带文章和源代码说明文档ppt
22 0