现在的位置: 首页 > Wordpress > WP插件 > 正文
WordPress插件:SyntaxHighlighter实现代码高亮
2010年05月20日 WP插件 ⁄ 共 1755字 评论数 32 ⁄ 被围观 6,668+

熟悉wordpress的人应该都用过代码高亮插件,这样可以很方便的在文章中插入代码,而不会显示实际效果或者错误之类。而代码高亮的插件也很多,像WP-SyntaxSyntaxHighlighter等等。之前我也介绍过利用WLW发布文章时可以利用WLW的插件来实现代码的输入:WLW插件:CodeSnippet在文章中插入代码源码框不过经过几次的使用,发现其有bug,会无故失效,并且显示的效果也有点难看,这个可能和我使用的主题有关。所以后来还是选择直接在wordpress后台编辑,安装代码高亮插件就是了。

刚开始看到网上很多人介绍wp-syntax,而且一看评论和下载量,都是非常之高。所以我也折腾了下,安装激活之后,发现的确是能实现代码高亮,而且还可以分行,但是多了很多引号以及多个方框,折腾了半天也没捣鼓出问题出现在哪,只能解释为与主题不协调了,当然最后只好放弃使用了。后来又找了半天,终于发现还有这么一款:SyntaxHighlighter。虽然网上介绍它的人不多,不过我看到其实也有很多人用,因为除了高亮代码外,它还有个小工具栏,包括“查看源代码”、“复制代码”、“打印”、“帮助”等功能,也正是因为有这个,我才找到了它。

这也就是我今天所要推荐的插件:SyntaxHighlighter。

安装:去wordpress官方网站下载:http://wordpress.org/extend/plugins/syntaxhighlighter/,或者去作者网站:http://alexgorbatchev.com/wiki/SyntaxHighlighter,然后上传、激活便可。

使用:编辑文章时,选择HTML模式下,插入[ code]代码内容[ /code],这样就可以简单实现了。(演示时在code有个空格,真正使用时不要空格)。比如我插入我的google adsense代码,只要输入:[ code]
[ /code],显示的结果:

<script type="text/javascript"><!--
google_ad_client = "pub-1542009170519644";
/* 468x15, 创建于 10-5-16 */
google_ad_slot = "2192312214";
google_ad_width = 468;
google_ad_height = 15;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

当然其实这只是实现了代码的输入,并没有起到高亮的效果,我们可以添加语言[ code lang="php"]代码[ /code](lang为语言种类,支持php,html,java,css等多种常用与不常用的语言)或者直接插入[ php]代码[ /php]即可,再次输入上面的代码,则显示如下:

<script type="text/javascript"><!--
google_ad_client = "pub-1542009170519644";
/* 468x15, 创建于 10-5-16 */
google_ad_slot = "2192312214";
google_ad_width = 468;
google_ad_height = 15;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

简单易懂吧,更多详细设置可以看后台的syntaxhighlighter设置,赶紧试试看吧。(再次提醒,演示时在code或php前有空格,实际操作时要去掉。)



【上篇】
【下篇】

目前有 32 条留言 其中:访客:31 条, 博主:0 条

  1. homely live : 2010年08月18日19:57:07  21楼

    很好 很强大 在用了 主要是用了之后 复制代码的效果太方便了

  2. 求索阁 : 2010年08月21日21:51:15  22楼

    那WordPress自带的那个html模式下的code标签,起啥作用?貌似不起作用吧


    • 管理员
      admin : 2010年08月21日21:54:16  地下1层

      那个 ❓ 没用过 应该是不行 要不也不会有这么多插件出现了 个人感觉这款插件还不错 设置也挺多的 可以根据自己的喜好及方便用户

  3. guobaa : 2012年02月01日16:14:23  23楼

    这个插件,==我试试!


如果觉得文章或者网站对您有帮助请点击 向TA付款 捐赠作者或者点击下面的分享按钮支持作者

更多

给我留言

留言无头像?

无觅相关文章插件,快速提升流量

×