代码高亮插件很多,孰好孰坏也不是木木说了算,今就推荐俺在使用的:WP-Syntax

一、基础使用:

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

2.使用:编辑文章时,选择HTML模式下,插入

<pre lang='LANGUAGE' line='1'> This is code! </pre> (引号为半角!代码高亮插件高亮不来自己的代码,杯具……)

其中lang=''内为高亮代码的种类,我较常用的php、css和javascript都支持,当然WP-Syntax支持可不止这些(更多);line=''内的数值是行数,可删可留。

至此,插件就已经可以完全正常使用了!下面还是来一些折腾:

二、进阶折腾:

1.修改默认显示字体:打开“wp-syntax/geshi/geshi.php”,修改“monospace”为想要的字体:

  1.  
  2.     var $overall_style = 'font-family:monospace;';

2.调整默认样式表:打开“wp-syntax/wp-syntax.css”,清空然后添加:

 
.wp_syntax {color:#100;background-color: #f9f9f9;margin:1em;overflow:auto;}
 
.wp_syntax table{border-collapse: collapse;}
 
.wp_syntax div, .wp_syntax td {vertical-align: top;padding: 2px 4px;}
 
.wp_syntax .line_numbers {text-align: right;background-color: #def;color: gray;overflow: visible;}
 
.wp_syntax pre{font-size:12px;margin:0;width:auto;float:none;clear:none;overflow:visible;word-wrap:break-word;line-height:1.5;white-space:pre;}

3.为了优化我们也可以把样式合并到主题style.css中,打开“wp-syntax/wp-syntax.php”

  1.  
  2. //add_action('wp_head', 'wp_syntax_head');

在159行前加上“//”,取消加载插件自带的样式,然后把CSS样式写进主题style.css中保存即可!

4.后台编辑器中添加按钮,下载 quicktags2-9.7z,解压后替换“wp-includes/js/quicktags.js”即可。具体使用方法及代码详情见 http://www.evlos.org/2009/12/22/add-syntax-button-to-edit/

好了,就是这些!以后插入代码可就方便咯,另提醒:插入代码后不要随便切换编辑模式,因为由“HTML”进入“可视化”部分代码会被WordPress自动转换!

最后,祝大家都过个幸福的圣诞节!