Learning together

我们写文章的时候，需要插入代码，通常这些代码都是和其它文本一个颜色，容易产生混淆。为了避免这种情况发生，就产生了代码高亮插件。但插件太多终纠不好，能不能不用代码高亮插件就能使文本高亮呢？
下面就看我是如何实现的。
其实原理很简单，把代码加入一个span里面，然后在CSS里面定义一下这个span的样式，就行了。
具体操作如下：
修改你对应主题里面的style.css文件，找到这一行：
.s-hui b.top b,.s-hui b.bottom b{background:#f4f4f4;}
在下面加入以下代码：
.mycode{position:relative;width:585px;height:auto;z-index:auto;font-size: 13px;color: #00ff00;background-color: #2E2E2E;text-align: left;display: inline;margin: auto;clear: none;border: thin inset #FFFFFF;visibility: inherit;float: left;}

然后在文章里要加入代码的地方在html模式下插入< span class=”mycode” >您的代码< /span >就可以了！
是不是很方便啊?如果你觉得这也还不方便，要是能加到wordpress文章编辑器上面的常用按钮中对不就更方便了吗？
OK，没有问题，下面来看如何实现！（在HTML模式下才有该按钮）
找到\wp-includes\js\quicktags.js这个文件
在
edButtons[edButtons.length]=new edButton(“ed_code”,”code”,”",”",”c”);
这个的后面加入
edButtons[edButtons.length]=new edButton(“ed_mycode”,”mycode”,”< span class=’mycode’ >”,”< /span >”,”z”);
为了让代码显示，上面的”<”后与”>”前我都加了空格，使用中，去掉就OK了。
现在可以进入后台，看看在文章编辑的窗口上面多了一个”mycode”按钮。
哈哈，这个功能完全实现了！！

Technorati : code, css, 代码, 高亮
Del.icio.us : code, css, 代码, 高亮
Zooomr : code, css, 代码, 高亮
Flickr : code, css, 代码, 高亮

相关文章

• 2010年02月21日 -- vsftpd官方faq翻译(中文版)+常见FTP错误代码