次のエントリ: Pukiwikiのソースコードハイライトプラグインおぼえがき [PHP]
SyntaxHighlighterでハイライト
2011-01-18-1 / カテゴリ: [JavaScript][chalow] / [permlink]
(ついでにchalowを1.0rc6から1.0へVerUpしてxhtmlできるだけ対応して1エントリ1ページ形式へ変更、とか)
ASCII.jp : 技術系サイトに必需品！ソースコードは鮮やかに
など。
プログラミング系のブログなどでコードがハイライトされてるのをずっとカッコイイなーと思ってて、最近pukiwikiのコードハイライトをちょっとイジったときにほしい物にたどり着いたので組み込んでみた。
適用したのはSyntaxHighlighter 3.0.83。
といってもやることは zip の中の scripts, styles を見えるところに配置して、ハイライトしたいhtmlの<head>内で
plainにすると、キーワードハイライトなんかは効かないけど、<head>で指定する scripts/shBrushXxxx.js を都度追加＆<pre>のclass指定を対応させれば、言語別のキーワードハイライトが動作する。
diffなんかもあるのが地味に嬉しい。
まだSyntaxHighlighterを組み込んだだけで、パーサ側はイジってないので、Changelog→chalowの言語種類指定機能はない;
■todo
chalowへの言語指定機能組み込み＆データソースのChangelogの修正(メンドそうだ…)
検索のページ未着手
スタイルもうちょっと変える？
アップデート装置(ファイルが倍近く増えたのでローカルでhtml作ってtarで固めてサーバに上げよう…かな)
<a>タグのid/nameを一致させ、古いURLの YYYYmmdd.html#YYYYmmdd-x をmod_rewriteあたりで新URL(YYYYmmdd-x.html)へ誘導
ただし予定は未定。
ASCII.jp : 技術系サイトに必需品！ソースコードは鮮やかに
など。
プログラミング系のブログなどでコードがハイライトされてるのをずっとカッコイイなーと思ってて、最近pukiwikiのコードハイライトをちょっとイジったときにほしい物にたどり着いたので組み込んでみた。
適用したのはSyntaxHighlighter 3.0.83。
といってもやることは zip の中の scripts, styles を見えるところに配置して、ハイライトしたいhtmlの<head>内で
<script type="text/javascript" src="scripts/shCore.js"></script>
<script type="text/javascript" src="scripts/shBrushPlain.js"></script>
<link type="text/css" rel="stylesheet" href="styles/shCore.css"/>
<link type="text/css" rel="stylesheet" href="styles/shThemeDefault.css"/>
<script type="text/javascript">
SyntaxHighlighter.all();
SyntaxHighlighter.config.tagName = "pre";
</script>
など定義しておき、ハイライト対象部分(<pre>タグで)で<pre class="brush:plain;"> コード </pre>とする。(Brushはダメ。小文字で)
plainにすると、キーワードハイライトなんかは効かないけど、<head>で指定する scripts/shBrushXxxx.js を都度追加＆<pre>のclass指定を対応させれば、言語別のキーワードハイライトが動作する。
<script type="text/javascript" src="scripts/shBrushPerl.js"></script> : <pre class="brush:perl;"> #!/usr/bin/perl exit 0; </pre>など。
diffなんかもあるのが地味に嬉しい。
まだSyntaxHighlighterを組み込んだだけで、パーサ側はイジってないので、Changelog→chalowの言語種類指定機能はない;
■todo
chalowへの言語指定機能組み込み＆データソースのChangelogの修正(メンドそうだ…)
検索のページ未着手
スタイルもうちょっと変える？
アップデート装置(ファイルが倍近く増えたのでローカルでhtml作ってtarで固めてサーバに上げよう…かな)
<a>タグのid/nameを一致させ、古いURLの YYYYmmdd.html#YYYYmmdd-x をmod_rewriteあたりで新URL(YYYYmmdd-x.html)へ誘導
ただし予定は未定。
Referrer (Inside):
[2011-01-20-1]
[
コメント ]
次のエントリ: Pukiwikiのソースコードハイライトプラグインおぼえがき [PHP]
2013 : 01 02 03 04 05 06 07 08 09 10 11 12
2012 : 01 02 03 04 05 06 07 08 09 10 11 12
2011 : 01 02 03 04 05 06 07 08 09 10 11 12
2010 : 01 02 03 04 05 06 07 08 09 10 11 12
2009 : 01 02 03 04 05 06 07 08 09 10 11 12
2008 : 01 02 03 04 05 06 07 08 09 10 11 12
2007 : 01 02 03 04 05 06 07 08 09 10 11 12
2006 : 01 02 03 04 05 06 07 08 09 10 11 12
2005 : 01 02 03 04 05 06 07 08 09 10 11 12
2004 : 01 02 03 04 05 06 07 08 09 10 11 12
最終更新時間: 2013-05-02 16:12
