WordPress代码高亮插件WP-Syntax使用及优化

WordPress自带的Code代码显示太弱了,如果代码之前隔一个空白行,就会分开来显示。为此,特地找了个高亮代码显示插件。找了两个插件,一个是WP-Syntax,196793次下载;另外一个是WP-CodeBox,只有94292,最后采用了WP-Syntax。

WP-Syntax确实不错,使用geshi语法引擎,很是方便,但因为没有横向比较,也说不出具体好在哪里。这里就大概介绍下吧:

一、安装

WordPress后台-插件-安装新的插件-搜索“WP-Syntax”,点击安装;或到官方下载,上传至“wp-content/plugins/”内,然后开启。

二、使用

编辑文章时,选择HTML模式下,插入

(pre lang=”LANGUAGE” line=”1“)这里是你要放置的代码。。。(/pre)
(把圆括号换成方括号即可)

其中lang=””内为高亮代码的种类,较常用的有php、css和javascript,当然WP-Syntax可以支持更多,具体如下:

abap, actionscript, actionscript3, ada, apache, applescript, aptsources, asm, asp, autoit, avisynth, bash, bf, blitzbasic, bnf, boo, c, cmac, caddcl, cadlisp, cil, cfdg, cfm, cobol, cpp-qt, cpp, csharp, css, d, dcs, delphi, diff, div, dos, dot, eiffel, email, fortran, freebasic, genero, gettext, glsl, gml, bnuplot, groovy, haskell, hq9plus, html4strict, idl, ini, inno, intercal, io, java, java5, javascript, kixtart, klonec, klonecpp, latex, lisp, locobasic, lolcode lotusformulas, lotusscript, lscript, lsl2, lua, m68k, make, matlab, mirc, modula3, mpasm, mxml, mysql, nsis, oberon2, objc, ocaml-brief, ocaml, oobas, oracle11, oracle8, pascal, per, pic16, pixelbender, perl, php-brief, php, plsql, povray, powershell, progress, prolog, providex, python, qbasic, rails, rebol, reg, robots, ruby, sas, scala, scheme, scilab, sdlbasic, smalltalk, smarty, sql, tcl, teraterm, text, thinbasic, tsql, typoscript, vb, vbnet, verilog, vhdl, vim, visualfoxpro, visualprolog, whitespace, winbatch, xml, xorg_conf, xpp, z80
注:(LANGUAGE属性,黑体字显示的是比较流行的代码)

line=””是显示行号。比如 line=”1″的意思是从行号1开始显示,可以自己修改起始行号。如果不想显示行号,去掉 line=”1″ 这个属性即可。

三、优化

1、修改默认显示字体:打开“wp-syntax/geshi/geshi.php”,找到如下语句,修改“monospace”为想要的字体:

我修改成

2、修改代码字体的大小。打开 “wp-syntax.css” ,把 “.wp_syntax pre” 里面的 “font-size” 修改为你想要的大小即可。

3、修改某种语言的高亮规则。在 “wp-syntax/geshi/geshi” 里找到你要修改的”语言.php”,可以参考网上教程改哈。

我重新修改了原来的样式,打开“wp-syntax/wp-syntax.css”,原来的清空然后添加:

4、在后台添加WP-Syntax代码按键
后台编辑器中添加按钮,可以很方便的插入代码,但是需要修改“wp-includes/js/quicktags.js”。本人没有亲自操作,而且原来作者提供的修改文件过于旧了,毕竟现在WordPress是3.3.2的版本了。具体使用方法及代码详情见 http://ons.me/129.html

5、提高速度
因为WP-Syntax插件”/wp-syntax/geshi/geshi/”文件下含有过多的语言php文件,影响了博客的加载速度,建议保留常用的一些语言,其它都可以去掉即可。

友情提示:WP-Syntax代码高亮的效果必须在代码编辑器里面编辑,粘贴的代码一定要在代码编辑器里面,不要在代码和可视化之间来回切换,因为由“HTML”进入“可视化”部分代码会被WordPress自动转换,这样会出现错误。

子痕

男人分四种,一种聪明,一种英俊,一种不聪明也不英俊,我是第四种。

You may also like...

11 Responses

  1. 久酷说道:

    我也是一直用的这款插件

  2. 子痕说道:

    @久酷 这款插件是蛮好的,比coolcode改代码要好一点的~

  3. sky!0ooo说道:

    但这款插件有一点不好,就是在订阅源中没法实现高亮。一直在寻找解决方法。

  4. 谢单单说道:

    好像是还不错….

  5. Kaedeen说道:

    蛮不错,这个是我见过最详细的教程了

  6. 杨尚斌说道:

    我的很小啊,随着代码改变大小,怎么改动啊

发表评论

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