【WP】WordPress代码高亮插件Wp-SyntaxHighlighter | ICHARM

首页 » 博文 » Web » 正文

【WP】WordPress代码高亮插件Wp-SyntaxHighlighter

之前一直使用国人的Wp-syntax进行代码高亮。但是但是样式总是有点变形,于是决定换一个,这个是wordpress官方推荐的,所以试一下。

SyntaxHighlighter

需要注意的是这个插件全名为wp SyntaxHighlighter 而不是syntaxhighlighter evolved虽然两者基于同一个js而来,但是来时有点不同的。

 

效果预览

下面的效果基于Simple Code Highlighter插件,原插件已经不在使用。

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Syntax Highlighting Example</title>
</head>
<body style="width:500px">
	<h1>Syntax Highlighting Example</h1>
	<p><?php echo 'Hello World!' ?></p>
	<p>XHTML with PHP script.</p>
	<div class="tabs">
 			TAB	TAB		TAB	TAB
			TAB	TAB	TAB		TAB
		TAB		TAB		TAB	TAB
	<p>For 'Smart tabs'.</p>
	</div>

	<p>http://wordpress.org/</p>
</body>
</html>

 

SyntaxHighlighter简码参数表
参数名默认值作用支持
lang or language需要高亮的代码类型v2,v3
autolinkstrue是否自动将网址转换为链接。 默认转换。可以后台管理页面修改默认值。 示例:点击查看v2,v3
classname允许你添加一个或多个自定义的样式。 默认没有。可以后台管理页面修改默认值。 示例:点击查看v2,v3
collapsefalse是否默认折叠代码段。如果折叠,这需要一个“点击”操作,才能展开。非常适合有大段代码的文章。默认不折叠。可以后台管理页面修改默认值。 示例:点击查看v2,v3
firstline1设置起始行的行号。 示例:点击查看v2,v3
guttertrue是否显示行号。默认显示。可以后台管理页面修改默认值。示例:点击查看v2,v3
highlight需要高亮显示并使用逗号分隔的行号。同时,也支持区间(开始行号-结束行号)。例如:2,5-10,12。示例:点击查看v2,v3
htmlscript是否高亮显示功能任何额外的HTML / XML。特别适合混合HTML/XML与另一种语言混合的情况下。如在HTML代码中含有部分PHP代码。注意,这仅仅适用于特定的语言。示例:点击查看v2,v3
lightfalse是否显示高亮模式。默认是关闭。可以后台管理页面修改默认值。示例:v2,v3
padlinenumbersfalse设置行号的格式化,前面是否补零。默认是关闭。可以后台管理页面修改默认值。v2,v3
title设置文本的标题。默认没有。可以后台管理页面修改默认值。v2,v3
toolbarfalseToggle the toolbar (buttons in v2, the about question mark in v3) 默认不显示。可以后台管理页面修改默认值。示例:点击查看v2,v3
wraplinesfalse是否开启自动换行。可以后台管理页面修改默认值。v2,v3
smarttabstrue智能制表符。示例:点击查看v2,v3
tabsize4制表符的长度。示例:点击查看v2,v3

使用方法

插件安装好,启用后可以在编辑框里看到快捷按钮:

 

 

wp-syntaxhighlighter0160114175625

在弹出的控件里贴上代码,再也不用进入html编辑模式手写高亮代码了,哈哈

发表评论