如何在WORDPRESS中使代码高亮

09年05月07日

　　今天决定在自己博客里加上代码高亮。毕竟是技术类博客嘛，要展示代码的地方很多。比较了几款代码高亮插件后，决定使用Syntax Highlighter，也就是Google Syntax Highlighter for WordPress。 一款帮助开发者/coder 发表代码片段更加简单和漂亮的插件，完全基于Javascript。下面是我安装Syntax Highlighter的步骤，可能不是最好的，但是的确可用的。

１.到GoogleCode下载Syntax Highlighter。

２.解压后上传到服务器wp-content/下，这就已经可以使用了。

　　在Wordpress写文章时，在“HTML编辑”状态下写，将代码用<pre name=”code” class=”php”></pre>包起，当然要把php换成源码的语言名，下面是Syntax Highlighter支持的语言和对应该处语言名可以使用的的写法：

Language Aliases
C++ cpp, c, c++
C# c#, c-sharp, csharp
CSS css
Delphi delphi, pascal
Java java
Java Script js, jscript, javascript
PHP php
Python py, python
Ruby rb, ruby, rails, ror
Sql sql
VB vb, vb.net
XML/HTML xml, html, xhtml, xslt

举例：
<pre name=”code” class=”php”>
<?
//插入PHP源码
$a=5;
$a++;
echo $a;
?>
</pre>

　　最后，在文章的末尾插入
<link type=”text/css” rel=”stylesheet” href=”../../wp-content/dp.SyntaxHighlighter/Styles/SyntaxHighlighter.css”></link>
<script language=”javascript” src=”../../wp-content/dp.SyntaxHighlighter/Scripts/shCore.js”></script>
<script language=”javascript” src=”../../wp-content/dp.SyntaxHighlighter/Scripts/shBrushPhp.js“></script>
<script language=”javascript”>
dp.SyntaxHighlighter.ClipboardSwf =’../../wp-content/dp.SyntaxHighlighter/Scripts/clipboard.swf’;
dp.SyntaxHighlighter.HighlightAll(’code’);
</script>

　　红色部分要换成相应语言对应的文件名，具体是什么文件名，请查看dp.SyntaxHighlighter/Scripts/文件夹下的文件。

 

　　本文只介绍了SyntaxHighlighter的最简单应用，它的强大功能远不止这些，要了解的请到GoogleCode的Syntax Highlighter Wiki.





相关文章:

  1. CSS对IE7，IE6，FireFox和其它不同浏览器的控制(转)
  2. Java模版引擎：Velocity 和 FreeMarker 孰优孰劣
  3. 通过java.net.URL类抓取某个网页的内容
  4. 初学者如何学习J2SE直到J2EE相关进阶视频点评
  5. 一个程序员的多年珍藏(1月23日最新更新)


  • 原文链接: http://www.astesys.com/website/wordpress/274.html
  • 转载文章请注明: 爱思特
    • Tags: , 分类: WordPress
    【上篇】
    【下篇】

    [如何在WORDPRESS中使代码高亮]共有：2 条评论

  • 老张 : 10年04月24日 at 3:37 下午

    你确定你这样可以？为什么我照着上面的做了但是不成？

  • 一心而已 : 10年05月10日 at 9:50 上午

    可以安装一个wordpress的加强型的编辑器，就有高亮代码了

    • 发表评论