本插件基于 Prism.js 库开发,针对 Typecho 平台进行了高度集成和优化,旨在提供一个功能强大、稳定且易于使用的代码高亮解决方案。
一、核心功能与亮点
| 功能模块 | 特点描述 | 技术实现 |
|---|---|---|
| 代码高亮 | 支持主流编程语言的语法高亮,通过 CDN 加速加载主题。 | Prism.js 核心及 autoloader 插件。 |
| 行号显示 | 可选的行号功能,便于阅读和引用长代码。 | Prism.js line-numbers 插件。 |
| 长代码折叠 | 当代码块内容超过预设高度(如 400px)时,自动折叠并显示“展开/收起”按钮。 | 自定义 JS 逻辑和 CSS 遮罩。 |
| 一键复制 | 在代码块右上角添加“复制”按钮,实现代码快速复制。 | Clipboard.js 库 + 自定义 JS 逻辑(已汉化)。 |
| 主题丰富 | 提供多达 5 种配色方案,主流风格。 | 动态加载 Prism.js themes CSS 文件。 |
二、技术架构与优势
| 关键要素 | 说明 |
|---|---|
| CDN 加速 | 所有 JS 和 CSS 资源均通过 Staticfile CDN 引入,确保全球访问速度和稳定性。 |
| 功能解耦 | 彻底解决了 Prism 内置复制插件与自定义折叠功能之间的 DOM 结构和样式冲突问题。 |
| 样式强制 | 通过在 PHP 输出的 <style> 中使用高优先级的 CSS 选择器,解决了主题对 pre 元素颜色样式的覆盖问题。 |