WordPress代码高亮插件-配合Wiz使用

2022年4月6日 1081点热度
概述:代码高亮可以让代码区块和其他内容明显区别开来,以避免"乱糟糟"的阅读感。
为知(Wiz)作为一款笔记编辑和管理软件,附带有发布WP的功能,但WP的默认代码显示效果很朴素,这里介绍可以简单无需修改主题即可搭配使用的高亮插件。

代码高亮插件:

wordpress.org/plugins/urvanov-syntax-highlighter/

说明:urvanov-syntax-highlighter是对已停更的crayon-syntax-highlighter继续维护的版本,使用方式和效果都一致。
0、在线编辑可以触发代码高亮,Wiz发布不会触发代码高亮,需要在线更新文章重新发布
1、启用插件后,历史文章需要重新编辑才会触发高亮插件对本篇文章的作用。
3、历史文章批量处理:先启用插件,再通过XML导入文章可以实现所有历史文章都触发代码高亮。
3、HTML转义:如果没开启HTML转义,则一些“<”特殊符号会变为乱码:
    WP原始代码框:
    没有HTML转义的高亮代码框:
    启用HTML转移的高亮代码框:
4、Wiz代码框使用的是<pre><code>组合标签:
    wiz编辑器中的代码框:
    wiz的代码框发布为WP后,使用的是<pre>和<code>组合标签: 

其他代码高亮插件:

2019年5月10日以前:
wiz发布博客后wp的默认显示效果(丑就一个字): 

  • wordpress.org/plugins/crayon-syntax-highlighter/ 【2016年停更】
    • 优点:√ 支持wiz编辑器的"插入代码"(不需另外再做修改配对来支持)
    • 效果:
  • wordpress.org/plugins/enlighter/ 不支持默认渲染
  • wordpress.org/plugins/syntax-highlighter-for-wp-editor/ 不支持默认渲染
  • wordpress.org/plugins/syntaxhighlighter/   不支持默认渲染
  • wordpress.org/plugins/wp-code-highlightjs/【2019年停更】
    • 支持,只改变颜色,仅仅背景和字体颜色,视觉框架并没有大变化,并且不能显示行号.
    • 效果:
  • wordpress.org/plugins/codecolorer/【2018年停更】
    •  仅<code>,不含<pre>
    • 效果:
  • wordpress.org/plugins/wp-syntax/【2018年停更】
    • 不支持默认渲染

 

 

书三拾

不积跬步无以至千里