Chrome插件解决微信公众号插入代码的难题

2018-05-15 3 条评论 234 次阅读 12 人点赞

 

有做技术类的微信公众号的同学肯定知道,在微信公众号中插入代码是一件很痛苦的事情,很多时候自己写的好好的,该缩进的缩进,该检查语法的检查语法,从IDE里一复制到公众号就一团糟。所以很多同学可能采取了如下几种方式:

1.直接复制,然后在公众号那个极其难用的编辑器里苦苦调教,最终到了手机上却还是一团糟;

2.使用第三方的排版工具。例如秀米。但其实这个也得花很多时间,但最终到了手机页面,效果也不是很好;

3.祭出截图大法,就是在IDE或者代码编辑器中写好代码,然后截图。这样代码看起来版面整齐,该高亮的也高亮了,是个不过的方法。不过对于阅读者,想要直接复制代码进行学习研究,就很麻烦。而且微信公众号图片上传后会压缩,代码少截图小的情况下,图片看起来观感就不是很好。

所以一直以来,在微信公众号上贴代码都是一件很蛋疼的事情。不过今天给大家带来一个Chrome插件,可以很好的解决这个问题。

这个插件是笔者在github上无意中发现的,项目地址在:https://github.com/imlinhanchao/crx_wx_code_highlight 它可以让微信公众号那个难用的编辑器支持插入代码框,插入代码后的效果也不错。下面进入正题。

相关准备

1.Chrome浏览器

推荐官方下载,如果下载速度太慢,或者被墙,可以去这个镜像站下载:http://www.chromeliulanqi.com/

2.wx_code_highlight.crx 插件

从项目提供的下载地址下载: https://github.com/imlinhanchao/crx_wx_code_highlight/raw/master/wx_code_highlight.crx

使用步骤

1.下载安装Chrome,没什么说的。

2.打开Chrome->设置->更多工具->拓展程序

3.打开拓展程序页面右上角的开发者模式

4.把下载好的wx_code_highlight.crx的后缀改为.rar,并且解压

这一步如果没看到后缀的按如下操作

解压后得到一个文件夹

5.回到Chrome的扩展程序页面,点击 加载已解压的程序 ,选中刚才解压的文件夹

PS:以上之所以没有使用传统拖放安装Chrome插件的方法,是因为新版的Chrome已经不支持安装没有上传到商店的拓展,即使你直接拖放安装了,这个插件你也是没办法启用的,所以才去这种方式安装,这种方式也适用于所有的为上传到商店的插件。

6.点击启用微信代码高亮插入器1.0插件

7.此时登录微信公众号后台,发现微信公众号编辑器上多了一个插入代码的按钮

8.点击按钮会出现一个代码编辑器,写好代码和相应语言后点击Insert;

9.插入代码后在微信公众号后台的效果如下:

手机上效果如下:

虽然高亮效果比不上真正的IDE或者代码编辑器,但是胜在整洁可复制,观感也不错。这样在微信公众号插入代码也变成了一件轻松愉快的事情,对于需要用的同学应该会很有帮助。

如果你喜欢这个插件,不妨去这个插件的项目主页点一个star~

希望本文对你有所帮助~

喜欢这篇文章的话可以扫描下方二维码支持我~

文章来自清渭技术小站,转载请注明出处

Kiwi

Valar Morghulis

文章评论(3)

  • Cresys

    :redface: :redface:

    2018-07-09
  • 哈哈

    :biggrin: :biggrin:

    2018-07-06
  • sjkiws

    厉害了,这个很需要了!

    2018-05-16