事先聲明,本文純屬個人筆記,老鳥請無視!
再則,關於WP-Syntax的教程網上多如牛毛,基本上大同小異。只是最近看木木的空間比較多,發現他那篇教程相對全面,索性直接抄來的備用。原文地址:http://immmmm.com/wordpress-plugins-wp-syntax.html
一、基础使用:
1.安装:后台-插件-安装新的插件-搜索“WP-Syntax”,点击安装;或到官方下载,上传至“wp-content/plugins/”内,然后开启。
2.使用:编辑文章时,选择HTML模式下,插入
<pre lang=’LANGUAGE’ line=’1′> This is code! </pre> (引号为半角!代码高亮插件高亮不来自己的代码,杯具……)
其中lang=”内为高亮代码的种类,我较常用的php、css和javascript都支持,当然WP-Syntax支持可不止这些(更多);line=”内的数值是行数,可删可留。
至此,插件就已经可以完全正常使用了!下面还是来一些折腾:
二、进阶折腾:
- 1.修改默认显示字体:打开“wp-syntax/geshi/geshi.php”,修改“monospace”为想要的字体:(秦大少:我这用的是arial字体)
var $overall_style = 'font-family:monospace;';
- 2.调整默认样式表:打开“wp-syntax/wp-syntax.css”,清空然后添加:
.wp_syntax {color:#100;background-color: #f9f9f9;margin:1em;overflow:auto;} .wp_syntax table{border-collapse: collapse;} .wp_syntax div, .wp_syntax td {vertical-align: top;padding: 2px 4px;} .wp_syntax .line_numbers {text-align: right;background-color: #def;color: gray;overflow: visible;} .wp_syntax pre{font-size:12px;margin:0;width:auto;float:none;clear:none;overflow:visible;word-wrap:break-word;line-height:1.5;white-space:pre;}
- 3.为了优化我们也可以把样式合并到主题style.css中,打开“wp-syntax/wp-syntax.php”
//add_action('wp_head', 'wp_syntax_head');在159行前加上“//”,取消加载插件自带的样式,然后把CSS样式写进主题style.css中保存即可!
- 4.后台编辑器中添加按钮,
下载 quicktags2-9.7z(2017.08.17:链接已失效),解压后替换“wp-includes/js/quicktags.js”即可。具体使用方法及代码详情见 http://www.evlos.org/2009/12/22/add-syntax-button-to-edit/(2017.08.17:链接已失效)好了,就是这些!以后插入代码可就方便咯,另提醒:插入代码后不要随便切换编辑模式,因为由“HTML”进入“可视化”部分代码会被WordPress自动转换!