1 | 13295 Views 
一般我们用pre标签在WP来显示代码，但是如果每次都要手动输入pre标签又很麻烦，所以本文教你如何在文章编辑器添加<pre>自定义标签按钮。
复制以下代码到functions.php文件，位置加到文件最后一行在PHP的结束句符号?>之前就行，然后保存。
|
1 2 3 4 5 6 7 8 9 10 |
// catmee.com 添加HTML编辑器自定义标签按钮 add_action('admin_print_footer_scripts','eg_quicktags'); function eg_quicktags() { ?> <script type="text/javascript" charset="utf-8"> QTags.addButton( 'eg_pre', 'pre', '<pre>代码代码代码\n</pre>', '', 'q' ); </script> <?php } // 添加HTML编辑器自定义标签按钮结束 |
- 关于QTags.addButton参数的说明：QTags.addButton(按钮的ID, 要显示的按钮名称, 第一次点击按钮显示的内容, 第二次点击按钮显示的内容, 按钮的快捷调用名称)
写文章时需要用到pre标签时就切换到Text模式，然后点下标签按钮添加完整的pre标签，切换到Visual模式用你想显示的代码替换“代码代码代码”这几个字就好了。
（至于我为什么要留这几个字，是因为如果你直接在Text模式下替换代码可能会被系统当做执行代码运行了，所以就可能显示不出来你想显示的代码。留几个字在切换到Visual模式后就可以轻易找到并替换了。）
同样的方法你还可以加入更多的自定义标签按钮。比如我在用prettyprint代码高亮，所以可以写成：
|
1 |
QTags.addButton( 'eg_pre', 'pre', '<pre class="prettyprint linenums">代码代码代码\n</pre>', '', 'q' ); |
（关于免插件代码高亮参见《简单3步实现WordPress免插件代码高亮 | google-code-prettify代码高亮使用方法》）
参考文献：Quicktags API
使用的还是原生态的编辑器。
要是能够和自带的按钮一样按一下 pre 再按一下 /pre就更好了。