Typecho HighlightJS 代码高亮插件

全文共 675 字, 阅读约需 3 分钟

插件介绍:

HighlightJS 是一个轻量级的 Typecho 代码高亮插件,基于的 highlight.js 库开发,支持明暗模式的自动切换。精简highlight.js为常用程序语言减少体积,且仅在存在代码块的文章或页面中加载,优化加载速度。

插件类型:代码高亮 / 主题切换 / 免费
最新版本:v1.0.0
更新时间:2024-11-23

核心特性:

  1. 🎨 明暗主题切换

    • 自动监听主题变化
    • 支持多种判断方式
    • 兼容各类主题框架
  2. 🎯 主题自定义

    • 可自定义明暗主题
    • 支持 CDN 加速
    • 丰富的主题选择

配置说明:

  1. 基础配置
// 深色模式判断示例
document.documentElement.classList.contains("dark")
// 或
document.documentElement.getAttribute('data-theme') === 'dark'
  1. 高级配置

    • 监听属性:class, data-theme 等
    • 自定义 CSS:支持外部样式表

使用方法:

  1. 下载并安装插件
  2. 启用并完成基础配置
  3. 直接在文章中插入代码块
  4. 实现代码高亮

实际效果:

浅色模式下代码示例:

def hello_world():
    print("Hello, World!")
    return True

深色模式下自动切换为暗色主题。点我试试

常见问题:

  1. 深色模式不生效?

    • 检查判断表达式
    • 确认监听属性
    • 查看控制台输出
  2. 样式不符合预期?

    • 检查插件状态
    • 排除样式冲突
    • 清理浏览器缓存

说明:

本插件仅在 Typecho 1.2.1 版本通过测试,其他版本请自行测试。

最后更新:2024年11月27日 16:21

# Typecho# 插件


添加新评论

您的邮箱地址不会被公开。 必填项已用 * 标注