為了實(shí)現(xiàn)代碼高亮,之前找了很多插件,但是效果都不是很理想。經(jīng)過(guò)研究終于找到一個(gè)完美的解決方案,這個(gè)解決方案具有如下優(yōu)點(diǎn):
- 代碼簡(jiǎn)潔,用pre>標(biāo)簽實(shí)現(xiàn)代碼高亮,不會(huì)生成太多Html標(biāo)簽。
- 支持多種語(yǔ)言,包括c#,c++,php,python等10多種語(yǔ)言。
- 擴(kuò)充方便,可以通過(guò)簡(jiǎn)單二次開(kāi)發(fā)實(shí)現(xiàn)對(duì)其它語(yǔ)言的支持。
- 使用方便,把代碼復(fù)制到代碼高亮轉(zhuǎn)換窗口即可。
下面一步步介紹如何配置WLW+wordpress的代碼高亮解決方案:
1.準(zhǔn)備工作:
下載 precode code snippet manager
下載成功后得到一個(gè)名為PreCodePlugin_4.0.2.msi的文件
下載 SyntaxHighlighter2.0
下載成功后得到一個(gè)名為syntaxhighlighter_2.0.296.zip文件。
2.安裝:
關(guān)閉Windows Live Writer,安裝PreCodePlugin_4.0.2.msi。安裝成功后啟動(dòng)WLW,此時(shí)在插件列表里應(yīng)該出現(xiàn)一項(xiàng)名為PreCode Snippet的插件。
將syntaxhighlighter_2.0.296.zip解壓縮至wordpress的活動(dòng)主題目錄,例如:\www\wp\wp-content\themes\lutuzhi\syntaxhighlighter
3.在header.php 中,在meta http-equiv="Content-Type" content="?php bloginfo('html_type'); ?>; charset=?php bloginfo('charset'); ?>" />下方添加:
復(fù)制代碼 代碼如下:
script type="text/javascript" src="scripts/shCore.js">/script>
02.script type="text/javascript" src="scripts/shBrushBash.js">/script>
03.script type="text/javascript" src="scripts/shBrushCpp.js">/script>
04.script type="text/javascript" src="scripts/shBrushCSharp.js">/script>
05.script type="text/javascript" src="scripts/shBrushCss.js">/script>
06.script type="text/javascript" src="scripts/shBrushDelphi.js">/script>
07.script type="text/javascript" src="scripts/shBrushDiff.js">/script>
08.script type="text/javascript" src="scripts/shBrushGroovy.js">/script>
09.script type="text/javascript" src="scripts/shBrushJava.js">/script>
10.script type="text/javascript" src="scripts/shBrushJScript.js">/script>
11.script type="text/javascript" src="scripts/shBrushPhp.js">/script>
12.script type="text/javascript" src="scripts/shBrushPlain.js">/script>
13.script type="text/javascript" src="scripts/shBrushPython.js">/script>
14.script type="text/javascript" src="scripts/shBrushRuby.js">/script>
15.script type="text/javascript" src="scripts/shBrushScala.js">/script>
16.script type="text/javascript" src="scripts/shBrushSql.js">/script>
17.script type="text/javascript" src="scripts/shBrushVb.js">/script>
18.script type="text/javascript" src="scripts/shBrushXml.js">/script>
19.link href="styles/shCore.css" type="text/css" rel="stylesheet" />
20.link href="styles/shThemeEmacs.css" type="text/css" rel="stylesheet" />
21.script type="text/javascript">SyntaxHighlighter.config.clipboardSwf = 'scripts/clipboard.swf';SyntaxHighlighter.all();/script>
如此配置之后,通過(guò)Windows Live Writer插入的代碼,在wordpress中可以十分優(yōu)雅的顯示出來(lái)。
您可能感興趣的文章:- jquery(live)中File input的change方法只起一次作用的解決辦法
- jQuery的.live()和.die() 使用介紹
- jQuery中的.bind()、.live()和.delegate()之間區(qū)別分析
- JQuery live函數(shù)
- JQuery下的Live方法和$.browser方法使用代碼
- jQuery live( type, fn ) 委派事件實(shí)現(xiàn)
- jQuery live
- jQuery中l(wèi)ive方法的重復(fù)綁定說(shuō)明