Easy Syntax Highlighter (WordPress 插件)
WordPress 现代化、轻量级的 语法高亮插件。
基于最新的 Highlight.js 引擎驱动，本插件提供了一种快速且准确的方式来展示代码片段。它支持超过 20 种编程语言，包含 80 多种视觉主题，并能与 Gutenberg 和经典编辑器无缝集成。
✨ 主要特性
- ⚡ 现代引擎： 采用最新的 Highlight.js 库，实现高性能语法高亮。
- 80+ 种主题： 包含庞大的浅色与深色主题库（Monokai、Dracula、VS Code、GitHub 等），所有主题均本地存储，支持离线使用。
- ️ 可视化界面： 拥有简洁、基于网格的管理界面，便于预览和选择主题。
- 编辑器集成：
- Gutenberg： 自动适配 WordPress 原生的“代码”区块。
- 经典编辑器： 包含 TinyMCE 按钮，方便快速插入代码。
- 智能复制： 用户可双击任何代码块，即可将内容即时复制到剪贴板（并伴有本地化反馈提示）。
- 性能优先： 资源采用智能加载机制——脚本和样式仅在确实存在代码块的页面上加载。
- 安全且无障碍： 构建时进行了适当的输入清理、输出转义，并配备了 ARIA 标签以确保无障碍访问。
要求
| 组件 | 版本 |
|---|---|
| WordPress | 5.0+ |
| PHP | 7.0+ |
| MySQL | 5.6+ |
安装
- 下载插件文件。
- 通过FTP将
easy-syntax-highlighter文件夹上传到您的服务器：/wp-content/plugins/。 - 登录WordPress并导航至插件页面。
- 找到Easy Syntax Highlighter并点击启用。
- 在设置 → 语法高亮器中配置您的偏好。
⚙️ 配置
导航至设置 → 语法高亮器以自定义插件。
1. 主题选择
从超过80种独特的色彩主题中自由选择。设置页面提供带有实时预览的视觉网格布局，让您在保存前就能精确预览代码的显示效果。
2. 常规设置
- 语言支持：启用自动语言检测或强制指定特定语言。
- 复制功能：切换“双击复制”功能（默认启用）。
- 性能：配置资源加载与缓存行为，确保您的网站保持高速运行。
使用方法
在古腾堡区块编辑器中（推荐）
本插件旨在增强原生的WordPress体验。
- 点击
+按钮，添加一个标准的代码区块。 - 将您的代码片段粘贴到该区块中。
- 发布！插件将自动检测语言并在前端进行高亮显示。
高级技巧：强制指定语言
如果自动检测对特定代码片段不准确，您可以手动定义语言：
- 选中您的代码块。
- 点击工具栏中的三点菜单（⋮），然后选择以 HTML 编辑。
- 将语言类添加到代码标签中：
<code class="language-python">。 - 选择可视化编辑以返回标准视图。
在经典编辑器中
- 在编辑器工具栏中查找代码图标（TinyMCE 按钮）。
- 点击该按钮以打开插入模态框。
- 粘贴您的代码，从下拉菜单中选择所需的语言，然后点击插入。
故障排除
如果您遇到问题，请检查以下解决方案：
| 问题 | 潜在解决方案 |
|---|---|
| 代码未高亮 | 确保您使用的是正确的古腾堡代码块。检查代码片段是否包裹在<code>标签内。 |
| 主题未更改 | 清除浏览器缓存（Ctrl+F5）以及任何WordPress缓存插件（例如WP Rocket, Autoptimize）。 |
| 复制功能失效 | 确保浏览器已启用JavaScript。再次确认您是双击代码文本本身。 |
| 样式丢失 | 检查浏览器控制台（F12）中是否存在.css文件的404错误。重新保存设置以重新生成路径。 |
许可证与贡献
许可证
依据 GNU 通用公共许可证 v2.0 或更高版本许可。
贡献
我们欢迎社区的贡献！
- 复刻（Fork）该仓库。
- 创建一个功能分支。
- 提交一个拉取请求（Pull Request），并清晰描述所做的更改。
为 WordPress 社区倾注 ❤️ 而打造