ソースの貼り付け方法その後

SPONSORED LINK

Pocket

昨日書いた「ブログにコードを貼り付ける方法で悩むの巻」ですが、さまざまな方のブログでとりあげていただき、とんでもなく勉強になっています。

ためになるのでこちらでもご紹介。

いやぁ、よくわからないで書いていたのでところどころ間抜けな記述がありましたが(ガチで「実態参照」と思っていたよ・・・)書いてよかった。とっても勉強になりました。

いろいろな論点がありそうですが、個人的にはpreとcodeのあわせ技で行こうかな、と。あとは実体参照はエディターのマクロの勉強も兼ねて作ってみようかな、と思いました。

ちなみに実体参照はみなさんやっぱり手作業なのですね・・・そう考えるとMTのPlug-inであっていいような・・・はてなの記法が優れているということもわかって勉強になりました。

ちなみに昔から気になっているのはブログじゃないのですが、Yahoo! Developers Networkのコードの記述方法。

code_yahoo_dev.gif

↑ なんだか高機能。

普通のソースコードにあわせて「view plain」「print」「copy to clipboard」などがあってとっても使い勝手が良いのです。クリップボードへのコピーはIEのみ対応なのでFirefoxでは表示されないという念の入れよう。

code_yahoo_detail.gif

↑ 拡大してみる。

しかもソースコードの関数を見てちゃんと色分けもしている模様。ここらへんはJavascriptで実現しているようですね・・・。

こちらのソースは、以下のようになっていますね。preとtextareaのあわせ技です。

<pre><textarea name="code" class="JScript" cols="60" rows="1">
// Creates a namespace for "myproduct1"
YAHOO.namespace ("myproduct1");
YAHOO.myproduct1.Class1 = function(info) {
alert(info);
};
// Creates a namespace for "myproduct2", and for "mysubproject1"
YAHOO.namespace ("myproduct2.mysubproject1");
YAHOO.myproduct2.mysubproject1.Class1 = function(info) {
alert(info);
};
</textarea></pre>

しかしソースはこれですが、なんだかJavascriptでごりごりしてすごい具合にレンダリングしている模様(調べたけど頭が混乱したw。あきやんに聞いてちょっとわかったけど)。

ソースは見やすいのも大事ですが、コピペしたり、印刷したりするのも大事ですよね。ちょっと手がこんでいますが、Yahoo!のやりかたはいいかな、と思いました。こういうのライブラリ化するといいかもですね、Yahoo!にあるかもしれないけど。

というわけで続報でした・・・。

ツイッターもやっています!

SPONSORED LINK

    • から
    • September 7th, 2006

    丁度私も同じこと調べてました。
    で、以下のようなサイトを見つけました。

    http://jmblog.jp/archives/80

    OperaもIEも対応してて良い感じです。

    • caol_ila
    • September 7th, 2006

    Yahoo!で使っているのはこれかもしれないですね。
    http://www.dreamprojections.com/SyntaxHighlighter/Default.aspx

  1. 実体参照変換ツール

    i d e a * i d e a – ソースの貼り付け方法その後 ちなみに実体…

    • Anonymous
    • September 9th, 2006

    でも一番便利なのはソースファイル自体にリンク貼ってくれることですね。text/plainあたりで。

    • yuki
    • September 13th, 2006

    PHPならphpspotのPHPコード変換

    http://phpspot.net/php/codeconv/

    なんてものもあります、既出かもしれませんが。

  1. No trackbacks yet.