网上要很多好看的代码高亮插件，很炫很好看；可我这人比较喜欢简单好看的不喜欢花花绿绿的
这里就分享一个免插件添加好看的灰底代码块的方法

一（修改code样式：

在你wp-content\themes\下找到你的主题文件夹并找到style.css文件
找到或添加如下代码
code {
background-color: #eee;
border-radius: 5px;
font-family: Consolas,Monaco,'Andale Mono',monospace;
font-size: 80%;
margin: 0 2px;
padding: 4px 5px;
vertical-align: middle;
}

#代码效果如上，比较适合在文字中添加部分代码

二（为code添加一个自定义快捷标签按钮

进去后台点击外观——>编辑找到模板函数文件functions.php #文件名以主题文件为主，部分主题会不一样
添加如下代码

//添加HTML编辑器自定义快捷标签按钮
add_action('after_wp_tiny_mce', 'add_button_mce');
function add_button_mce($mce_settings) {
?>
<script type="text/javascript">
    QTags.addButton( 'hr', 'hr', "<hr />", "" );
    QTags.addButton( 'h1', 'h1', "<h1>", "</h1>" );
    QTags.addButton( 'h2', 'h2', "<h2>", "</h2>" );
    QTags.addButton( 'h3', 'h3', "<h3>", "</h3>" );
    QTags.addButton( 'pre', 'pre', "<pre>", "</pre>" );
	  QTags.addButton( 'code', 'code', "<code>", "</code>" );
</script>
<?php
}