打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
SyntaxHighlighter使用介绍 | 代码至上

SyntaxHighlighter使用介绍

2011年4月19日  964 views 发表评论 阅读评论
我的博客中使用了WordPress的插件 SyntaxHighlighter 这是一个代码高亮、模式化的工具,能让你的代码在网页上以类似IDE编辑器里的样子高亮关键字。功能挺强的,支持的语言很多,我列在下面了。在文章的最后,我将SyntaxHighlighter自带帮助文档列了出来,并稍微翻译了一下。
具体用法:
  1. 在代码前根据代码语言的不同加上不同的[%Lang]在代码后加上[/%Lang],%Lang = 你用的语言对应的Brush aliases(具体对应罗列于下)。例如[@cpp]#include <stdio.h>[/cpp](@去掉)。
  2. 或者只用一次%Lang,[@code lang=%Lang]你的代码[/code]或者[@source lang=%Lang]你的代码[@source lang=%Lang],其中lang都可以换成language。

点击Brush name 有官方网站的详细介绍和Demo,有兴趣的童鞋可以去看看。对于技术类的博客来说,这种语法高亮插件是必不可少的欧~

Brush nameBrush aliasesFile name
ActionScript3as3, actionscript3shBrushAS3.js
Bash/shellbash, shellshBrushBash.js
ColdFusioncf, coldfusionshBrushColdFusion.js
C#c-sharp, csharpshBrushCSharp.js
C++cpp, cshBrushCpp.js
CSScssshBrushCss.js
Delphidelphi, pas, pascalshBrushDelphi.js
Diffdiff, patchshBrushDiff.js
Erlangerl, erlangshBrushErlang.js
GroovygroovyshBrushGroovy.js
JavaScriptjs, jscript, javascriptshBrushJScript.js
JavajavashBrushJava.js
JavaFXjfx, javafxshBrushJavaFX.js
Perlperl, plshBrushPerl.js
PHPphpshBrushPhp.js
Plain Textplain, textshBrushPlain.js
PowerShellps, powershellshBrushPowerShell.js
Pythonpy, pythonshBrushPython.js
Rubyrails, ror, rubyshBrushRuby.js
ScalascalashBrushScala.js
SQLsqlshBrushSql.js
Visual Basicvb, vbnetshBrushVb.js
XMLxml, xhtml, xslt, html, xhtmlshBrushXml.js

简码参数

这些参数你能够设置在简码中。对于布尔值(即 on/off),使用 true/1 或者 false/0。

lang or language — The language syntax to highlight with. You can alternately just use that as the tag, such as [@php]code[/php]. (代码语言)
autolinks — Toggle automatic URL linking.(将URL自动转换成链接)
classname — Add an additional CSS class to the code box.(加载额外CSS控制)
collapse — Toggle collapsing the code box by default, requiring a click to expand it. Good for large code posts.(收缩代码框,对于大量代码很有用)
firstline — An interger specifying what number the first line should be (for the line numbering).(首行号)
gutter — Toggle the left-side line numbering.(是否显示左侧行号)
highlight — A comma-sperated list of line numbers to highlight. You can also specify a range. Example: 2,5-10,12(高亮行号)
htmlscript — Toggle highlighting any extra HTML/XML. Good for when you're mixing HTML/XML with another language, such as having PHP inside an HTML web page. The above preview has it enabled for example. This only works with certain languages.(不清楚)
light — Toggle light mode which disables the gutter and toolbar all at once.(不显示行号和工具条)
padlinenumbers — Controls line number padding. Valid values are false (no padding), true (automatic padding), or an integer (forced padding).(控制行号行间距)
title (v3 only) — Sets some text to show up before the code. Very useful when combined with the collapse parameter.
toolbar — Toggle the toolbar (buttons in v2, the about question mark in v3)(标题,显示在代码前)
wraplines (v2 only) — Toggle line wrapping.(自动换行)
一些简码示例

[@php]这里写你的代码[/php]

1
这里写你的代码

[@css autolinks="false" classname="myclass" collapse="false" firstline="1" gutter="true" highlight="1-3,6,9" htmlscript="false" light="false" padlinenumbers="false" smarttabs="true" tabsize="4" toolbar="true" title="example-filename.php"]这里写你的代码[/css]

example-filename.php
1
这里写你的代码

[@code lang="js"]这里写你的代码[/code]

1
这里写你的代码

[@sourcecode language="plain"]这里写你的代码[/sourcecode]

1
这里写你的代码
?

声明:未作说明,则本文为代码至上原创。转载务必注明出处
注意:转载须保留全文,如需修改请 联系作者
本文永久地址:http://codeup.org/archives/128

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
ckeditor
高亮显示代码syntaxhighlighter
来自 Google 的代码高亮工具 Syntaxhighlighter_2.1.364
15 款代码语法高亮工具,美化你的代码
在 WordPress 的 HTML 编辑界面中添加 SyntaxHighlighter 按钮
3款WordPress代码高亮插件推荐与点评 | WordPress教程网
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服