WP-Syntax插件官方下载地址：点我。
一、菜鸟型：
下载好插件上传到wp-content/plugins下面，相信大家都会，然后启动该插件。
写文章需要贴代码时，请切换到“HTML”模式下面，代码格式【<pre lang=’代码语言’ line=’1′>这里贴代码</pre>】。代码语言有很多，比如说最常见的html,php,css,javascript等，官方有详细介绍：点我。line=’1’的意思是代码前面的数字，如果不想要数字，直接不写这个就OK。但是此款插件不支持从“HTML”模式下切换到“可视化”，不然代码都会运行，所以建议大家先写完文字和图片，最后切换到“HTML”模式下来贴代码。
二、臭美型：
当然，如果你不喜欢代码的默认样式，你可以自己DIY。
修改字体方法：wp-syntax/geshi/geshi.php里面第442行，我改了默认字体，你喜欢什么字体也可以自己修改。
var $overall_style = 'font-family:monospace;';
修改默认样式方法：wp-syntax/wp-syntax.css，里面的所有CSS样式都可以删掉重写，我就改了一项而已，就是代码距上下的间距，自己感觉更舒服吧。
margin: 1em 0;
三、偷懒型：
每次写代码的时候，需要手动加【<pre lang=’代码语言’ line=’1′>这里贴代码</pre>】是不是感觉很累？其实可以在“HTML”模式下加上几个按钮来替换手动写代码。
使用方法和其他按钮一样，自己去试试就知道，下面我简单说下如何实现：（记得备份哦）
注：因为在 pre 标签里再贴 pre 标签就会出问题，所以请将代码中的 p0re 替换为 pre，一段代码有两处。
首先是面板上加按钮的方法，在wp-includes/js/quicktags.js文件，找到
edButtons[edButtons.length]=new edButton("ed_code","code","<code>","</code>","c");
在后面加上
edButtons[edButtons.length]=
new edButton("ed_pre_html","pre_html","<p0re lang='html'>\n","\n</p0re>","p",-1);
edButtons[edButtons.length]=
new edButton("ed_pre_php","pre_php","<p0re lang='php'>\n","\n</p0re>","pp",-1);
edButtons[edButtons.length]=
new edButton("ed_pre_css","pre_css","<p0re lang='css'>\n","\n</p0re>","ppp",-1);
edButtons[edButtons.length]=
new edButton("ed_pre_js","pre_js","<p0re lang='JavaScript'>\n","\n</p0re>","pppp",-1);
一段代码就是一个按钮，我加了四个按钮：html、php、css、javascript，当然，你喜欢加几个也可以适当的加减。（后来才知道WP-Syntax不支持html代码变色，不过也无所谓了）
然后是加按钮的点击的操作，找到
j.Buttons[j.Buttons.length]=new edButton(a+"_code","code","<code>","</code>","c");
在后面加上
j.Buttons[j.Buttons.length]= new edButton(a+"_pre_html","pre_html","<p0re lang='html'>\n","\n</p0re>","p",-1); j.Buttons[j.Buttons.length]= new edButton(a+"_pre_php","pre_php","<p0re lang='php'>\n","\n</p0re>","pp",-1); j.Buttons[j.Buttons.length]= new edButton(a+"_pre_css","pre_css","<p0re lang='css'>\n","\n</p0re>","ppp",-1); j.Buttons[j.Buttons.length]= new edButton(a+"_pre_js","pre_js","<p0re lang='JavaScript'>\n","\n</p0re>","pppp",-1);
这样就大功告成了，不过此时你看你后台编辑的时候，或许看不见这几个按钮，记得点下刷新哦！
提供WordPress2.92懒人代码，直接下载quicktags.js文件覆盖即可，点我下载。
转载请注明：江海志の博客 » DIY代码美化插件WP-Syntax配合编辑器使用教程