Xcnte

ColorHighlight插件实现Mac风格代码高亮
基于 Highlight的代码语法高亮插件 for Typecho,可显示语言类型、行号,有复制代码到剪切板等功能...
扫描右侧二维码阅读全文
24
2019/01

ColorHighlight插件实现Mac风格代码高亮

基于 Highlight的代码语法高亮插件 for Typecho,可显示语言类型、行号,有复制代码到剪切板等功能。本人博客使用的是Handsome主题,如若你在其他主题中使用该插件发现任何问题,可与我联系。

Github:https://github.com/Xcnte/ColorHighlight-for-typecho

码云:https://gitee.com/xcnte/ColorHighlight-for-typecho

起始

本插件是基于 Highlight 插件,改自泽泽https://qqdie.com/archives/typecho-highlightjs-plugin.html

首先名字改成了ColorHighlight

Highlight.jsjscss都换成最新的了

在原有的功能上新增代码复制功能,Mac风格代码高亮,代码块窗口化

(请勿与其它同类插件同时启用,以免互相影响)

使用方法

第 1 步:下载本插件,解压,放到 usr/plugins/ 目录中;

第 2 步:文件夹名改为 ColorHighlight

第 3 步:登录管理后台,激活插件;

第 4 步:设置:选择主题风格,是否显示行号等。

用法

\```php
<?php echo 'hello jrotty!'; ?>
\```
删除上边代码中的\

代码块可全屏,你发现了吗?

pjax

如果你的网站有开启Pjax

请把以下代码添加到回调函数的地方,在你使用的主题设置里看看

Handsome主题为例:

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

此处内容需要评论回复后(审核通过)方可阅读。

效果

点击开合查看

PC端
手机端

重要说明

可设置项

1. 选择高亮主题风格 (官方提供的 92 种风格切换(下面列出几种),本人自己添加了一种(Mac风格))

  • atom-one-dark.css
  • dark.css
  • default.css
  • github.css
  • customemin.css (默认选中:Mac风格,本人看着最顺眼)
  • pojoaque.css
  • tomorrow-night.css
  • vs2015.css
  • xcode.css

2. 是否在代码左侧显示行号 (默认开启)

3. 兼容模式(默认关闭)

在插件设置中打开兼容模式,即可支持以前没有用Markdown书写的代码高亮

如果你的blog已经全部是Markdown书写,建议你不要打开它以节省资源。

本插件支持常见的一些语言高亮。您可以打开以下链接查看详情:

https://highlightjs.org/download/

与我联系

长期更新该插件,如果有任何意见或发现任何BUG请在该篇文章下留言

如果插件符合你的心意,可否随意打赏0~1元?

我的文章对您有帮助吗?
扫一扫拿红包 → 扫商家收款码 → 花呗支付比红包多1分钱的金额
既可免费赞赏,又可完成支付宝支付任务!
Last modification:February 20th, 2019 at 11:18 pm
众筹娶媳妇儿的钱,你的点点心意将带给一个人莫大的幸福

Leave a Comment

32 comments

  1. 木南

    超级喜欢mac风格的代码块,感谢博主(☆ω☆)

    1. Xcnte
      @木南

      喜欢就好

  2. 心语难诉

    很不错!坐等Handsome5.1更新,然后就用你这版了!

    1. Xcnte
  3. Xcnte

    ColorHighlight插件算是正式发布了吧,希望大家喜欢

  4. kali论坛

    你好,代码风格更新了没!

    1. Xcnte
      @kali论坛

      还在更新一些东西,明天会发出来了

  5. 阿蒙

    滴!访客卡!请上车的乘客系好安全带~φ( ̄∇ ̄o),现在是:Mon Feb 18 2019 19:37:24 GMT+0800 (中国标准时间)

  6. Vi蓝鲸

    滴!访客卡!请上车的乘客系好安全带~φ( ̄∇ ̄o),现在是:Mon Feb 18 2019 19:01:13 GMT+0800 (CST)

  7. 涛涛

    棒!我能转到我的博客里吗?

    1. Xcnte
      @涛涛

      今天或者明天会更新一下,可以晚点再转载

    2. Xcnte
      @涛涛

      没问题,最好是保留一下原文链接哈

      1. 涛涛
        @Xcnte

        1. Xcnte
  8. 左岸

    mark

  9. 七越

    滴!访客卡!请上车的乘客系好安全带~φ( ̄∇ ̄o),现在是:Mon Feb 18 2019 12:17:52 GMT+0800 (中国标准时间)

  10. Mark

    看看 不错的样子

    1. Xcnte
  11. EIP

    可以的 ! 感谢分享

  12. kali论坛

    找了好久,终于找到了!感谢分享!
    滴!访客卡!请上车的乘客系好安全带~φ( ̄∇ ̄o),现在是:Thu Feb 14 2019 20:41:22 GMT+0800 (CST)

    1. Xcnte
      @kali论坛

      过几天会更新一下,会加上代码复制

      1. kali论坛
        @Xcnte

        好的,感谢分享!已收藏!

        1. Xcnte
  13. 很甜

    学习一下

  14. BigCoke

    来学习一下OωO

  15. 与梦城

    不错

  16. 拾光

    需要往下拉,只能显示到25行么?这个窗口最大显示长度可调不?

    1. Xcnte
      @拾光

      可以调整,至于往下拉你鼠标移动到代码块里滑动鼠标滚轮就够了,也不算麻烦୧(๑•̀⌄•́๑)૭

      1. 拾光
        @Xcnte
        该评论仅登录用户及评论双方可见
        1. Xcnte
          @拾光
          该评论仅登录用户及评论双方可见
  17. 心语难诉

    相当舒服~

    1. Xcnte
      @心语难诉

      ( ๑´•ω•) "(ㆆᴗㆆ)