首先,感谢 Xcnte 制作的Code Prettify插件

插件作者对Handsome主题给出的方案是修改css文件,实际上因为Handsome支持自定义css,我们直接设置自定义css即可实现相关功能

下载

激活

1、进入Typecho后台启用插件

2、关闭Hansome内置高亮:主题增强功能->启用主题内置代码高亮,取消勾选

3、将以下代码添加到主题增强功能: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);}

4、将以下代码添加到主题设置后台:开发者设置->自定义 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!'; ?>
\\```

注意:实际使用没有\\,这里是防止Markdown错误解析

最后修改:2021 年 03 月 27 日 04 : 23 PM
如果觉得我的文章对你有用,请随意赞赏