0%

使用Enlighter替换Crayon Syntax Highlighter

其实升级到WordPress 5.x之后,发现新的编辑器挺适合我这种懒人的。不过WordPress就是生命不止折腾不息,以前实在是折腾够了:装个MarkDown插件,WordPress一升级就文章全毁了;装个评论插件,过一年就垮了评论还全丢了。 所以之前基本上就一个主题,一个Crayon Syntax Highlighter代码高亮插件,一个Akismet,没有其它插件了。

虽然前一篇文章还在说修复Crayon Syntax Highlighter的转义问题,但其实升级到WordPress 5.x 之后,这个很多年没更新过的插件基本是没法用了,用WordPress新编辑器添加的代码块,偶尔有格式、偶尔没格式(可能跟我同时在测试Syntax Highlighter Evolved)有关,总之还是继续折腾吧。

先试了Syntax Highlighter Evolved,总感觉格式不大好看,而且把Crayon Syntax Highlighter停用后,老文章的代码块就没有格式了,没有找到兼容的方法。

然后看到有文章介绍了Enlighter对原来Crayon Syntax Highlighter代码块的兼容,试了下Enlighter样式挺不错的,通过自定义CSS Selector也实现了对老文章的兼容,决定就用这个了! 安装Enlighter,停用/删除Crayon Syntax Highlighter,再如下配置即可实现对原有Crayon Syntax Highlighter代码块的兼容。

兼容方法:

  • Enlighter - Option – Block CSS Selector 设为pre.EnlighterJSRAW, pre[class*="lang:"][class~="decode:true"]
  • Enlighter - Option – Inline CSS Selector 设为code.EnlighterJSRAW, span[class*="lang:"][class~="decode:true"][class~="crayon-inline"]
  • Enlighter - BETA – Dynamic Resource Invocation (DRI)必须关闭

参考文档:https://blog.swineson.me/enlighter-compatibility-configuration-to-crayon-syntax-highlighter/