我一直在寻找有趣的语法高亮插件,尤其是在我编写教程或其他严重依赖代码的文章时。太多插件使用短代码、自定义块或其他奇怪的解决方案。然而,当我一年前发布它时,我故意遗漏了一个选项:Marcus Kazmierczak 的代码语法块。

根据名称,我认为它是另一个单独的块。然而,从那以后我又看了一眼,意识到这是真的。它直接与 WordPress 核心模块集成。有时需要一个新的块,但这不是其中之一。有时最好扩展核心中的现有块。

代码语法块使用 Prism JavaScript 库将语法突出显示添加到您网站的前端。该插件设计精良。代码块的脚本和样式仅在使用时加载。

前端PHP代码示例。

此插件不会在编辑器中加载 Prism,因此代码输出将使用默认的编辑器或主题样式。这可能不适合那些想要在后端和前端之间进行一对一匹配的人。我对管理员中未突出显示的版本感到满意,同时在前端有漂亮的输出。但是,很高兴看到一个选项或过滤器以在编辑器中启用突出显示。

开箱即用,该插件使用为 Atom 编辑器创建并移植到 Prism 的深色主题。开发人员可以使用主题的 /prism/prism.css 文件中的自定义资产或通过过滤要加载的路径或 URL 来覆盖主题。 Prism 项目具有各种即插即用的主题。其他主题也存在于官方列表之外。

在管理方面,该插件为代码块创建了一个新的“设置”选项卡,并添加了一些用户可以选择的选项:

  • 语言
  • 显示行号
  • 代码块标题

代码语法高亮器的编辑器视图

默认情况下,该插件不支持 200 多种语言的完整列表。相反,它列出了 40 多个最受欢迎的网站。该列表是可过滤的,因此任何人都可以通过几行代码添加或删除语言。还有一个用于设置默认语言的过滤器挂钩,这对于那些通常使用相同编码语言发布代码片段的人特别有用。

经过几天的测试,我可以肯定地说代码语法块已经添加到我的 WordPress 工具箱中。我希望我早点尝试过。