2007年08月31日
LSL色付けツール
※ Jvn Writerさんが、高機能版のLSL 色付けツール２をリリースされているので、そちらを使用することをオススメします。
※ 必ず追記部分も読んでからご使用ください。
ツールといっても、SyntaxHighlighterという、フリーのシンタックスハイライトツールの、LSLプラグインを作っただけです。
必ず最後の注意書きを読んでから導入してください。
shBrushLsl.js
導入方法
1.ダウンロード
ここから、syntaxhighlighter_1.5.1本体をダウンロードします。次に、shBrushLsl.jsをこのリンクの右クリックメニューから保存します。
2.ファイルをWebサーバへ配置
ダウンロードが済んだら、shBrushLsl.jsと、syntaxhighlighter本体の以下のファイルを、無料ホームページスペースなどにアップロードします。
・dp.SyntaxHighlighter\Scripts\shCore.js
・dp.SyntaxHighlighter\Scripts\clipboard.swf
・dp.SyntaxHighlighter\Styles\SyntaxHighlighter.css
3.ブログテンプレートを修正
ブログ管理画面 → ブログの設定 → テンプレート → カスタマイズ と辿って、「トップページ、個別記事、アーカイブ」の各テンプレートheadに、以下を追加します。○○○は、アップロードしたファイルのパスに置き換えてください。
<head>
・・・
・・・
<!-- ▼追加部分▼ -->
<link type="text/css" rel="stylesheet" href="http://○○○/SyntaxHighlighter.css" />
<script language="javascript" src="http://○○○/shCore.js"></script>
<script language="javascript" src="http://○○○/shBrushLsl.js"></script>
<script language="javascript">
window.onload = function () {
dp.SyntaxHighlighter.ClipboardSwf = 'http://○○○/clipboard.swf';
dp.SyntaxHighlighter.HighlightAll('code');
}
</script>
<!-- ▲追加部分▲ -->
</head>
4.LSLを含んだ記事を書く
LSLは、<pre>または<textarea>の中に書き、name属性に「code」、class属性に「lsl」とセットすれば色分けされます。
<pre name="code" class="lsl">
default
{
state_entry()
{
llSay(0, "Hello, SL World!");
}
}
</pre>
↓
default
{
state_entry()
{
llSay(0, "Hello, SL World!");
}
}
あれ、<br />が入ってしまいました（今は修正版を使ってるので入ってません）。ブログ環境設定で、改行を<br />に変換する設定にしておくと、このようなことになってしまいます。でも、変換しない設定にすると、今まで書いてきた記事を直さないといけないみたいです。
詰んだ・・・orz と思わせておいて、俺が華麗に解決＼(^o^)／
改行を実体参照の「 」に変換すればいいのです。よく分からない人は、「 」は改行を文字で表したようなものだと思ってください。私はフリーのサクラエディタで、以下のように変換してます。
1.メニューから置換を選択
2.正規表現にチェック
3.置換前に、\r\nと入力
4.置換後に、 と入力
5.すべて置換を押す
改行が置換されて、1行の長い文字列になるので、preタグの間に貼り付けてください。
<pre>
ソース
</pre>
だと、1行目と最終行に<br />が入るので、
<pre>ソース</pre>
こう書きましょう。
改行の変換で1手間かかるので微妙ですが、よかったら使ってやってください。
※ 2008/01/30 1:00頃 追記
<br />を消すだけであれば、Syntaxhighlighterの設定だけで出来るようです。ただ、その場合は1行余分に改行が入ります。
・・・
window.onload = function () {
dp.SyntaxHighlighter.ClipboardSwf = 'http://○○○/clipboard.swf';
dp.SyntaxHighlighter.BloggerMode(); ← headの設定にこの行を追加
dp.SyntaxHighlighter.HighlightAll('code');
・・・
※ 2008/01/30 23:00頃 追記
Jvn Writerさんが、余分な改行が入らない方法を教えてくれたので、修正済みのファイルを公開します＾＾ 今回修正したのは、SyntaxHighlighter本体付属の「shCore.js」ですが、混乱をさけるために「shCore4SLMaMe.js」というファイル名にしてあります。
shCore4SLMaMe.js
ちなみに、shBrushLsl.jsは修正していないので今までのものを、そのまま使ってください。shCore4SLMaMe.jsを適当なサーバにアップロードしたら、ブログテンプレートでのheadの設定で、shCore.jsを参照していた部分はshCore4SLMaMe.jsに直しておいて下さい。また、BloggerModeの設定も行う必要があります。
<head>
・・・
・・・
<!-- ▼追加部分▼ -->
<link type="text/css" rel="stylesheet" href="http://○○○/SyntaxHighlighter.css" />
<script language="javascript" src="http://○○○/shCore4SLMaMe.js"></script>
<script language="javascript" src="http://○○○/shBrushLsl.js"></script>
<script language="javascript">
window.onload = function () {
dp.SyntaxHighlighter.ClipboardSwf = 'http://○○○/clipboard.swf';
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
}
</script>
<!-- ▲追加部分▲ -->
</head>
あと、shBrushLsl.jsのリンクが切れていたので修正しておきました。
※ 2008/07/29 00:40頃 追記
javascript、cssファイル等を、各使用者が個別に設置する必要がなくなりました。詳しくは、以下のエントリをご覧ください。
LSL色付けツールをバージョン1に、あと設置簡易化とか
※ 2009/04/04 23:30頃 追記
SyntaxHighlighter2.0に対応しました。詳しくは、以下のエントリをご覧ください。
LSL色付ツールSyntaxHighlighter2.0対応
＜注意事項＞
・javascriptには、LSLの関数をすべて記述してあるので、結構重いです(12kB)。
・ライセンスは、本体と同じでLGPLです。自分のブログで使うだけであれば問題ないので、分からない人は気にしなくてもいいです。
・shBrushLsl.js、shCore4SLMaMe.js、または今回の記事内容から発生した損害について、このブログの運営者は一切の責任を負わないものとします。
ソラマメのカテゴリ勘違いしてたっぽい
SyntaxHighlighter2.0で改行タグが出る件
LSL色付ツールSyntaxHighlighter2.0対応
ソラマメのサイドバー拡張の小ネタ
LSL色付けツールをバージョン1に、あと設置簡易化とか
LSL色付けツール2.0をJvn Writerさんがリリース
SyntaxHighlighter2.0で改行タグが出る件
LSL色付ツールSyntaxHighlighter2.0対応
ソラマメのサイドバー拡張の小ネタ
LSL色付けツールをバージョン1に、あと設置簡易化とか
LSL色付けツール2.0をJvn Writerさんがリリース
Posted by sabro at 01:28│Comments(15)
│ブログ設定
この記事へのトラックバック
最近、新居を持ちましたprim数制限の壁と戦い中です家のパーツの一部を スカルプで置き換えられないかなぁ とBlender をインストールしましたこいつぁ もうちょっと使ってから紹介しま...
LSL 色つけツール 2.0 構想【If SL = RL then ..】at 2008年02月09日 09:50
sabroさん （→http://sabro.slmame.com/ ）のLSL色付けツール導入を導入してみた。※表示が普通のときはツールを置いてるサーバーが落ちてる時だともいます。default{ state_entry() { llSay(0,...
LSL色付けツール導入【広く浅く】at 2008年02月29日 06:50
この記事へのコメント
こんな便利そうなツールがあるとは知りませんでした。ありがたく使わせてもらいます～＾＾
Posted by march
at 2007年12月11日 19:10
at 2007年12月11日 19:10こんにちは
こういうの探してたんです！
ありがとうございます＾＾
"<BR/>"問題ですが、jsファイルを読んでみたところ、
スクリプトのインポートするときに指定すると直してくれるようです。
window.onload = function () {
dp.SyntaxHighlighter.ClipboardSwf = 'http://○○○/clipboard.swf';
dp.SyntaxHighlighter.HighlightAll('code');
}
↓
window.onload = function () {
dp.SyntaxHighlighter.ClipboardSwf = 'http://○○○/clipboard.swf';
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
}
お試しください＾＾
こういうの探してたんです！
ありがとうございます＾＾
"<BR/>"問題ですが、jsファイルを読んでみたところ、
スクリプトのインポートするときに指定すると直してくれるようです。
window.onload = function () {
dp.SyntaxHighlighter.ClipboardSwf = 'http://○○○/clipboard.swf';
dp.SyntaxHighlighter.HighlightAll('code');
}
↓
window.onload = function () {
dp.SyntaxHighlighter.ClipboardSwf = 'http://○○○/clipboard.swf';
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
}
お試しください＾＾
Posted by Jvn Writer at 2008年01月29日 14:45
at 2008年01月29日 14:45おおーーーこれはすごい（ﾟ∀ ﾟ)
そんな設定があったとは・・・。
早速記事の方へも反映しておきます(^^)
そんな設定があったとは・・・。
早速記事の方へも反映しておきます(^^)
Posted by sabro at 2008年01月29日 23:48
at 2008年01月29日 23:48実際試してみたのですが、別の問題が発生してしまいました (><)
BloggerModeでは<br />を\nに変換しているようです。おそらくBloggerでは記事に「改行 → <br />」という変換をしているので、これで良いのだと思いますが、ソラマメでは「改行 → <br />＋改行」という変換をしているので、<pre>内に余分に改行が入ってしまいました。
う～ん、ソラマメ微妙すぎ。いっそのこと、SLMaMeModeとか追加したものを配布してしまおうか。でも、改行についてはソラマメに修正要望出してあるから無駄になりそうな気もしないでもないなあ。
BloggerModeでは<br />を\nに変換しているようです。おそらくBloggerでは記事に「改行 → <br />」という変換をしているので、これで良いのだと思いますが、ソラマメでは「改行 → <br />＋改行」という変換をしているので、<pre>内に余分に改行が入ってしまいました。
う～ん、ソラマメ微妙すぎ。いっそのこと、SLMaMeModeとか追加したものを配布してしまおうか。でも、改行についてはソラマメに修正要望出してあるから無駄になりそうな気もしないでもないなあ。
Posted by sabro at 2008年01月30日 01:17
at 2008年01月30日 01:17うーん なるほど＞＜
<BR/> 直後に 改行が入るのは、気持ち的にはわかりますが。。
とりあえず shCore.js の ３３行目をこう書き換えるとうまくなおります
{return(dp.sh.isBloggerMode==true)?str.replace(/<br\s*\/?>\n?|<br\s*\/?>\n?/gi,'\n'):str;}
やってること
<br> 直後に 改行があったら 削除する
なかったら従来どおり
いかがでしょう？？
<BR/> 直後に 改行が入るのは、気持ち的にはわかりますが。。
とりあえず shCore.js の ３３行目をこう書き換えるとうまくなおります
{return(dp.sh.isBloggerMode==true)?str.replace(/<br\s*\/?>\n?|<br\s*\/?>\n?/gi,'\n'):str;}
やってること
<br> 直後に 改行があったら 削除する
なかったら従来どおり
いかがでしょう？？
Posted by Jvn Writer at 2008年01月30日 10:00
at 2008年01月30日 10:00仕事早い！！もう解決策が＾＾
早速、修正版を公開してみました。
できれば、SLMaMeModeを追加する形にしたかったのですが、修正箇所が多くなりそうなのと、BloggerModeとSLMaMeModeが両方指定された場合の動きを考えて困ったので諦めました。
早速、修正版を公開してみました。
できれば、SLMaMeModeを追加する形にしたかったのですが、修正箇所が多くなりそうなのと、BloggerModeとSLMaMeModeが両方指定された場合の動きを考えて困ったので諦めました。
Posted by sabro at 2008年01月30日 23:48
at 2008年01月30日 23:48公開ありがとうございます＾＾
なるほど SLMaMe モード＞＜
気が回らずすみません。
私も、何か手を加えたもの作ってみたくなりましたｗ
LSL IncSearch と絡めて定義自動生成とか
関数名にマウスポイントで、参考サイトをポップアウト自動表示とか。。。
妄想ばっかり膨らみますｗ
なるほど SLMaMe モード＞＜
気が回らずすみません。
私も、何か手を加えたもの作ってみたくなりましたｗ
LSL IncSearch と絡めて定義自動生成とか
関数名にマウスポイントで、参考サイトをポップアウト自動表示とか。。。
妄想ばっかり膨らみますｗ
Posted by Jvn Writer at 2008年01月31日 09:24
at 2008年01月31日 09:24SLMaMeModeは単に自分の技術が足りなかっただけですので
気にしなくていいですよ＾＾
それにしても、面白そうなアイデアですね。
もし作ったら私にも使わせてくださいｗ
私は、作らなくてはならないものがまだまだあって、
このツールの機能追加までは手が回りませんのでｗ
気にしなくていいですよ＾＾
それにしても、面白そうなアイデアですね。
もし作ったら私にも使わせてくださいｗ
私は、作らなくてはならないものがまだまだあって、
このツールの機能追加までは手が回りませんのでｗ
Posted by sabro at 2008年01月31日 21:55
at 2008年01月31日 21:55おーー
いいんですか！
ちょっと でしゃばりすぎたかとおもって
反省してました。。
また 近いうちに公開します＾＾
いいんですか！
ちょっと でしゃばりすぎたかとおもって
反省してました。。
また 近いうちに公開します＾＾
Posted by Jvn Writer at 2008年02月01日 00:55
at 2008年02月01日 00:55実は、普通にコード貼るのさえ手間取ってました。
これで綺麗にできます。
どうもありがとうございます。
ご苦労様でした。
これで綺麗にできます。
どうもありがとうございます。
ご苦労様でした。
Posted by 田中明夫 at 2008年03月04日 23:44
田中明夫さん導入ありがとうございます＾＾
高機能版があるのに、意外と使っていただいてる人が多いのは
syntaxhighlighter純正だからなんですかね。
自分の作ったものを、使ってもらえるとやっぱりうれしいです＾＾
高機能版があるのに、意外と使っていただいてる人が多いのは
syntaxhighlighter純正だからなんですかね。
自分の作ったものを、使ってもらえるとやっぱりうれしいです＾＾
Posted by sabro at 2008年03月05日 01:51
at 2008年03月05日 01:51自分の郷里に対して深い感情のミッシェルを持っていますか、1950年スイスで生まれます。父が機械的な作業の関係に従事するため、彼は小さいときからこの方面の知識に接触します。誰が思い付くことができて、昔のオーストリア瑪時計工場の最後は意外にも今チ瑪強尼時計工場になりました。
若い時、ミッシェルかブロは一つの制表工場は補佐を担当しています。1975年、彼は創業を始めて、毅然として自分の会社を創立して、修復の高級な時計の業界に着いた中に身を投じます。ごく短い数年の内で、彼はいくつかの有名な博物館と個人のためにチベットを抵当に入れて多くて世にも珍しいの貴重な品を修復して、精密に必ず価格の海事の天文の時計算することがないことを含む、皇室の時に計算する、時報時計とオルゴールなど、すべて彼の手を通じて(通って)回復して昔精巧な機械的な製作の精密なを言います。
若い時、ミッシェルかブロは一つの制表工場は補佐を担当しています。1975年、彼は創業を始めて、毅然として自分の会社を創立して、修復の高級な時計の業界に着いた中に身を投じます。ごく短い数年の内で、彼はいくつかの有名な博物館と個人のためにチベットを抵当に入れて多くて世にも珍しいの貴重な品を修復して、精密に必ず価格の海事の天文の時計算することがないことを含む、皇室の時に計算する、時報時計とオルゴールなど、すべて彼の手を通じて(通って)回復して昔精巧な機械的な製作の精密なを言います。
Posted by jpproshop at 2013年08月10日 15:19
いくつかのコラボレーションや作業グループが含む仮想環境間の相互運用性をサポートするために必要とされるであろう規格やプロトコルの種類を作成する試みで確立されている。
Posted by online spell check and grammar at 2013年11月28日 22:46
ウブロはファッション界でしっかりしている地位の絶え間ない豪華さ型のアクセサリーの作品に頼って発表されます。多くのブランドのように、ブランドの大隊を贅沢品帝国の必要とするだけではないのが表面の技量なことにもたらして、実は多くの考えを使って領域の大きい人の前に頭を上げて胸をまっすぐに伸ばすことをもっと必要として、やっと“見かけ倒し”の評判を付け加えられることはでき(ありえ)なくて、いまどきになって、多くの専門ウブロコピー腕時計のブランドまだあまりに先進技術がある時、ウブロは陀はずみ車に回転し始められました。
Posted by ウブロコピー at 2013年12月06日 18:42
公開ありがとうございます＾＾
なるほど SLMaMe モード＞＜
気が回らずすみません。
なるほど SLMaMe モード＞＜
気が回らずすみません。
Posted by 事務服通販 at 2014年08月11日 11:51
