现在的位置: 首页 > WordPress > 正文

WordPress代码高亮插件SyntaxHighlighter Evolved

2010年12月13日 WordPress ⁄ 共 1587字 ⁄ 字号 评论 26 条 ⁄ 阅读 10,011 次

中午有空的时候测试下WordPress代码高亮插件,测试了三四款插件,终于找到一款最好用的SyntaxHighlighter Evolved

只需要在后台插件里搜索SyntaxHighlighter Evolved,之后安装启用即可。

作者主页为:http://www.viper007bond.com/wordpress-plugins/syntaxhighlighter/

使用小结:

1.安装启用后,在SyntaxHighlighter设置中,选择Highlighter Version为Version 2.x

2.可以把“显示工具条”选项选中

3.使用中非常方便,只需要在文章中输入:[@php]你的代码[/php](用时请去掉@)

4.测试代码,显示效果如下。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"></pre>
</div>
<div id="_mcePaste"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"></div>
<div id="_mcePaste"><head></div>
<div id="_mcePaste"><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /></div>
<div id="_mcePaste"><title>PHP Code Example</title></div>
<div id="_mcePaste"></head></div>
<div id="_mcePaste"><body></div>
<div id="_mcePaste"><h1>PHP Code Example</h1></div>
<div id="_mcePaste"><p><?php echo 'Hello World!'; ?></p></div>
<div id="_mcePaste"><p>This line is highlighted.</p></div>
<div id="_mcePaste"><div></div>
<div id="_mcePaste">This	is	an</div>
<div id="_mcePaste">example	of	smart</div>
<div id="_mcePaste">tabs.</div>
<div id="_mcePaste"></div></div>
<div id="_mcePaste"><p><a href="http://wordpress.org/">WordPress</a></p></div>
<div id="_mcePaste"></body></div>
<div id="_mcePaste"></html>

PS:一些简码示例(用时请去掉@)

  • [@php]这里写你的代码[/php]
  • [@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]
  • [@code lang="js"]这里写你的代码[/code]
  • [@sourcecode language="plain"]这里写你的代码[/sourcecode]

目前有 26 条留言    访客:9 条, 博主:6 条 ,引用: 11 条

  1. 森云 2016年06月15日 13:23  @回复  Δ1楼 回复

    代码被转义了怎么办啊<这个符号转义成了&lt;

  2. 森云 2016年05月30日 13:52  @回复  Δ2楼 回复

    还没用这个插件

  3. 沫夏 2011年04月02日 17:02  @回复  Δ3楼 回复

    ok!使用了 :sad:

  4. 憨豆先生 2010年12月15日 05:51  @回复  Δ4楼 回复

    我承认..我还没有到这种境界. :cry:

  5. 80博客 2010年12月14日 17:05  @回复  Δ5楼 回复

    看效果挺不错的,哪天我也试试!


    • 管理员
      lovesoo 2010年12月14日 23:52  @回复  ∇地下1层 回复

      要是有代码的话 推荐用 :oops:

  6. 幸福月台 2010年12月14日 16:46  @回复  Δ6楼 回复

    很不错的插件哦 我也要试试


    • 管理员
      lovesoo 2010年12月14日 23:51  @回复  ∇地下1层 回复

      恩 试试吧 很不错滴 :shock:

  7. 王3峰 2010年12月14日 12:28  @回复  Δ7楼 回复

    你每天都发这么多的文章啊。


    • 管理员
      lovesoo 2010年12月14日 12:40  @回复  ∇地下1层 回复

      :idea: 不是的 看情况

  8. 思远博客 2010年12月13日 22:43  @回复  Δ8楼 回复

    :mrgreen: 你的博客用的是知更鸟的风格哈。做的不错。


    • 管理员
      lovesoo 2010年12月13日 22:44  @回复  ∇地下1层 回复

      新人 才开始学习 :wink:

  9. 爱新奇 2010年12月13日 22:40  @回复  Δ9楼 回复

    嗯 有空下来试试这个插件


    • 管理员
      lovesoo 2010年12月13日 22:45  @回复  ∇地下1层 回复

      :idea: 很好用地哦

外部的引用: 11 条

  • WordPress代码高亮插件SyntaxHighlighter Evolved | 懒人梦醒——梦新的独立博客
  • 几个美化WordPress的方法 | 依米虾
  • WordPress代码高亮插件SyntaxHighlighter使用方法详解 | BEN
  • 【转】WordPress代码高亮插件SyntaxHighlighter终极使用详解
  • WordPress代码高亮插件SyntaxHighlighter终极使用详解
  • 第一篇个人博客 | Will的小站
  • WordPress代码高亮插件SyntaxHighlighter终极使用详解 – SinoSky
  • WordPress代码高亮插件SyntaxHighlighter终极使用详解 | WordPress中文网
  • WordPress代码高亮插件SyntaxHighlighter终极使用详解 « Zhujunxi
  • WordPress代码高亮插件SyntaxHighlighter终极使用详解 | 晓的博客
  • WordPress代码高亮插件SyntaxHighlighter终极使用详解 | 六便士

给我留言

留言无头像?