文章目录[隐藏]
因为某些原因,更换代码插件到 WP-Syntax。据说这也是 WordPress 官方推荐的插件。特此记录一下折腾过程。
如何添加代码高亮
切换你的 WordPress 编辑器到 HTML 模式,使用以下格式添加代码:
<pre lang="Language" line="1" escaped="true" > </pre>
更换 WP-Syntax 代码样式
说真的,WP-Syntax 的 CSS 样式看起来比较难看,所以修改了一下,参考倡萌的修改方法,在你的主题的 style.css 文件中,添加以下代码:
.wp_syntax { color:#100; background-color:#f9f9f9; border:1px solid #EBEBEB; margin:0 0 1.5em 0; overflow:auto; } .wp_syntax { overflow-x:auto; overflow-y:hidden; padding-bottom:expression(this.scrollWidth > this.offsetWidth ? 15:0); width:99%; } .wp_syntax table { border:none; border-collapse:collapse; margin:0; padding:0; width:100% !important } .wp_syntax caption { padding:2px; width:100%; background-color:#def; text-align:left; font-family:Monaco; font-size:13px; line-height:20px; } .wp_syntax caption a { color:#1982d1; text-align:left; font-family:Monaco; font-size:13px; line-height:20px; text-decoration:none; } .wp_syntax caption a:hover { color:#1982d1; text-decoration:underline; } .wp_syntax div,.wp_syntax td { border:none; text-align:left; padding:0; vertical-align:top; } .wp_syntax td.code { background:none; line-height:normal; white-space:normal; padding-left:10px; } .wp_syntax pre { background:transparent; margin:0; padding:0; width:auto; float:none; clear:none; overflow:visible; font-family:Monaco; font-size:13px; line-height:20px; white-space:pre; } .wp_syntax td.line_numbers pre { border-right:3px solid #6CE26C; background-color:#E7E5DC; color:gray; width:20px; padding:0 5px; text-align:right; }
然后,在你主题的 Functions.php 中添加以下代码来禁用 WP-Symtax 插件的 CSS 样式代码。
<?php if ( has_action( 'wp_print_styles', 'wp_syntax_style' ) ) { remove_action( 'wp_print_styles', 'wp_syntax_style' ); }; ?>