[WP插件]wordpress代码高亮插件Crayon Syntax Highlighter使用教程

作者: NickYang 分类: Wordpress,技术文章 发布时间: 2012-04-04 16:47

很久以前,介绍过 SyntaxHighlighter ,这也是一款很不错的wp代码高亮插件,介绍可以根据前面的链接看看,今天主要是想跟大家分享另外一款代码高亮插件Crayon Syntax Highlighter。

因为其加载速度快,可以解析代码中的html,并且着色效果更好,所以才更换原来的代码高亮插件,改用它了。

如何安装?

在wp后台安装插件处,搜索Crayon Syntax Highlighter插件,你会看到一个满分的该插件,直接安装即可,wp会帮你下载并解压安装的。

如何设置?

在wp后台右边菜单栏 设置->Crayon 中,又该插件的详细设置选项。不懂的选项大家可以多试试。

如何使用?

使用方法与SyntaxHighlighter 类似,同样是在html编辑模式下,使用该类语言的标签,比如你的代码是C++,

[C++]

your code

[/C++](只是个例子)

代码效果:

 

相信这种方式还是比较简单吧。

如果你还嫌麻烦,那么请使用可视化模式下的工具吧,安装完Crayon后,可视化编辑第一行菜单最后一个是该插件的选项,你可以点击它,直接拷贝你想高亮的代码进入就可以了,效果如下图所示,可视化编辑,更方便了。

Crayon

Crayon

好了,各位朋友,这个插件是不是更好用,快去试试吧。

如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!

16条评论
  • Henry

    2017 年 3 月 13 日 22:31

    请问crayon如何设置代码缩进?Python的代码不能缩进好蛋疼。。

    潜水 Chrome浏览器 Windows 10 x64 Edition
    1. NickYang

      2017 年 3 月 13 日 23:27

      抱歉,还没试过Python的,不过应该可以改改Python格式的js代码,去插件官网留言说下吧

      站长 Chrome浏览器 Windows 10 x64 Edition
    2. 枫頔

      2017 年 3 月 26 日 15:31

      我也纠结于这个问题

      潜水 QQ浏览器 Android
      1. NickYang

        2017 年 3 月 28 日 18:24

        我还真没怎么贴过python代码,你可以找插件作者问问

        站长 Chrome浏览器 Windows 7 x64 Edition
  • 大多

    2016 年 3 月 31 日 22:42

    我用的是CKEditor,可视化编辑下没有BUTTON是怎么回事?

    潜水 火狐浏览器 Windows 8 x64 Edition
  • web前端技术

    2015 年 12 月 7 日 09:33

    我用了这个插件后,代码的右边当鼠标移上去的时候始终会出现一个右侧的滚动条,不知道怎么回事,求解,网址是 http://www.rehack.cn/

    潜水 Chrome浏览器 Windows 7 x64 Edition
    1. NickYang

      2015 年 12 月 7 日 10:23

      不确定什么问题,可以提交给插件作者

      站长 Chrome浏览器 Windows 7 x64 Edition
  • 夏日博客

    2014 年 12 月 9 日 08:54

    支持 AS 的代码么。

    潜水 其它浏览器 其它操作系统
    1. eliteYang

      2014 年 12 月 9 日 09:30

      我没留意,你可以去这个插件的主页看看是否支持

      神话 其它浏览器 其它操作系统
  • 麦田村夫

    2014 年 2 月 20 日 19:44

    代码写完如何退出啊,

    潜水 Chrome浏览器 Windows 7
    1. eliteYang

      2014 年 2 月 21 日 09:50

      把你的代码插入到文章图中所显示的编辑器里就可以了,这个工具是点按钮,插入代码,确定就好了

      神话 Chrome浏览器 Windows 7 x64 Edition
  • zhuyf87

    2013 年 4 月 10 日 19:42

    这个插件确实不错。 ^_^

    潜水 其它浏览器 其它操作系统
  • Tommzy

    2012 年 5 月 7 日 23:01

    博主有木有发现这个代码高亮的东东让读者没法复制粘贴什么的…和设置里的例子不一样…我的博客就出现了这个问题。现在正寻摸解决方法呢…

    潜水 Chrome浏览器 Windows 7
    1. eliteYang

      2012 年 5 月 7 日 23:15

      可以拷贝粘贴啊,鼠标放上去会有一个菜单条,里面有一个复制代码,但是拷贝出来的是有行号的,有点不好,你可以点击以纯文本查看,然后就可以直接拷贝了,绝对没有问题。这个插件的目的只是为了让代码好看一些,如果真的想使用代码,建议还是手动打一遍,这样记忆更深刻一些。或者你可以选择使用另外一个高亮插件。

      神话 Chrome浏览器 Windows 7
  • 伸缩门

    2012 年 4 月 5 日 07:33

    😛 好东西

    潜水 Chrome浏览器 Windows 7
  • 广州搬家公司

    2012 年 4 月 4 日 21:44

    偶然来到博主博客的..很不错…要坚持更新哦!

    (广州搬家公司http://www.e1012.com)支持博主..

    潜水 Chrome浏览器 Windows 7

发表评论

电子邮件地址不会被公开。 必填项已用*标注