使用

  1. 下载本插件,解压,放到 usr/plugins/ 目录中;
  2. 文件夹名改为 CodePrettify;
  3. 登录管理后台,激活插件(请勿与其它同类插件同时启用,以免互相影响)
  4. 设置:选择主题风格,是否显示行号等。
  5. 最新版本handsome主题内置的高亮与该插件冲突,请进入后台 -> 设置外观 -> 主题增强功能里关闭主题内置高亮
  6. 外观设置 -> 开发者选项 -> 自定义CSS,添加以下css代码即可

    #post-content pre code {
     display:block;
     overflow-x:auto;
     position:relative;
     margin:0;
     padding-left:50px;
    }
    pre code {
     position:relative;
     display:block;
     overflow-x:auto;
     margin:4.4px 0.px .4px 1px;
     padding:0;
     max-height:500px;
     padding-left:3.5em
    }

语法

\```php(语言类型必填)
<?php echo 'hello jrotty!'; ?>
\```
删除上边代码中的\

若不填写语言类型,则无效果

PJAX

如果你的网站有开启Pjax
请把以下代码添加到回调函数的地方,在你使用的主题设置里看看
以 Handsome主题为例:

  1. 主题 --> 设置外观 --> Pjax --> PJAX回调函数

    if (typeof Prism !== 'undefined') {
    var pres = document.getElementsByTagName('pre');
                 for (var i = 0; i < pres.length; i++){
                     if (pres[i].getElementsByTagName('code').length > 0)
                         pres[i].className  = 'line-numbers';}
    Prism.highlightAll(true,null);}

    若插件里设置不显示行号,PJAX函数要改为

    if (typeof Prism !== 'undefined') {
    Prism.highlightAll(true,null);}

下载


说明

可设置项

  1. 选择高亮主题风格 (官方提供的 6 种风格切换,本人自己新增了三种(Mac风格))

    • coy.css
    • dark.css
    • BlackMac.css(黑色Mac风格)
    • GrayMac.css (默认选中:Mac风格(灰色))
    • WhiteMac.css(白色Mac风格)
    • twilight.css
    • tomorrow-night.css
  2. 是否在代码左侧显示行号 (默认开启)

Last modification:May 3, 2022
If you think my article is useful to you, please feel free to appreciate