<?xml version="1.0" encoding="UTF-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
    <title>blog.remora.cx</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/" />
    <link rel="self" type="application/atom+xml" href="http://blog.remora.cx/atom.xml" />
    <id>tag:blog.remora.cx,2010-02-25://4</id>
    <updated>2010-08-30T13:23:45Z</updated>
    <subtitle>日々勉強したこと＋映画の感想を書き留める日記。Perl,Python,Javascript,Movable Typeの話題が主です。</subtitle>
    <generator uri="http://www.sixapart.com/movabletype/" version="5.02">Movable Type Pro</generator>
<entry>
    <title>MobileMe で charset 指定のないメールが文字化けする件</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/mail-without-charset.html" />
    <id>tag:blog.remora.cx,2010://4.688</id>
    <published>2010-08-30T13:18:45Z</published>
    <updated>2010-08-30T13:23:45Z</updated>
    <summary>MobileMe を使っていると、いくつかのメールが文字化けして届くことに気づい...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="web" label="Web" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="メール" label="メール" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="文字化け" label="文字化け" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<a rel="lightbox" href="http://blog.remora.cx/2010/08/30/100830-0001.png"><img alt="100830-0001.png" src="http://blog.remora.cx/assets_c/2010/08/100830-0001-thumb-480x229-400.png" width="480" height="229" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" /></a><p><a class="exlink" href="http://www.apple.com/jp/mobileme/">MobileMe</a> を使っていると、いくつかのメールが文字化けして届くことに気づいた。調べてみると、次の条件が重なった場合に化けるようだ。</p>
<ol>
<li>メールヘッダの <code>Content-Type</code> 節において <code>charset</code> が指定されていない。</li>
<li>メール本文に ASCII 文字以外が使用されている。</li>
<li>メール本文が UTF-8 以外でエンコードされている。</li>
</ol>
]]>
        <![CDATA[<h3>正しい <code>Content-Type</code></h3>
<p><code>Content-Type</code> 節は一般的なメールでは次のようになっている。</p>
[code:plain;gutter:false]
Content-Type: text/plain; charset=iso-2022-jp
[/code]
<p><code>charset</code> 構文によりメール本文のエンコードを指定する。これが省略された場合、エンコードは <code>US-ASCII</code>（要するに ASCII 文字）であると仮定される。</p>
<blockquote title="MIME の基礎">
なお、charset パラメータが省略された場合は、US-ASCII として取り扱われます。
<a class="exlink" href="http://www.mew.org/~kazu/doc/newsletter/3.html">http://www.mew.org/~kazu/doc/newsletter/3.html</a></p>
</blockquote>
<p>つまり、日本語を使ったメールでは<b>必ず</b> <code>charset</code> 構文を使わないといけない。UTF-8 のメールが文字化けしないのは、MobileMe が優しいだけなのだ。今回文字化けしたメールは郵便局から送られてきており、<code>charset</code> 構文がすっぽり抜けていた。どんなダメシステムを使ってメール配信してるのやら。</p>
[code:plain;gutter:false;title:郵便局のメール]
Content-Type: text/plain
[/code]
<h3>ほかのメーラーでは</h3>
<a rel="lightbox" href="http://blog.remora.cx/2010/08/30/100830-0002.png"><img alt="100830-0002.png" src="http://blog.remora.cx/assets_c/2010/08/100830-0002-thumb-160x284-402.png" width="160" height="284" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a>
<p>GMail はもっと優しいので、ISO-2022-JP でも Shift_JIS でも EUC-JP でも、何とか読める状態にしてくれる。今回のメールも GMail に転送すると読めた。</p>
<p>iPhone では UTF-8 と ISO-2022-JP の時のみ、メールが文字化けしなかった。MobileMe と iPhone で仕様が違うというのもなんだか変な感じだ。</p>
]]>
    </content>
</entry>
<entry>
    <title>HTML5 に対応した Youtube 動画を貼る方法</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/put-youtube-for-html5.html" />
    <id>tag:blog.remora.cx,2010://4.683</id>
    <published>2010-08-28T09:31:20Z</published>
    <updated>2010-08-28T09:51:49Z</updated>
    <summary><![CDATA[Youtube の動画をブログ等に貼るとき、従来は &lt;object&gt;...]]></summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Movable Type" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="iPhone" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="iphone" label="iPhone" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="web" label="Web" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="youtube" label="Youtube" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>Youtube の動画をブログ等に貼るとき、従来は <code>&lt;object&gt;</code> タグを使って次のように書いていた。</p>
[code:html;title:「かりぐらしのアリエッティ」予告編;auto-links:false]
<object width="640" height="385">
    <param name="movie" value="http://www.youtube.com/v/SuY6wrMDptA&amp;hl=ja_JP&amp;fs=1"></param>
    <param name="allowFullScreen" value="true"></param>
    <param name="allowscriptaccess" value="always"></param>
    <embed src="http://www.youtube.com/v/SuY6wrMDptA&amp;hl=ja_JP&amp;fs=1"
        type="application/x-shockwave-flash" allowscriptaccess="always"
        allowfullscreen="true" width="640" height="385"></embed>
</object>
[/code]
<p>これは Flash による再生にしか対応していないし、お世辞にもきれいなタグとも言えない<fn>(さらに、W3C Validation も通らない。)</fn>。そこで、HTML5 版 Youtube にも対応したスマートなタグが推奨されている。</p>
<blockquote>
<p>【レビュー】YouTubeビデオの組み込みでHTML5 VideoとFlashの両方をサポートする方法 | ネット | マイコミジャーナル<br />
<a class="exlink" href="http://journal.mycom.co.jp/articles/2010/07/26/youtube-for-flash-and-html5/index.html">http://journal.mycom.co.jp/articles/2010/07/26/youtube-for-flash-and-html5/index.html</a></p>
</blockquote>
[code:html;title:「かりぐらしのアリエッティ」予告編（HTML5 版）;highlight:[4];auto-links:false]
<iframe class="youtube-player"
    width="640" height="385"
    src="http://www.youtube.com/embed/SuY6wrMDptA"
    frameborder="0"
></iframe>
[/code]
]]>
        <![CDATA[<h4>実際の例</h4>
<iframe class="youtube-player"
    width="640" height="385"
    src="http://www.youtube.com/embed/SuY6wrMDptA"
    frameborder="0"
></iframe>
<a rel="lightbox" href="http://blog.remora.cx/2010/08/28/IMG_0145.jpg"><img alt="IMG_0145.jpg" src="http://blog.remora.cx/assets_c/2010/08/IMG_0145-thumb-240x360-398.jpg" width="240" height="360" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a>
<p>Google Chrome のような対応ブラウザでは HTML5 版が表示され、一般的なブラウザでは Flash による再生がサポートされる。iPhone でもきちんと認識されるようだ。</p>
<p><code>&lt;iframe&gt;</code> を使うと標準では 1 ドットの枠が表示されるのだが、これを消すためには例に挙げたように <b><code>frameborder="0"</code></b> と書けばよい。ところが、<a class="exlink" href="http://bakera.jp/ref/html/attribute/frameborder"><code>frameborder</code> は非推奨の属性であり</a>、そのままでは、<a class="exlink" href="http://validator.w3.org/check?uri=referer">W3C Validator</a> を通らない。解決策としては、これを CSS で代替する。</p>
<blockquote>
<p>スタイルシート［CSS］/フレーム/インラインフレームの境界線を指定する - TAG index Webサイト<br />
<a class="exlink" href="http://www.tagindex.com/stylesheet/frame/border.html">http://www.tagindex.com/stylesheet/frame/border.html</a></p>
</blockquote>
[code:css]
.youtube-player {
    border: none;
}
[/code]
<p>でも、これも IE には効かない。ほんとどうしようもないブラウザだよな('A`)</p>]]>
    </content>
</entry>
<entry>
    <title>公式 Tweet Button は HTML5 用？</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html" />
    <id>tag:blog.remora.cx,2010://4.685</id>
    <published>2010-08-24T07:57:34Z</published>
    <updated>2010-08-24T10:22:23Z</updated>
    <summary>ページを構成する HTML の正当性を検査してくれるサービスとしては W3C M...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Movable Type" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="Twitter" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="html" label="HTML" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="twitter" label="Twitter" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="web" label="Web" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>ページを構成する HTML の正当性を検査してくれるサービスとしては <b>W3C Markup Validation Service</b> が便利だ。</p>
<blockquote>
<p>The W3C Markup Validation Service<br />
<a class="exlink" href="http://validator.w3.org/">http://validator.w3.org/</a></p>
</blockquote>
<p>以前このサイトは XHTML 1.0 で構築し、W3C Validation Service でも確認をとっていたのだが、「」で紹介した <b>Tweet Button</b> を設置したあたりからおかしくなった。原因はコードに出てくる <b><code>data-xxxx</code></b> 属性だ。</p>
]]>
        <![CDATA[[code:html;highlight:[2];auto-links:false]
<a href="http://twitter.com/share" class="twitter-share-button exlink"
    data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
[/code]
<p>これが XHTML 1.0 で認められていないことが問題だった。ググってみるとこれは HTML5 で標準化される予定らしい。初めて知った。</p>
<blockquote>
<p>John Resig - HTML 5 data- Attributes<br />
<a class="exlink" href="http://ejohn.org/blog/html-5-data-attributes/">http://ejohn.org/blog/html-5-data-attributes/</a></p>
<p>HTML5のCustom Data Attributeは、Microdataよりも気軽にデータを埋め込める － Publickey<br />
<a class="exlink" href="http://www.publickey1.jp/blog/09/html5custom_data_attributemicrodata.html">http://www.publickey1.jp/blog/09/html5custom_data_attributemicrodata.html</a></p>
</blockquote>
<p>と言う訳で、今まで使っていた DOCTYPE を次のものから、</p>
[code:html;title:XHTML 1.0 Traditional;auto-links:false]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
[/code]
<p>次のものに変更。</p>
[code:html;title:HTML5]
<!DOCTYPE html>
[/code]
<a class="exlink" style="display:block;float:left;margin:0 2em 2em 0;" href="http://validator.w3.org/check?uri=referer">
<img src="http://www.w3.org/QA/Tools/I_heart_validator_lg" alt="I ♥ validator" height="46" width="101" />
</a><p>この上で W3C Validation Service を試すとエラーがなくなった。各ページの“I ♥ validator”アイコンでも押して見てみてください。</p>
]]>
    </content>
</entry>
<entry>
    <title>【MovableType】Twitter のつぶやきをサイドバーに表示する</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/twitter-on-sidebar.html" />
    <id>tag:blog.remora.cx,2010://4.684</id>
    <published>2010-08-19T12:11:12Z</published>
    <updated>2010-08-24T07:51:42Z</updated>
    <summary>Twitter のログをブログに表示してみた記録。基本的には簡単。ジェネレータで...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Movable Type" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="Twitter" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="javascript" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="javascript" label="Javascript" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="twitter" label="Twitter" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="web" label="Web" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>Twitter のログをブログに表示してみた記録。基本的には簡単。ジェネレータで生成した HTML を貼り付けるだけだ。</p>
<blockquote>
<p>[Movable Type] Twitterウィジェットをサイドバーに追加してみた - No Second Life<br />
<a class="exlink" href="http://www.ttcbn.net/no_second_life/2009/02/movable-type-twitter.html">http://www.ttcbn.net/no_second_life/2009/02/movable-type-twitter.html</a></p>
</blockquote>
<p>だけどそのままでは味も素っ気もない。読み込みが終わるまで空欄のままだし、表示も白黒になってしまう。ある程度整形して表示するようにしてみた。</p>
]]>
        <![CDATA[<h3>テンプレートの作成</h3>
<p>例によって、このブログで使っている <a class="exlink" href="http://mt.vicuna.jp/">mt.Vicuna テーマ</a>にあわせた設定なのでよろしく。まずは、ウィジェットのテンプレートを作成する。コード内の<b><code>“delphinus35”</code></b>は各自のアカウント名に変えること。以下同様。</p>
[code:html;title:Twitter Updates ウィジェット;auto-links:false]
<dt>Twitter Updates</dt>
<dd>
    <div id="twitter-link-wrapper">
        <a href="http://twitter.com/delphinus35" id="twitter-link"
            class="small button orange exlink">follow me on Twitter</a>
    </div>
    <div id="twitter_div">
        <ul id="twitter_update_list">
            <li>読み込み中です……</li>
        </ul>
    </div>
</dd>
[/code]
<p>“follow me on Twitter”ボタンに設定している<b><code>“small button orange”</code></b>というクラスは「」で説明したものだ。きれいなボタンが簡単に作成できるのでおすすめ。</p>
<p>次にテンプレートモジュールを作成する。アカウント名は変えること。</p>
[code:html;title:Twitter Updates Script テンプレートモジュール;auto-links:false;highlight:[3]]
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/delphinus35.json?callback=twitterCallback2&amp;count=10"></script>
<script type="text/javascript" src="/js/minmax.js"></script>
[/code]
<p>2 行目の URL の最後にある<b><code>“count=10”</code></b>というのが表示するつぶやきの数になる。3 行目については後述。</p>
<p>このコードは、本当は上述のウィジェットに含めてしまってもいいのだが、Javascript はなるべくページの最後に読み込むようにした方がよい。“フッター”テンプレートに一行追加して、ページの読み込みが終わる直前にスクリプトを動作させる。</p>
[code:html;title:フッター テンプレート;highlight:[7];auto-links:false]
<div id="footer">
    <ul class="support">
        <li>Powered by <a class="exlink" href="http://www.sixapart.jp/movabletype/">Movable Type Pro 5.02</a></li>
        <li class="template"><a class="exlink" href="http://vicuna.jp/">vicuna CMS</a> - <a class="exlink" href="http://mt.vicuna.jp/" title="ver.2.3">Movable Type Template</a></li>
    </ul>
    <address>Copyright &copy; blog.remora.cx All Rights Reserved.</address>
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/delphinus35.json?callback=twitterCallback2&amp;count=10"></script>
</div>
[/code]
<h3>スタイルシートの設定</h3>
<p>後はスタイルシートの設定だ。次の CSS を用意する。</p>
[code:css;title:スタイルシート;highlight:[4]]
/* Twitter Updates */
#twitter_update_list {
    width: 208px;
    max-height: 40em;
    overflow: scroll;
    overflow-x: hidden;
}
#twitter_update_list li {
    width: 161px;
    overflow-x: hidden;
    margin-bottom: 1em;
    padding: 0.5em;
    background-color: #cee4ae;
    border-radius: 1em;
    -webkit-border-radius: 1em;
    -moz-border-radius: 1em;
}
#twitter-link-wrapper {
    padding: 6px 5px 0 15px;
}
#twitter-link {
    display: block;
    width: 10em;
    margin-left: 1em;
}
[/code]
<p>今回は<code>“max-height”</code>プロパティを使って表示域の高さを可変にして、スクロールバーを付けてみた。だが、このプロパティは IE で使えない（またか……）。そこで、先ほどコードに書いた<b><code>“minmax.js”</code></b>の出番だ。</p>
<blockquote>
<p>min-width、min-height、max-width、max-heightをIE6でも実装する方法 | CSS Lecture<br />
<a class="exlink" href="http://www.css-lecture.com/log/css/038.html">http://www.css-lecture.com/log/css/038.html</a></p>
<p>doxdesk.com: software: minmax.js<br />
<a class="exlink" href="http://www.doxdesk.com/software/js/minmax.html">http://www.doxdesk.com/software/js/minmax.html</a></p>
</blockquote>
<p>かなり古い（2003 年と書いてあってビックリ）スクリプトだがきちんと動作する。これで IE でも何とか見れる体裁になった。角丸だけはどうしようもないけど……まあいいや。</p>
]]>
    </content>
</entry>
<entry>
    <title>【Unix】タイムスタンプを変更する</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html" />
    <id>tag:blog.remora.cx,2010://4.679</id>
    <published>2010-08-14T14:07:31Z</published>
    <updated>2010-08-19T07:11:41Z</updated>
    <summary>ものすごく基本的なことなのだけれど、実際必要になるまで覚えてなかった。 タイムス...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Unix系OS" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="linux" label="Linux" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="mac" label="Mac" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="unix" label="UNIX" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="タイムスタンプ" label="タイムスタンプ" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>ものすごく基本的なことなのだけれど、実際必要になるまで覚えてなかった。</p>
<h3>タイムスタンプを調べる</h3>
<p>今日 iPhone で撮った動画のタイムスタンプが訳の分からない日付になっていて困った。ほかの写真と全く違うのだ。</p>
[code:bash;gutter:false;title:昭和 3 年 1 月 19 日！？]
$ ls -l IMG_0036.MOV
-rw-------  1 delphinus  staff  46099763  1 19  1928 IMG_0036.MOV
[/code]
<p>と言う訳で、改めてお勉強。ここに現れる時刻はいったい何なのか。</p>
<blockquote>
<p>UNIX の部屋 コマンド検索:タイムスタンプ (*BSD/Linux)<br />
<a class="exlink" href="http://x68000.q-e-d.net/~68user/unix/pickup?%A5%BF%A5%A4%A5%E0%A5%B9%A5%BF%A5%F3%A5%D7">http://x68000.q-e-d.net/~68user/unix/pickup?%A5%BF%A5%A4%A5%E0%A5%B9%A5%BF%A5%F3%A5%D7</a></p>
</blockquote>
]]>
        <![CDATA[<p>UNIX におけるファイルの時刻管理には 3 種類のタイムスタンプが使われる。</p>
<dl>
<dt>mtime</dt>
<dd><b>最終変更時刻（modify time）</b>の意。ファイルに書き込んだ（<code>write(2)</code>、または、<code>truncate(2)</code> した）時刻を表す。平たく言えば、ファイルに書き込んだ時刻だ。これは <b><code>ls -l</code></b> コマンドで確認できる。<br />
[code:bash;gutter:false;title:mtime の確認]
$ ls -l IMG_0036.MOV
-rw-------  1 delphinus  staff  46099763  1 19  1928 IMG_0036.MOV
[/code]
</dd>
<dt>atime</dt>
<dd><b>最終アクセス時刻（access time）</b>の意。ファイルに <code>read(2)</code> した、つまり、読み込もうとした時刻を表す。これは <b><code>ls -lu</code></b> コマンドで確認できる。<br />
[code:bash;gutter:false;title:atime の確認]
$ ls -lu IMG_0036.MOV
-rw-------  1 delphinus  staff  46099763  8 14 21:33 IMG_0036.MOV
[/code]
</dd>
<dt>ctime</dt>
<dd><b>最終ステータス変更時刻（change time）</b>の意。これはちょっと複雑で、ファイルに <code>write(2)</code>、または、<code>truncate(2)</code>、または、inode データの修正を行った場合に変更される。詳しくは上のリンク先を参照して欲しいが、今回の場合は、<b>iPhone からコピーして Mac にファイルを生成した時刻</b>がこれに当たる。これは <b><code>ls -lc</code></b> コマンドで確認できる。<br />
[code:bash;gutter:false;title:ctime の確認]
$ ls -lc IMG_0036.MOV
-rw-------  1 delphinus  staff  46099763  8 14 21:29 IMG_0036.MOV
[/code]
</dd>
</dl>
<p>ctime の定義が複雑でわかりにくいが今回はこれに触らない<fn>(そもそも、通常の手段では変更不可能なのだ。)</fn>。atime と mtime の修正には <code>touch(1)</code> コマンドを使う。</p>
<h3>タイムスタンプを変更する</h3>
<blockquote>
<p>UNIX の部屋 コマンド検索:touch (*BSD/Linux)<br />
<a class="exlink" href="http://x68000.q-e-d.net/~68user/unix/pickup?touch">http://x68000.q-e-d.net/~68user/unix/pickup?touch</a></p>
</blockquote>
<p>今回は mtime だけを変えれば十分だ。</p>
[code:bash;gutter:false;title:mtime の変更]
$ touch -m -t 201008141429.17 IMG_0036.MOV
$ ls -l IMG_0036.MOV
-rw-------  1 delphinus  staff  46099763  8 14 14:29 IMG_0036.MOV
[/code]
<p>ほかの写真から推量して、今日の 14:29:17 に設定する。これで目的は達した。</p>
]]>
    </content>
</entry>
<entry>
    <title>【MovableType】Twitter につぶやくボタンを各記事に設置する</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html" />
    <id>tag:blog.remora.cx,2010://4.677</id>
    <published>2010-08-13T04:16:27Z</published>
    <updated>2010-08-19T09:36:49Z</updated>
    <summary>アカウントをとったまま放置していた Twitter を使ってみることにした。ちょ...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Movable Type" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="twitter" label="Twitter" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>アカウントをとったまま放置していた Twitter を使ってみることにした。ちょうどうまいことに公式の“Tweet Button”なるものが発表されて話題になっているところだったので、ついでにこのブログにも設置してみた。こんな感じ。<ins datetime="2010-08-13T15:51:30+09:00"><a class="exlink" href="http://www.itmedia.co.jp/enterprise/articles/1008/13/news018.html">ITmedia の記事</a>に“Twitter Button”なんて書かれてたからそれ採用したけど、よく見たら“Tweet Button”だね。ｶｺﾜﾙｲので修正しました。</ins></p>
<img alt="2010-08-13_131026.png" src="http://blog.remora.cx/2010/08/13/2010-08-13_131026.png" width="476" height="76" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" />
<blockquote>
<p>Twitter / ツイートボタン<br />
<a class="exlink" href="http://twitter.com/goodies/tweetbutton">http://twitter.com/goodies/tweetbutton</a></p>
</blockquote>
<p>このサイトで作成した HTML タグを MT のテンプレートに貼ればいい……のだが、そう簡単ではない。各記事のテンプレートに貼るだけならば次のようなソースで足る<fn>(注意：data-via 属性は各自のアカウント名に変更すること。以下同様。)</fn>。</p>
[code:html;auto-links:false]
<a href="http://twitter.com/share" class="twitter-share-button exlink"
    data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
[/code]
<p>これはクリックしたページのタイトルと URL を Tweet してくれるボタンを生成する。つまり、トップページやアーカイブページ等、複数の記事が載るページでは細工が必要だ。</p>
<p>と言う訳で、このサイトで使っている MT 用のテーマ“<a class="exlink" href="http://mt.vicuna.jp/">mt.Vicuna</a>”に Tweet Button を設置した経過を書いておく。</p>
]]>
        <![CDATA[<h3>テンプレートモジュールの作成</h3>
<p>以下の内容でテンプレートモジュールを作成しよう。</p>
[code:html;title:Tweet Button テンプレートモジュール;auto-links:false]
<a href="http://twitter.com/share" class="twitter-share-button exlink"
    data-url="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html" data-text="【MovableType】Twitter につぶやくボタンを各記事に設置する"
    data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a>
[/code]
[code:html;title:Tweet Button Script テンプレートモジュール;auto-links:false]
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
[/code]
<h3>“エントリーメタデータ”の修正</h3>
<p>mt.Vicuna テーマでは記事ごとに表示される共通部分は“エントリーメタデータ”というテンプレートモジュールに納められている。各記事のタイトルの下に表示されている執筆者や公開日時の欄だ。これを次のように修正した（ハイライト部分）。</p>
[code:html;title:エントリーメタデータ テンプレートモジュール;highlight:[8]]
<ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月13日 13:16</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html" data-text="【MovableType】Twitter につぶやくボタンを各記事に設置する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
</ul>
[/code]
<h3>“フッター”の修正</h3>
<p>スクリプトをページの最後に設置する。まあ、表示するだけならどこでもいいのだが、パフォーマンスを考えると一番最後がいいそうな。</p>
[code:html;title:フッター テンプレートモジュール;highlight:[7];auto-links:false]
<div id="footer">
<ul class="support">
<li>Powered by <a class="exlink" href="http://www.sixapart.jp/movabletype/">Movable Type Pro 5.02</a></li>
<li class="template"><a class="exlink" href="http://vicuna.jp/">vicuna CMS</a> - <a class="exlink" href="http://mt.vicuna.jp/" title="ver.2.3">Movable Type Template</a></li>
</ul>
<address>Copyright &copy; blog.remora.cx All Rights Reserved.</address>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</div>
[/code]
<h3>スタイルシートの修正</h3>
<p>これはお好みで。ほかの項目と比べて上にずれてしまうのが気に入らなかったので、ちょっとだけ修正した。</p>
[code:css;title:スタイルシート]
div.entry ul.info li.twitter iframe {
    position: relative;
    top: 4px;
}
[/code]
<hr />
<p>さあて、設置したのはいいけれど、フォローもフォロワーも全然ない現状をどうにかしないとな。</p>
]]>
    </content>
</entry>
<entry>
    <title>【MovableType】一定数の記事ごとにページを分割する</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html" />
    <id>tag:blog.remora.cx,2010://4.676</id>
    <published>2010-08-12T11:56:10Z</published>
    <updated>2010-08-19T10:22:11Z</updated>
    <summary>MT には最近のバージョン（4.3 以降？）からページ送り機能がついている。これ...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Movable Type" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="設定" label="設定" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>MT には最近のバージョン（4.3 以降？）からページ送り機能がついている。これは長すぎるページを一定間隔に区切って分け、各ページにリンクを付けてくれる機能だ。Google の検索結果の一番下に出てくる「1 2 3 4 5 &raquo;」のような表示と考えればわかりやすい。特に月別やカテゴリー別のページは数百個の記事が並ぶこともあるわけで、記事が多くなったら必ず導入しておきたい。……というか、なんで標準のテーマにこれがないのかね？</p>
<blockquote>
<p>小粋空間: Movable Type 4.3 の新機能（スタティックページのページ分割）<br />
<a class="exlink" href="http://www.koikikukan.com/archives/2009/07/29-005555.php">http://www.koikikukan.com/archives/2009/07/29-005555.php</a></p>
</blockquote>
<p>主に、上のリンクに従って設定した。以下に手順を書いていく。</p>
]]>
        <![CDATA[<h3>テンプレートモジュールの新規作成</h3>
<p>上のリンクにあるとおり、2 つのテンプレートモジュールを作成する。 <ins datetime="2010-08-19T15:22:23+09:00">URL 中の「&amp;」がエンコードされずにそのまま入るようになっていたので、<code>encode_html="1"</code> を足しました。</ins></p>
[code:xml;title:モジュール名：Search Pagination]
        <div class="content-nav">
                1
            <a href="2" rel="next">Next &raquo;</a>
        </div>
[/code]
[code:xml;title:モジュール名：Search Header Data;highlight:[2]]
[/code]
<p>2 行目にある <b><code>value="10"</code></b> というのが、1 ページに載せる記事の数になる。必要ならば変更しよう。</p>
<h3>インデックステンプレート・アーカイブテンプレートの編集</h3>
<p>どちらもやることは変わらないのでまとめて書く。インデックステンプレートというのはトップページ、つまり、<b><code>index.html</code></b> を作成するためのもので、アーカイブテンプレートというのは月別・カテゴリー別に記事を分けたページに相当する。</p>
<h4>設定情報を挿入する</h4>
<p>テンプレート内に以下のコードを追加する。<a class="exlink" href="http://www.koikikukan.com/archives/2009/07/29-005555.php">参考リンク</a>では共通ヘッダーの直後に置くこととしているが、特に場所は厳密ではないようだ。</p>
[code:xml;title:設定情報]
[/code]
<h4>記事表示部分を改変する</h4>
<p>記事の最上部と最下部にリンク（「Prev 1 2 3 4 Next」のようなもの）を挿入する。記事の表示ルーチン自体もちょっとだけ変更。ここは各々が使っているテーマによって異なると思うので、以下のはあくまでも例である。</p>
<p>このサイトで使っている <a class="exlink" href="http://mt.vicuna.jp/">mt.Vicuna</a> テーマでは記事の表示部分が次のようになっている。</p>
[code:xml;title:記事表示部分（改変前）]
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/mail-without-charset.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/679"
    dc:title="MobileMe で charset 指定のないメールが文字化けする件"
    dc:identifier="http://blog.remora.cx/2010/08/mail-without-charset.html"
    dc:subject="Web"
    dc:description="MobileMe を使っていると、いくつかのメールが文字化けして届くことに気づい..."
    dc:creator="delphinus"
    dc:date="2010-08-30T22:18:45+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000688">
    <h2>
        <a href="http://blog.remora.cx/2010/08/mail-without-charset.html">MobileMe で charset 指定のないメールが文字化けする件</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月30日 22:18</li>
    <li class="category"><a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/mail-without-charset.html" data-text="MobileMe で charset 指定のないメールが文字化けする件" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/mail-without-charset.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/mail-without-charset.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <a rel="lightbox" href="http://blog.remora.cx/2010/08/30/100830-0001.png"><img alt="100830-0001.png" src="http://blog.remora.cx/assets_c/2010/08/100830-0001-thumb-480x229-400.png" width="480" height="229" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" /></a><p><a class="exlink" href="http://www.apple.com/jp/mobileme/">MobileMe</a> を使っていると、いくつかのメールが文字化けして届くことに気づいた。調べてみると、次の条件が重なった場合に化けるようだ。</p>
<ol>
<li>メールヘッダの <code>Content-Type</code> 節において <code>charset</code> が指定されていない。</li>
<li>メール本文に ASCII 文字以外が使用されている。</li>
<li>メール本文が UTF-8 以外でエンコードされている。</li>
</ol>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/mail-without-charset.html#extended" title="続きを読む - MobileMe で charset 指定のないメールが文字化けする件" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/mail-without-charset.html#comments" title="MobileMe で charset 指定のないメールが文字化けする件 へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/mail-without-charset.html#trackback" title="MobileMe で charset 指定のないメールが文字化けする件 へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/put-youtube-for-html5.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/674"
    dc:title="HTML5 に対応した Youtube 動画を貼る方法"
    dc:identifier="http://blog.remora.cx/2010/08/put-youtube-for-html5.html"
    dc:subject="Movable Type"
    dc:description="Youtube の動画をブログ等に貼るとき、従来は &amp;lt;object&amp;gt;..."
    dc:creator="delphinus"
    dc:date="2010-08-28T18:31:20+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000683">
    <h2>
        <a href="http://blog.remora.cx/2010/08/put-youtube-for-html5.html">HTML5 に対応した Youtube 動画を貼る方法</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月28日 18:31</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a> | <a href="http://blog.remora.cx/unix/mac/iphone/" title="iPhone Index">iPhone</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/put-youtube-for-html5.html" data-text="HTML5 に対応した Youtube 動画を貼る方法" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/put-youtube-for-html5.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/put-youtube-for-html5.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>Youtube の動画をブログ等に貼るとき、従来は <code>&lt;object&gt;</code> タグを使って次のように書いていた。</p>
<pre class='auto-links:false;brush:html;' title='「かりぐらしのアリエッティ」予告編'>
&lt;object width=&quot;640&quot; height=&quot;385&quot;&gt;
    &lt;param name=&quot;movie&quot; value=&quot;http://www.youtube.com/v/SuY6wrMDptA&amp;hl=ja_JP&amp;fs=1&quot;&gt;&lt;/param&gt;
    &lt;param name=&quot;allowFullScreen&quot; value=&quot;true&quot;&gt;&lt;/param&gt;
    &lt;param name=&quot;allowscriptaccess&quot; value=&quot;always&quot;&gt;&lt;/param&gt;
    &lt;embed src=&quot;http://www.youtube.com/v/SuY6wrMDptA&amp;hl=ja_JP&amp;fs=1&quot;
        type=&quot;application/x-shockwave-flash&quot; allowscriptaccess=&quot;always&quot;
        allowfullscreen=&quot;true&quot; width=&quot;640&quot; height=&quot;385&quot;&gt;&lt;/embed&gt;
&lt;/object&gt;
</pre>
<p>これは Flash による再生にしか対応していないし、お世辞にもきれいなタグとも言えない
<sup>
<a href="#fn-683-1"
   id="efn-683-1"
   title="さらに、W3C Validation も通らない。">
*1</a>
</sup>
。そこで、HTML5 版 Youtube にも対応したスマートなタグが推奨されている。</p>
<blockquote>
<p>【レビュー】YouTubeビデオの組み込みでHTML5 VideoとFlashの両方をサポートする方法 | ネット | マイコミジャーナル<br />
<a class="exlink" href="http://journal.mycom.co.jp/articles/2010/07/26/youtube-for-flash-and-html5/index.html">http://journal.mycom.co.jp/articles/2010/07/26/youtube-for-flash-and-html5/index.html</a></p>
</blockquote>
<pre class='auto-links:false;brush:html;highlight:[4];' title='「かりぐらしのアリエッティ」予告編（HTML5 版）'>
&lt;iframe class=&quot;youtube-player&quot;
    width=&quot;640&quot; height=&quot;385&quot;
    src=&quot;http://www.youtube.com/embed/SuY6wrMDptA&quot;
    frameborder=&quot;0&quot;
&gt;&lt;/iframe&gt;
</pre>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/put-youtube-for-html5.html#extended" title="続きを読む - HTML5 に対応した Youtube 動画を貼る方法" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/put-youtube-for-html5.html#comments" title="HTML5 に対応した Youtube 動画を貼る方法 へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/put-youtube-for-html5.html#trackback" title="HTML5 に対応した Youtube 動画を貼る方法 へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/676"
    dc:title="公式 Tweet Button は HTML5 用？"
    dc:identifier="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html"
    dc:subject="Twitter"
    dc:description="ページを構成する HTML の正当性を検査してくれるサービスとしては W3C M..."
    dc:creator="delphinus"
    dc:date="2010-08-24T16:57:34+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000685">
    <h2>
        <a href="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html">公式 Tweet Button は HTML5 用？</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月24日 16:57</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/twitter/" title="Twitter Index">Twitter</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html" data-text="公式 Tweet Button は HTML5 用？" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>ページを構成する HTML の正当性を検査してくれるサービスとしては <b>W3C Markup Validation Service</b> が便利だ。</p>
<blockquote>
<p>The W3C Markup Validation Service<br />
<a class="exlink" href="http://validator.w3.org/">http://validator.w3.org/</a></p>
</blockquote>
<p>以前このサイトは XHTML 1.0 で構築し、W3C Validation Service でも確認をとっていたのだが、「」で紹介した <b>Tweet Button</b> を設置したあたりからおかしくなった。原因はコードに出てくる <b><code>data-xxxx</code></b> 属性だ。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html#extended" title="続きを読む - 公式 Tweet Button は HTML5 用？" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html#comments" title="公式 Tweet Button は HTML5 用？ へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html#trackback" title="公式 Tweet Button は HTML5 用？ へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/twitter-on-sidebar.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/675"
    dc:title="【MovableType】Twitter のつぶやきをサイドバーに表示する"
    dc:identifier="http://blog.remora.cx/2010/08/twitter-on-sidebar.html"
    dc:subject="Twitter"
    dc:description="Twitter のログをブログに表示してみた記録。基本的には簡単。ジェネレータで..."
    dc:creator="delphinus"
    dc:date="2010-08-19T21:11:12+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000684">
    <h2>
        <a href="http://blog.remora.cx/2010/08/twitter-on-sidebar.html">【MovableType】Twitter のつぶやきをサイドバーに表示する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月19日 21:11</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/twitter/" title="Twitter Index">Twitter</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a> | <a href="http://blog.remora.cx/web/javascript/" title="javascript Index">javascript</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/twitter-on-sidebar.html" data-text="【MovableType】Twitter のつぶやきをサイドバーに表示する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/twitter-on-sidebar.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/twitter-on-sidebar.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>Twitter のログをブログに表示してみた記録。基本的には簡単。ジェネレータで生成した HTML を貼り付けるだけだ。</p>
<blockquote>
<p>[Movable Type] Twitterウィジェットをサイドバーに追加してみた - No Second Life<br />
<a class="exlink" href="http://www.ttcbn.net/no_second_life/2009/02/movable-type-twitter.html">http://www.ttcbn.net/no_second_life/2009/02/movable-type-twitter.html</a></p>
</blockquote>
<p>だけどそのままでは味も素っ気もない。読み込みが終わるまで空欄のままだし、表示も白黒になってしまう。ある程度整形して表示するようにしてみた。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/twitter-on-sidebar.html#extended" title="続きを読む - 【MovableType】Twitter のつぶやきをサイドバーに表示する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/twitter-on-sidebar.html#comments" title="【MovableType】Twitter のつぶやきをサイドバーに表示する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/twitter-on-sidebar.html#trackback" title="【MovableType】Twitter のつぶやきをサイドバーに表示する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/670"
    dc:title="【Unix】タイムスタンプを変更する"
    dc:identifier="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html"
    dc:subject="Unix系OS"
    dc:description="ものすごく基本的なことなのだけれど、実際必要になるまで覚えてなかった。 タイムス..."
    dc:creator="delphinus"
    dc:date="2010-08-14T23:07:31+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000679">
    <h2>
        <a href="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html">【Unix】タイムスタンプを変更する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月14日 23:07</li>
    <li class="category"><a href="http://blog.remora.cx/unix/" title="Unix系OS Index">Unix系OS</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html" data-text="【Unix】タイムスタンプを変更する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/change-timestamp-in-unix.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/change-timestamp-in-unix.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>ものすごく基本的なことなのだけれど、実際必要になるまで覚えてなかった。</p>
<h3>タイムスタンプを調べる</h3>
<p>今日 iPhone で撮った動画のタイムスタンプが訳の分からない日付になっていて困った。ほかの写真と全く違うのだ。</p>
<pre class='brush:bash;gutter:false;' title='昭和 3 年 1 月 19 日！？'>
$ ls -l IMG_0036.MOV
-rw-------  1 delphinus  staff  46099763  1 19  1928 IMG_0036.MOV
</pre>
<p>と言う訳で、改めてお勉強。ここに現れる時刻はいったい何なのか。</p>
<blockquote>
<p>UNIX の部屋 コマンド検索:タイムスタンプ (*BSD/Linux)<br />
<a class="exlink" href="http://x68000.q-e-d.net/~68user/unix/pickup?%A5%BF%A5%A4%A5%E0%A5%B9%A5%BF%A5%F3%A5%D7">http://x68000.q-e-d.net/~68user/unix/pickup?%A5%BF%A5%A4%A5%E0%A5%B9%A5%BF%A5%F3%A5%D7</a></p>
</blockquote>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html#extended" title="続きを読む - 【Unix】タイムスタンプを変更する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html#comments" title="【Unix】タイムスタンプを変更する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html#trackback" title="【Unix】タイムスタンプを変更する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/668"
    dc:title="【MovableType】Twitter につぶやくボタンを各記事に設置する"
    dc:identifier="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html"
    dc:subject="Movable Type"
    dc:description="アカウントをとったまま放置していた Twitter を使ってみることにした。ちょ..."
    dc:creator="delphinus"
    dc:date="2010-08-13T13:16:27+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000677">
    <h2>
        <a href="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html">【MovableType】Twitter につぶやくボタンを各記事に設置する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月13日 13:16</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html" data-text="【MovableType】Twitter につぶやくボタンを各記事に設置する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>アカウントをとったまま放置していた Twitter を使ってみることにした。ちょうどうまいことに公式の“Tweet Button”なるものが発表されて話題になっているところだったので、ついでにこのブログにも設置してみた。こんな感じ。<ins datetime="2010-08-13T15:51:30+09:00"><a class="exlink" href="http://www.itmedia.co.jp/enterprise/articles/1008/13/news018.html">ITmedia の記事</a>に“Twitter Button”なんて書かれてたからそれ採用したけど、よく見たら“Tweet Button”だね。ｶｺﾜﾙｲので修正しました。</ins></p>
<img alt="2010-08-13_131026.png" src="http://blog.remora.cx/2010/08/13/2010-08-13_131026.png" width="476" height="76" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" />
<blockquote>
<p>Twitter / ツイートボタン<br />
<a class="exlink" href="http://twitter.com/goodies/tweetbutton">http://twitter.com/goodies/tweetbutton</a></p>
</blockquote>
<p>このサイトで作成した HTML タグを MT のテンプレートに貼ればいい……のだが、そう簡単ではない。各記事のテンプレートに貼るだけならば次のようなソースで足る
<sup>
<a href="#fn-677-1"
   id="efn-677-1"
   title="注意：data-via 属性は各自のアカウント名に変更すること。以下同様。">
*1</a>
</sup>
。</p>
<pre class='auto-links:false;brush:html;'>
&lt;a href=&quot;http://twitter.com/share&quot; class=&quot;twitter-share-button&quot;
    data-count=&quot;none&quot; data-via=&quot;delphinus35&quot; data-lang=&quot;ja&quot;&gt;Tweet&lt;/a&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;http://platform.twitter.com/widgets.js&quot;&gt;&lt;/script&gt;
</pre>
<p>これはクリックしたページのタイトルと URL を Tweet してくれるボタンを生成する。つまり、トップページやアーカイブページ等、複数の記事が載るページでは細工が必要だ。</p>
<p>と言う訳で、このサイトで使っている MT 用のテーマ“<a class="exlink" href="http://mt.vicuna.jp/">mt.Vicuna</a>”に Tweet Button を設置した経過を書いておく。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html#extended" title="続きを読む - 【MovableType】Twitter につぶやくボタンを各記事に設置する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html#comments" title="【MovableType】Twitter につぶやくボタンを各記事に設置する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html#trackback" title="【MovableType】Twitter につぶやくボタンを各記事に設置する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/667"
    dc:title="【MovableType】一定数の記事ごとにページを分割する"
    dc:identifier="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html"
    dc:subject="Movable Type"
    dc:description="MT には最近のバージョン（4.3 以降？）からページ送り機能がついている。これ..."
    dc:creator="delphinus"
    dc:date="2010-08-12T20:56:10+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000676">
    <h2>
        <a href="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html">【MovableType】一定数の記事ごとにページを分割する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月12日 20:56</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html" data-text="【MovableType】一定数の記事ごとにページを分割する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>MT には最近のバージョン（4.3 以降？）からページ送り機能がついている。これは長すぎるページを一定間隔に区切って分け、各ページにリンクを付けてくれる機能だ。Google の検索結果の一番下に出てくる「1 2 3 4 5 &raquo;」のような表示と考えればわかりやすい。特に月別やカテゴリー別のページは数百個の記事が並ぶこともあるわけで、記事が多くなったら必ず導入しておきたい。……というか、なんで標準のテーマにこれがないのかね？</p>
<blockquote>
<p>小粋空間: Movable Type 4.3 の新機能（スタティックページのページ分割）<br />
<a class="exlink" href="http://www.koikikukan.com/archives/2009/07/29-005555.php">http://www.koikikukan.com/archives/2009/07/29-005555.php</a></p>
</blockquote>
<p>主に、上のリンクに従って設定した。以下に手順を書いていく。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html#extended" title="続きを読む - 【MovableType】一定数の記事ごとにページを分割する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html#comments" title="【MovableType】一定数の記事ごとにページを分割する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html#trackback" title="【MovableType】一定数の記事ごとにページを分割する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/improve-relational-entries.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/666"
    dc:title="【MovableType】“関連エントリー”の表示を改善する"
    dc:identifier="http://blog.remora.cx/2010/08/improve-relational-entries.html"
    dc:subject="Movable Type"
    dc:description=" 今まで記事の最後にある「関連エントリー」の表示は、記事のカテゴリーに属すものを..."
    dc:creator="delphinus"
    dc:date="2010-08-11T21:49:32+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000675">
    <h2>
        <a href="http://blog.remora.cx/2010/08/improve-relational-entries.html">【MovableType】“関連エントリー”の表示を改善する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月11日 21:49</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/improve-relational-entries.html" data-text="【MovableType】“関連エントリー”の表示を改善する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/improve-relational-entries.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/improve-relational-entries.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <img alt="カテゴリーの例" src="http://blog.remora.cx/2010/08/11/2010-08-11_133729.png" width="205" height="192" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" />
<p>今まで記事の最後にある「関連エントリー」の表示は、記事のカテゴリーに属すものを最新のものから並べただけだった。これでは、記事が複数のカテゴリーに属す場合、メインカテゴリーの関連記事が表示されない場合がある。</p>
<p>例えば、前回の記事「」は右図のように 4 つのカテゴリーに属していて、そのうち一番上の「keyhac」カテゴリーがメインカテゴリーだ。</p>
<p>この状態で従来の「関連エントリー」表示を行うと次のようになる。</p>
<img alt="従来の関連エントリー" src="http://blog.remora.cx/2010/08/11/2010-08-11_133021.png" width="442" height="231" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" />
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/improve-relational-entries.html#extended" title="続きを読む - 【MovableType】“関連エントリー”の表示を改善する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/improve-relational-entries.html#comments" title="【MovableType】“関連エントリー”の表示を改善する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/improve-relational-entries.html#trackback" title="【MovableType】“関連エントリー”の表示を改善する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/665"
    dc:title="keyhac で Emacs 風ショートカットを定義する"
    dc:identifier="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html"
    dc:subject="keyhac"
    dc:description="キーカスタマイズソフト keyhac において、“複数のキー入力へアクションを割..."
    dc:creator="delphinus"
    dc:date="2010-08-09T17:26:33+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000674">
    <h2>
        <a href="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html">keyhac で Emacs 風ショートカットを定義する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月 9日 17:26</li>
    <li class="category"><a href="http://blog.remora.cx/windows/" title="Windows Index">Windows</a> | <a href="http://blog.remora.cx/keyboard/keyhac/" title="keyhac Index">keyhac</a> | <a href="http://blog.remora.cx/python/" title="python Index">python</a> | <a href="http://blog.remora.cx/keyboard/" title="キーボード Index">キーボード</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html" data-text="keyhac で Emacs 風ショートカットを定義する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>キーカスタマイズソフト <a class="exlink" href="http://sites.google.com/site/craftware/keyhac">keyhac</a> において、“複数のキー入力へアクションを割り当てる”ことが可能になっていた。要するにこれは、Emacs 風のショートカットを実現するためのものだ。</p>
<pre class='brush:python;' title='config.py の例１'>
from keyhac import *

def configure( km ):
    # グローバルキーマップ
    kmg = km.defineWindowKeymap()

    # “切り取り”は C-W に退避させておく
    kmg[ &quot;C-W&quot; ] = &quot;C-X&quot;

    # マルチストローク設定
    kmg[ &quot;C-X&quot; ] = km.defineMultiStrokeKeymap()
    # 開く
    kmg[ &quot;C-X&quot; ][ &quot;C-F&quot; ] = &quot;C-O&quot;
    # 上書き保存
    kmg[ &quot;C-X&quot; ][ &quot;C-S&quot; ] = &quot;C-S&quot;
    # 名前をつけて保存
    kmg[ &quot;C-X&quot; ][ &quot;C-W&quot; ] = &quot;A-F&quot;, &quot;A&quot;
    # 終了
    kmg[ &quot;C-X&quot; ][ &quot;C-C&quot; ] = &quot;A-F4&quot;
</pre>
<p>これにより、<kbd>Control</kbd> を押下したまま、<kbd>X</kbd><kbd>C</kbd> と順に叩いてウィンドウを閉じることができる。さらに応用として、</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html#extended" title="続きを読む - keyhac で Emacs 風ショートカットを定義する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html#comments" title="keyhac で Emacs 風ショートカットを定義する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html#trackback" title="keyhac で Emacs 風ショートカットを定義する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/movable-type-upgrade.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/661"
    dc:title="【Movable Type】5.0 → 5.02 へのアップグレード"
    dc:identifier="http://blog.remora.cx/2010/08/movable-type-upgrade.html"
    dc:subject="Movable Type"
    dc:description="今まで面倒で放置していたのだが、Movable Type を 5.0 から 5...."
    dc:creator="delphinus"
    dc:date="2010-08-02T12:01:02+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000670">
    <h2>
        <a href="http://blog.remora.cx/2010/08/movable-type-upgrade.html">【Movable Type】5.0 → 5.02 へのアップグレード</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月 2日 12:01</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/etc/mysql/" title="MySQL Index">MySQL</a> | <a href="http://blog.remora.cx/perl/" title="perl Index">perl</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/movable-type-upgrade.html" data-text="【Movable Type】5.0 → 5.02 へのアップグレード" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/movable-type-upgrade.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/movable-type-upgrade.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>今まで面倒で放置していたのだが、Movable Type を 5.0 から 5.02 にアップグレードしてみた。</p>
<blockquote>
<p>Movable Type 5.0 から 5.0x へのアップグレード<br />
<a class="exlink" href="http://www.movabletype.jp/documentation/mt5/upgrade/mt5.html">http://www.movabletype.jp/documentation/mt5/upgrade/mt5.html</a></p>
</blockquote>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/movable-type-upgrade.html#extended" title="続きを読む - 【Movable Type】5.0 → 5.02 へのアップグレード" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/movable-type-upgrade.html#comments" title="【Movable Type】5.0 → 5.02 へのアップグレード へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/movable-type-upgrade.html#trackback" title="【Movable Type】5.0 → 5.02 へのアップグレード へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/07/emukai.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/648"
    dc:title="江迎？ えむかい？"
    dc:identifier="http://blog.remora.cx/2010/07/emukai.html"
    dc:subject="その他"
    dc:description="今日は書くこともないので前々から気になってたどうでもいい小ネタについて。 ..."
    dc:creator="delphinus"
    dc:date="2010-07-26T20:22:46+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000651">
    <h2>
        <a href="http://blog.remora.cx/2010/07/emukai.html">江迎？ えむかい？</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年7月26日 20:22</li>
    <li class="category"><a href="http://blog.remora.cx/etc/" title="その他 Index">その他</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/07/emukai.html" data-text="江迎？ えむかい？" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/07/emukai.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/07/emukai.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>今日は書くこともないので前々から気になってたどうでもいい小ネタについて。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/07/emukai.html#extended" title="続きを読む - 江迎？ えむかい？" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/07/emukai.html#comments" title="江迎？ えむかい？ へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/07/emukai.html#trackback" title="江迎？ えむかい？ へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/07/the-borrower-arrietty.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/647"
    dc:title="「借りぐらしのアリエッティ」感想"
    dc:identifier="http://blog.remora.cx/2010/07/the-borrower-arrietty.html"
    dc:subject="映画"
    dc:description=" 宮崎駿が監督しないジブリ作品というと、直近では「ゲド戦記」というどうしようもな..."
    dc:creator="delphinus"
    dc:date="2010-07-25T21:03:45+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000650">
    <h2>
        <a href="http://blog.remora.cx/2010/07/the-borrower-arrietty.html">「借りぐらしのアリエッティ」感想</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年7月25日 21:03</li>
    <li class="category"><a href="http://blog.remora.cx/cinema/" title="映画 Index">映画</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/07/the-borrower-arrietty.html" data-text="「借りぐらしのアリエッティ」感想" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/07/the-borrower-arrietty.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/07/the-borrower-arrietty.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <iframe class="youtube-player" width="640" height="385" src="http://www.youtube.com/embed/SuY6wrMDptA"></iframe>
<p>宮崎駿が監督しないジブリ作品というと、直近では<a class="exlink" href="http://ja.wikipedia.org/wiki/ゲド戦記">「ゲド戦記」</a>というどうしようもない例があった。そんなわけでだいぶハードルを下げて見に行ったつもりだったのだが……。う〜ん。これは、<b>“ゲドよりはマシ”</b>といったレベルかも知れない。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/07/the-borrower-arrietty.html#extended" title="続きを読む - 「借りぐらしのアリエッティ」感想" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/07/the-borrower-arrietty.html#comments" title="「借りぐらしのアリエッティ」感想 へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/07/the-borrower-arrietty.html#trackback" title="「借りぐらしのアリエッティ」感想 へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">2</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/07/my-our-local.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/646"
    dc:title="【Perl】my と our と local と……"
    dc:identifier="http://blog.remora.cx/2010/07/my-our-local.html"
    dc:subject="perl"
    dc:description="当たり前のことなのだけど、改めて纏めてみる。レキシカルスコープとパッケージの範囲..."
    dc:creator="delphinus"
    dc:date="2010-07-23T17:40:55+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000649">
    <h2>
        <a href="http://blog.remora.cx/2010/07/my-our-local.html">【Perl】my と our と local と……</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年7月23日 17:40</li>
    <li class="category"><a href="http://blog.remora.cx/perl/" title="perl Index">perl</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/07/my-our-local.html" data-text="【Perl】my と our と local と……" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/07/my-our-local.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/07/my-our-local.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>当たり前のことなのだけど、改めて纏めてみる。レキシカルスコープとパッケージの範囲って全然違うんだなあ。</p>
<h3><code>our</code> と <code>my</code></h3>
<pre class='brush:perl;highlight:[10,13,14];' title='サンプル 1'>
#!/usr/bin/perl
use strict;
use feature qw! say !;

package AAA;
our $our_var = 123;
my $my_var = 567;

package DDD;
say '$our_var      : ' . ( $our_var      // &quot;undefined&quot; );
say '$AAA::our_var : ' . ( $AAA::our_var // &quot;undefined&quot; );
say '$DDD::our_var : ' . ( $DDD::our_var // &quot;undefined&quot; );
say '$my_var       : ' . ( $my_var       // &quot;undefined&quot; );
say '$AAA::my_var  : ' . ( $AAA::my_var  // &quot;undefined&quot; );
say '$DDD::my_var  : ' . ( $DDD::my_var  // &quot;undefined&quot; );
</pre>
<pre class='brush:plain;gutter:false;' title='実行例 1'>
$our_var      : 123
$AAA::our_var : 123
$DDD::our_var : undefined
$my_var       : 567
$AAA::my_var  : undefined
$DDD::my_var  : undefined
</pre>
<ol>
<li><code>our</code> も <code>my</code> もレキシカルスコープ全体で有効になる。この例の場合、その範囲はスクリプト全体となる。</li>
<li>レキシカルスコープ内では例えパッケージが違っていても参照できる（10, 13 行目）。</li>
<li><code>our</code> は変数をパッケージの名前空間に紐付けする。つまり、<b>グローバル変数を作る</b>。<code>my</code> にそのような効果はないのでパッケージ名を付けても参照できない（14 行目）。</li>
</ol>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/07/my-our-local.html#extended" title="続きを読む - 【Perl】my と our と local と……" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/07/my-our-local.html#comments" title="【Perl】my と our と local と…… へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/07/my-our-local.html#trackback" title="【Perl】my と our と local と…… へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/644"
    dc:title="【Javascript】SyntaxHighlighter 3.0 を Movable Type で使う"
    dc:identifier="http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html"
    dc:subject="javascript"
    dc:description="SyntaxHighlighter を Movable Type で使うプラグインは SyntaxHighlighter 2.x にしか対応していないのだが、最新版の 3.0.83 で無理矢理動かしてみた。"
    dc:creator="delphinus"
    dc:date="2010-07-21T20:01:01+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000647">
    <h2>
        <a href="http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html">【Javascript】SyntaxHighlighter 3.0 を Movable Type で使う</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年7月21日 20:01</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/javascript/" title="javascript Index">javascript</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html" data-text="【Javascript】SyntaxHighlighter 3.0 を Movable Type で使う" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <blockquote>
</blockquote>
<p>SyntaxHighlighter を Movable Type で使うプラグインには次のものがある。</p>
<blockquote>
<p>SyntaxHighlighter<br />
<a class="exlink" href="http://alexgorbatchev.com/SyntaxHighlighter/">http://alexgorbatchev.com/SyntaxHighlighter/</a></p>
<br />
<p>SyntaxHighlighter for Movable Type | kwrogu<br />
<a class="exlink" href="http://blogspot.makotokw.com/portfolio/movabletype/syntaxhighlighter/">http://blogspot.makotokw.com/portfolio/movabletype/syntaxhighlighter/</a></p>
<p>SyntaxHighlighter  for Movable Type « kwLog<br />
<a class="exlink" href="http://blog.makotokw.com/portfolio/movabletype/syntaxhighlighter/">http://blog.makotokw.com/portfolio/movabletype/syntaxhighlighter/</a></p>
</blockquote>
<p>これは SyntaxHighlighter 2.x にしか対応していないのだが、最新版の 3.0.83 で無理矢理動かしてみた。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html#extended" title="続きを読む - 【Javascript】SyntaxHighlighter 3.0 を Movable Type で使う" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html#comments" title="【Javascript】SyntaxHighlighter 3.0 を Movable Type で使う へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html#trackback" title="【Javascript】SyntaxHighlighter 3.0 を Movable Type で使う へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/643"
    dc:title="【Javascript】SyntaxHighlighter 3.0 の新機能と注意点"
    dc:identifier="http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html"
    dc:subject="javascript"
    dc:description="ブログ等でコードをさらすときに必携のスクリプト“SyntaxHighlighte..."
    dc:creator="delphinus"
    dc:date="2010-07-20T23:22:25+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000646">
    <h2>
        <a href="http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html">【Javascript】SyntaxHighlighter 3.0 の新機能と注意点</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年7月20日 23:22</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/javascript/" title="javascript Index">javascript</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html" data-text="【Javascript】SyntaxHighlighter 3.0 の新機能と注意点" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>ブログ等でコードをさらすときに必携のスクリプト“SyntaxHighlighter”がメジャーバージョンアップして 3.0 になっていた。2.0 系、2.1 系よりアップデートするときの新機能と注意点について書いてみる。</p>
<blockquote>
<p>SyntaxHighlighter<br />
<a class="exlink" href="http://alexgorbatchev.com/SyntaxHighlighter/">http://alexgorbatchev.com/SyntaxHighlighter/</a></p>
<p>新機能について<br />
<a class="exlink" href="http://alexgorbatchev.com/SyntaxHighlighter/whatsnew.html">http://alexgorbatchev.com/SyntaxHighlighter/whatsnew.html</a></p>
</blockquote>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html#extended" title="続きを読む - 【Javascript】SyntaxHighlighter 3.0 の新機能と注意点" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html#comments" title="【Javascript】SyntaxHighlighter 3.0 の新機能と注意点 へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html#trackback" title="【Javascript】SyntaxHighlighter 3.0 の新機能と注意点 へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
[/code]
<p>これを以下のように改変した。</p>
[code:xml;title:記事表示部分（改変後）;highlight:[1,2,6]]
<div class="content-nav">
                1
                <a href="http://blog.remora.cx/mt/mt-search.fcgi?IncludeBlogs=4&amp;template_id=1545&amp;limit=10&amp;page=2">2</a>
            <a href="http://blog.remora.cx/mt/mt-search.fcgi?IncludeBlogs=4&amp;template_id=1545&amp;limit=10&amp;page=2" rel="next">Next &raquo;</a>
        </div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/mail-without-charset.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/679"
    dc:title="MobileMe で charset 指定のないメールが文字化けする件"
    dc:identifier="http://blog.remora.cx/2010/08/mail-without-charset.html"
    dc:subject="Web"
    dc:description="MobileMe を使っていると、いくつかのメールが文字化けして届くことに気づい..."
    dc:creator="delphinus"
    dc:date="2010-08-30T22:18:45+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000688">
    <h2>
        <a href="http://blog.remora.cx/2010/08/mail-without-charset.html">MobileMe で charset 指定のないメールが文字化けする件</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月30日 22:18</li>
    <li class="category"><a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/mail-without-charset.html" data-text="MobileMe で charset 指定のないメールが文字化けする件" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/mail-without-charset.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/mail-without-charset.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <a rel="lightbox" href="http://blog.remora.cx/2010/08/30/100830-0001.png"><img alt="100830-0001.png" src="http://blog.remora.cx/assets_c/2010/08/100830-0001-thumb-480x229-400.png" width="480" height="229" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" /></a><p><a class="exlink" href="http://www.apple.com/jp/mobileme/">MobileMe</a> を使っていると、いくつかのメールが文字化けして届くことに気づいた。調べてみると、次の条件が重なった場合に化けるようだ。</p>
<ol>
<li>メールヘッダの <code>Content-Type</code> 節において <code>charset</code> が指定されていない。</li>
<li>メール本文に ASCII 文字以外が使用されている。</li>
<li>メール本文が UTF-8 以外でエンコードされている。</li>
</ol>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/mail-without-charset.html#extended" title="続きを読む - MobileMe で charset 指定のないメールが文字化けする件" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/mail-without-charset.html#comments" title="MobileMe で charset 指定のないメールが文字化けする件 へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/mail-without-charset.html#trackback" title="MobileMe で charset 指定のないメールが文字化けする件 へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/put-youtube-for-html5.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/674"
    dc:title="HTML5 に対応した Youtube 動画を貼る方法"
    dc:identifier="http://blog.remora.cx/2010/08/put-youtube-for-html5.html"
    dc:subject="Movable Type"
    dc:description="Youtube の動画をブログ等に貼るとき、従来は &amp;lt;object&amp;gt;..."
    dc:creator="delphinus"
    dc:date="2010-08-28T18:31:20+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000683">
    <h2>
        <a href="http://blog.remora.cx/2010/08/put-youtube-for-html5.html">HTML5 に対応した Youtube 動画を貼る方法</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月28日 18:31</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a> | <a href="http://blog.remora.cx/unix/mac/iphone/" title="iPhone Index">iPhone</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/put-youtube-for-html5.html" data-text="HTML5 に対応した Youtube 動画を貼る方法" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/put-youtube-for-html5.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/put-youtube-for-html5.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>Youtube の動画をブログ等に貼るとき、従来は <code>&lt;object&gt;</code> タグを使って次のように書いていた。</p>
<pre class='auto-links:false;brush:html;' title='「かりぐらしのアリエッティ」予告編'>
&lt;object width=&quot;640&quot; height=&quot;385&quot;&gt;
    &lt;param name=&quot;movie&quot; value=&quot;http://www.youtube.com/v/SuY6wrMDptA&amp;hl=ja_JP&amp;fs=1&quot;&gt;&lt;/param&gt;
    &lt;param name=&quot;allowFullScreen&quot; value=&quot;true&quot;&gt;&lt;/param&gt;
    &lt;param name=&quot;allowscriptaccess&quot; value=&quot;always&quot;&gt;&lt;/param&gt;
    &lt;embed src=&quot;http://www.youtube.com/v/SuY6wrMDptA&amp;hl=ja_JP&amp;fs=1&quot;
        type=&quot;application/x-shockwave-flash&quot; allowscriptaccess=&quot;always&quot;
        allowfullscreen=&quot;true&quot; width=&quot;640&quot; height=&quot;385&quot;&gt;&lt;/embed&gt;
&lt;/object&gt;
</pre>
<p>これは Flash による再生にしか対応していないし、お世辞にもきれいなタグとも言えない
<sup>
<a href="#fn-683-1"
   id="efn-683-1"
   title="さらに、W3C Validation も通らない。">
*1</a>
</sup>
。そこで、HTML5 版 Youtube にも対応したスマートなタグが推奨されている。</p>
<blockquote>
<p>【レビュー】YouTubeビデオの組み込みでHTML5 VideoとFlashの両方をサポートする方法 | ネット | マイコミジャーナル<br />
<a class="exlink" href="http://journal.mycom.co.jp/articles/2010/07/26/youtube-for-flash-and-html5/index.html">http://journal.mycom.co.jp/articles/2010/07/26/youtube-for-flash-and-html5/index.html</a></p>
</blockquote>
<pre class='auto-links:false;brush:html;highlight:[4];' title='「かりぐらしのアリエッティ」予告編（HTML5 版）'>
&lt;iframe class=&quot;youtube-player&quot;
    width=&quot;640&quot; height=&quot;385&quot;
    src=&quot;http://www.youtube.com/embed/SuY6wrMDptA&quot;
    frameborder=&quot;0&quot;
&gt;&lt;/iframe&gt;
</pre>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/put-youtube-for-html5.html#extended" title="続きを読む - HTML5 に対応した Youtube 動画を貼る方法" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/put-youtube-for-html5.html#comments" title="HTML5 に対応した Youtube 動画を貼る方法 へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/put-youtube-for-html5.html#trackback" title="HTML5 に対応した Youtube 動画を貼る方法 へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/676"
    dc:title="公式 Tweet Button は HTML5 用？"
    dc:identifier="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html"
    dc:subject="Twitter"
    dc:description="ページを構成する HTML の正当性を検査してくれるサービスとしては W3C M..."
    dc:creator="delphinus"
    dc:date="2010-08-24T16:57:34+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000685">
    <h2>
        <a href="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html">公式 Tweet Button は HTML5 用？</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月24日 16:57</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/twitter/" title="Twitter Index">Twitter</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html" data-text="公式 Tweet Button は HTML5 用？" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>ページを構成する HTML の正当性を検査してくれるサービスとしては <b>W3C Markup Validation Service</b> が便利だ。</p>
<blockquote>
<p>The W3C Markup Validation Service<br />
<a class="exlink" href="http://validator.w3.org/">http://validator.w3.org/</a></p>
</blockquote>
<p>以前このサイトは XHTML 1.0 で構築し、W3C Validation Service でも確認をとっていたのだが、「」で紹介した <b>Tweet Button</b> を設置したあたりからおかしくなった。原因はコードに出てくる <b><code>data-xxxx</code></b> 属性だ。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html#extended" title="続きを読む - 公式 Tweet Button は HTML5 用？" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html#comments" title="公式 Tweet Button は HTML5 用？ へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/is-official-tweet-button-for-html5.html#trackback" title="公式 Tweet Button は HTML5 用？ へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/twitter-on-sidebar.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/675"
    dc:title="【MovableType】Twitter のつぶやきをサイドバーに表示する"
    dc:identifier="http://blog.remora.cx/2010/08/twitter-on-sidebar.html"
    dc:subject="Twitter"
    dc:description="Twitter のログをブログに表示してみた記録。基本的には簡単。ジェネレータで..."
    dc:creator="delphinus"
    dc:date="2010-08-19T21:11:12+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000684">
    <h2>
        <a href="http://blog.remora.cx/2010/08/twitter-on-sidebar.html">【MovableType】Twitter のつぶやきをサイドバーに表示する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月19日 21:11</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/twitter/" title="Twitter Index">Twitter</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a> | <a href="http://blog.remora.cx/web/javascript/" title="javascript Index">javascript</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/twitter-on-sidebar.html" data-text="【MovableType】Twitter のつぶやきをサイドバーに表示する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/twitter-on-sidebar.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/twitter-on-sidebar.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>Twitter のログをブログに表示してみた記録。基本的には簡単。ジェネレータで生成した HTML を貼り付けるだけだ。</p>
<blockquote>
<p>[Movable Type] Twitterウィジェットをサイドバーに追加してみた - No Second Life<br />
<a class="exlink" href="http://www.ttcbn.net/no_second_life/2009/02/movable-type-twitter.html">http://www.ttcbn.net/no_second_life/2009/02/movable-type-twitter.html</a></p>
</blockquote>
<p>だけどそのままでは味も素っ気もない。読み込みが終わるまで空欄のままだし、表示も白黒になってしまう。ある程度整形して表示するようにしてみた。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/twitter-on-sidebar.html#extended" title="続きを読む - 【MovableType】Twitter のつぶやきをサイドバーに表示する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/twitter-on-sidebar.html#comments" title="【MovableType】Twitter のつぶやきをサイドバーに表示する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/twitter-on-sidebar.html#trackback" title="【MovableType】Twitter のつぶやきをサイドバーに表示する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/670"
    dc:title="【Unix】タイムスタンプを変更する"
    dc:identifier="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html"
    dc:subject="Unix系OS"
    dc:description="ものすごく基本的なことなのだけれど、実際必要になるまで覚えてなかった。 タイムス..."
    dc:creator="delphinus"
    dc:date="2010-08-14T23:07:31+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000679">
    <h2>
        <a href="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html">【Unix】タイムスタンプを変更する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月14日 23:07</li>
    <li class="category"><a href="http://blog.remora.cx/unix/" title="Unix系OS Index">Unix系OS</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html" data-text="【Unix】タイムスタンプを変更する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/change-timestamp-in-unix.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/change-timestamp-in-unix.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>ものすごく基本的なことなのだけれど、実際必要になるまで覚えてなかった。</p>
<h3>タイムスタンプを調べる</h3>
<p>今日 iPhone で撮った動画のタイムスタンプが訳の分からない日付になっていて困った。ほかの写真と全く違うのだ。</p>
<pre class='brush:bash;gutter:false;' title='昭和 3 年 1 月 19 日！？'>
$ ls -l IMG_0036.MOV
-rw-------  1 delphinus  staff  46099763  1 19  1928 IMG_0036.MOV
</pre>
<p>と言う訳で、改めてお勉強。ここに現れる時刻はいったい何なのか。</p>
<blockquote>
<p>UNIX の部屋 コマンド検索:タイムスタンプ (*BSD/Linux)<br />
<a class="exlink" href="http://x68000.q-e-d.net/~68user/unix/pickup?%A5%BF%A5%A4%A5%E0%A5%B9%A5%BF%A5%F3%A5%D7">http://x68000.q-e-d.net/~68user/unix/pickup?%A5%BF%A5%A4%A5%E0%A5%B9%A5%BF%A5%F3%A5%D7</a></p>
</blockquote>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html#extended" title="続きを読む - 【Unix】タイムスタンプを変更する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html#comments" title="【Unix】タイムスタンプを変更する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/change-timestamp-in-unix.html#trackback" title="【Unix】タイムスタンプを変更する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/668"
    dc:title="【MovableType】Twitter につぶやくボタンを各記事に設置する"
    dc:identifier="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html"
    dc:subject="Movable Type"
    dc:description="アカウントをとったまま放置していた Twitter を使ってみることにした。ちょ..."
    dc:creator="delphinus"
    dc:date="2010-08-13T13:16:27+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000677">
    <h2>
        <a href="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html">【MovableType】Twitter につぶやくボタンを各記事に設置する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月13日 13:16</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html" data-text="【MovableType】Twitter につぶやくボタンを各記事に設置する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>アカウントをとったまま放置していた Twitter を使ってみることにした。ちょうどうまいことに公式の“Tweet Button”なるものが発表されて話題になっているところだったので、ついでにこのブログにも設置してみた。こんな感じ。<ins datetime="2010-08-13T15:51:30+09:00"><a class="exlink" href="http://www.itmedia.co.jp/enterprise/articles/1008/13/news018.html">ITmedia の記事</a>に“Twitter Button”なんて書かれてたからそれ採用したけど、よく見たら“Tweet Button”だね。ｶｺﾜﾙｲので修正しました。</ins></p>
<img alt="2010-08-13_131026.png" src="http://blog.remora.cx/2010/08/13/2010-08-13_131026.png" width="476" height="76" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" />
<blockquote>
<p>Twitter / ツイートボタン<br />
<a class="exlink" href="http://twitter.com/goodies/tweetbutton">http://twitter.com/goodies/tweetbutton</a></p>
</blockquote>
<p>このサイトで作成した HTML タグを MT のテンプレートに貼ればいい……のだが、そう簡単ではない。各記事のテンプレートに貼るだけならば次のようなソースで足る
<sup>
<a href="#fn-677-1"
   id="efn-677-1"
   title="注意：data-via 属性は各自のアカウント名に変更すること。以下同様。">
*1</a>
</sup>
。</p>
<pre class='auto-links:false;brush:html;'>
&lt;a href=&quot;http://twitter.com/share&quot; class=&quot;twitter-share-button&quot;
    data-count=&quot;none&quot; data-via=&quot;delphinus35&quot; data-lang=&quot;ja&quot;&gt;Tweet&lt;/a&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;http://platform.twitter.com/widgets.js&quot;&gt;&lt;/script&gt;
</pre>
<p>これはクリックしたページのタイトルと URL を Tweet してくれるボタンを生成する。つまり、トップページやアーカイブページ等、複数の記事が載るページでは細工が必要だ。</p>
<p>と言う訳で、このサイトで使っている MT 用のテーマ“<a class="exlink" href="http://mt.vicuna.jp/">mt.Vicuna</a>”に Tweet Button を設置した経過を書いておく。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html#extended" title="続きを読む - 【MovableType】Twitter につぶやくボタンを各記事に設置する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html#comments" title="【MovableType】Twitter につぶやくボタンを各記事に設置する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/twitter-button-on-movabletype.html#trackback" title="【MovableType】Twitter につぶやくボタンを各記事に設置する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/667"
    dc:title="【MovableType】一定数の記事ごとにページを分割する"
    dc:identifier="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html"
    dc:subject="Movable Type"
    dc:description="MT には最近のバージョン（4.3 以降？）からページ送り機能がついている。これ..."
    dc:creator="delphinus"
    dc:date="2010-08-12T20:56:10+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000676">
    <h2>
        <a href="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html">【MovableType】一定数の記事ごとにページを分割する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月12日 20:56</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html" data-text="【MovableType】一定数の記事ごとにページを分割する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>MT には最近のバージョン（4.3 以降？）からページ送り機能がついている。これは長すぎるページを一定間隔に区切って分け、各ページにリンクを付けてくれる機能だ。Google の検索結果の一番下に出てくる「1 2 3 4 5 &raquo;」のような表示と考えればわかりやすい。特に月別やカテゴリー別のページは数百個の記事が並ぶこともあるわけで、記事が多くなったら必ず導入しておきたい。……というか、なんで標準のテーマにこれがないのかね？</p>
<blockquote>
<p>小粋空間: Movable Type 4.3 の新機能（スタティックページのページ分割）<br />
<a class="exlink" href="http://www.koikikukan.com/archives/2009/07/29-005555.php">http://www.koikikukan.com/archives/2009/07/29-005555.php</a></p>
</blockquote>
<p>主に、上のリンクに従って設定した。以下に手順を書いていく。</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html#extended" title="続きを読む - 【MovableType】一定数の記事ごとにページを分割する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html#comments" title="【MovableType】一定数の記事ごとにページを分割する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/add-pagination-to-movabletype.html#trackback" title="【MovableType】一定数の記事ごとにページを分割する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/improve-relational-entries.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/666"
    dc:title="【MovableType】“関連エントリー”の表示を改善する"
    dc:identifier="http://blog.remora.cx/2010/08/improve-relational-entries.html"
    dc:subject="Movable Type"
    dc:description=" 今まで記事の最後にある「関連エントリー」の表示は、記事のカテゴリーに属すものを..."
    dc:creator="delphinus"
    dc:date="2010-08-11T21:49:32+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000675">
    <h2>
        <a href="http://blog.remora.cx/2010/08/improve-relational-entries.html">【MovableType】“関連エントリー”の表示を改善する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月11日 21:49</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/web/" title="Web Index">Web</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/improve-relational-entries.html" data-text="【MovableType】“関連エントリー”の表示を改善する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/improve-relational-entries.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/improve-relational-entries.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <img alt="カテゴリーの例" src="http://blog.remora.cx/2010/08/11/2010-08-11_133729.png" width="205" height="192" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" />
<p>今まで記事の最後にある「関連エントリー」の表示は、記事のカテゴリーに属すものを最新のものから並べただけだった。これでは、記事が複数のカテゴリーに属す場合、メインカテゴリーの関連記事が表示されない場合がある。</p>
<p>例えば、前回の記事「」は右図のように 4 つのカテゴリーに属していて、そのうち一番上の「keyhac」カテゴリーがメインカテゴリーだ。</p>
<p>この状態で従来の「関連エントリー」表示を行うと次のようになる。</p>
<img alt="従来の関連エントリー" src="http://blog.remora.cx/2010/08/11/2010-08-11_133021.png" width="442" height="231" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" />
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/improve-relational-entries.html#extended" title="続きを読む - 【MovableType】“関連エントリー”の表示を改善する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/improve-relational-entries.html#comments" title="【MovableType】“関連エントリー”の表示を改善する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/improve-relational-entries.html#trackback" title="【MovableType】“関連エントリー”の表示を改善する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/665"
    dc:title="keyhac で Emacs 風ショートカットを定義する"
    dc:identifier="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html"
    dc:subject="keyhac"
    dc:description="キーカスタマイズソフト keyhac において、“複数のキー入力へアクションを割..."
    dc:creator="delphinus"
    dc:date="2010-08-09T17:26:33+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000674">
    <h2>
        <a href="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html">keyhac で Emacs 風ショートカットを定義する</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月 9日 17:26</li>
    <li class="category"><a href="http://blog.remora.cx/windows/" title="Windows Index">Windows</a> | <a href="http://blog.remora.cx/keyboard/keyhac/" title="keyhac Index">keyhac</a> | <a href="http://blog.remora.cx/python/" title="python Index">python</a> | <a href="http://blog.remora.cx/keyboard/" title="キーボード Index">キーボード</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html" data-text="keyhac で Emacs 風ショートカットを定義する" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>キーカスタマイズソフト <a class="exlink" href="http://sites.google.com/site/craftware/keyhac">keyhac</a> において、“複数のキー入力へアクションを割り当てる”ことが可能になっていた。要するにこれは、Emacs 風のショートカットを実現するためのものだ。</p>
<pre class='brush:python;' title='config.py の例１'>
from keyhac import *

def configure( km ):
    # グローバルキーマップ
    kmg = km.defineWindowKeymap()

    # “切り取り”は C-W に退避させておく
    kmg[ &quot;C-W&quot; ] = &quot;C-X&quot;

    # マルチストローク設定
    kmg[ &quot;C-X&quot; ] = km.defineMultiStrokeKeymap()
    # 開く
    kmg[ &quot;C-X&quot; ][ &quot;C-F&quot; ] = &quot;C-O&quot;
    # 上書き保存
    kmg[ &quot;C-X&quot; ][ &quot;C-S&quot; ] = &quot;C-S&quot;
    # 名前をつけて保存
    kmg[ &quot;C-X&quot; ][ &quot;C-W&quot; ] = &quot;A-F&quot;, &quot;A&quot;
    # 終了
    kmg[ &quot;C-X&quot; ][ &quot;C-C&quot; ] = &quot;A-F4&quot;
</pre>
<p>これにより、<kbd>Control</kbd> を押下したまま、<kbd>X</kbd><kbd>C</kbd> と順に叩いてウィンドウを閉じることができる。さらに応用として、</p>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html#extended" title="続きを読む - keyhac で Emacs 風ショートカットを定義する" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html#comments" title="keyhac で Emacs 風ショートカットを定義する へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html#trackback" title="keyhac で Emacs 風ショートカットを定義する へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
         xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
    rdf:about="http://blog.remora.cx/2010/08/movable-type-upgrade.html"
    trackback:ping="http://blog.remora.cx/mt/mt-tb.fcgi/661"
    dc:title="【Movable Type】5.0 → 5.02 へのアップグレード"
    dc:identifier="http://blog.remora.cx/2010/08/movable-type-upgrade.html"
    dc:subject="Movable Type"
    dc:description="今まで面倒で放置していたのだが、Movable Type を 5.0 から 5...."
    dc:creator="delphinus"
    dc:date="2010-08-02T12:01:02+09:00" />
</rdf:RDF>
-->
<div class="section entry" id="entry000670">
    <h2>
        <a href="http://blog.remora.cx/2010/08/movable-type-upgrade.html">【Movable Type】5.0 → 5.02 へのアップグレード</a>
    </h2>
    <ul class="info">
    <li class="author">Posted by: <span class="name"><a href="mailto:delphinus@remora.cx">delphinus</a></span></li>
    <li class="date">2010年8月 2日 12:01</li>
    <li class="category"><a href="http://blog.remora.cx/web/movable-type/" title="Movable Type Index">Movable Type</a> | <a href="http://blog.remora.cx/etc/mysql/" title="MySQL Index">MySQL</a> | <a href="http://blog.remora.cx/perl/" title="perl Index">perl</a></li>
    <li class="twitter"><a href="http://twitter.com/share" class="twitter-share-button exlink" data-url="http://blog.remora.cx/2010/08/movable-type-upgrade.html" data-text="【Movable Type】5.0 → 5.02 へのアップグレード" data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a></li>
    <li class="hatena"><a class="hatena_bookmark exlink" href="http://b.hatena.ne.jp/entry/http://blog.remora.cx/2010/08/movable-type-upgrade.html"><img src="http://b.hatena.ne.jp/entry/image/normal/http://blog.remora.cx/2010/08/movable-type-upgrade.html" alt="はてなブックマーク数" /></a></li>
</ul>
    <div class="textBody">
        <p>今まで面倒で放置していたのだが、Movable Type を 5.0 から 5.02 にアップグレードしてみた。</p>
<blockquote>
<p>Movable Type 5.0 から 5.0x へのアップグレード<br />
<a class="exlink" href="http://www.movabletype.jp/documentation/mt5/upgrade/mt5.html">http://www.movabletype.jp/documentation/mt5/upgrade/mt5.html</a></p>
</blockquote>
        <p class="continue">
            <a href="http://blog.remora.cx/2010/08/movable-type-upgrade.html#extended" title="続きを読む - 【Movable Type】5.0 → 5.02 へのアップグレード" rel="nofollow">Continue reading</a>
        </p>
    </div>
    <ul class="reaction">
    <li class="comment">
        <a href="http://blog.remora.cx/2010/08/movable-type-upgrade.html#comments" title="【Movable Type】5.0 → 5.02 へのアップグレード へのコメント" rel="nofollow">Comments</a>: <span class="count">0</span></li>
    <li class="trackback">
        <a href="http://blog.remora.cx/2010/08/movable-type-upgrade.html#trackback" title="【Movable Type】5.0 → 5.02 へのアップグレード へのトラックバック" rel="nofollow">TrackBacks</a>: <span class="count">0</span></li>
</ul>
</div>
<div class="content-nav">
                1
                <a href="http://blog.remora.cx/mt/mt-search.fcgi?IncludeBlogs=4&amp;template_id=1545&amp;limit=10&amp;page=2">2</a>
            <a href="http://blog.remora.cx/mt/mt-search.fcgi?IncludeBlogs=4&amp;template_id=1545&amp;limit=10&amp;page=2" rel="next">Next &raquo;</a>
        </div>
[/code]
<p>ハイライトした部分が変更点である。<a class="exlink" href="http://www.koikikukan.com/archives/2009/07/29-005555.php">参考リンク</a>では <b><code>search_results="1"</code></b> の部分が抜けていたので少し混乱した。</p>
<h3>スタイルシートの設定</h3>
<p>これはおまけだが、スタイルシートを設定して見栄えを良くしておこう。これこそサイトによって千差万別なので、一つの例として挙げておく。</p>
[code:css]
/* Search Pagination */
div.content-nav {
    font-size: 114%;
    padding: 0.2em;
    margin: 1em 12.5% !important;
    text-align: center;
    color: #086dac;
    background-color: #ebf1f2;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
[/code]
<p>以上で設定は完了だ。うまく行ったら次のように各ページへのリンクが貼られているだろう。</p>
<a rel="lightbox" href="http://blog.remora.cx/2010/08/12/100812-0001.png"><img alt="100812-0001.png" src="http://blog.remora.cx/assets_c/2010/08/100812-0001-thumb-480x390-394.png" width="480" height="390" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" /></a>
<h3>不具合への対応</h3>
<a rel="lightbox" href="http://blog.remora.cx/2010/08/12/100811-0001.png"><img alt="100811-0001.png" src="http://blog.remora.cx/assets_c/2010/08/100811-0001-thumb-240x144-392.png" width="240" height="144" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a>
<p>標準以外のテーマを使っていたりすると、2 ページ目以降のリンクをクリックしたときに<b>「テンプレートはインデックスでないアーカイブタイプ用の記事リストidを持たなければなりません」</b>というエラーが出て正常に作動しないことがある（右図参照）。これはテンプレートの属性が間違っているために（？）起こるものなので、データベースを直に書き換えて直してしまおう。</p>
<blockquote>
<p>Movable Type 5β4でのページ送りの不具合と修正 - The blog of H.Fujimoto<br />
<a class="exlink" href="http://www.h-fj.com/blog/archives/2009/10/26-113417.php">http://www.h-fj.com/blog/archives/2009/10/26-113417.php</a></p>
</blockquote>
<p>修正するには問題が起こったテンプレートの ID を特定しないといけない。テンプレート編集画面を開いたときその URL が以下のものだったとする。</p>
[code:plain;gutter:false;auto-links:false]
http://www.example.com/mt/mt.cgi?__mode=view&_type=template&id=1234&blog_id=99
[/code]
<p>この中の<b><code>“1234”</code></b>が ID だ。この ID をメモしておいて mysql にログインする<fn>(参考リンクでは <a class="exlink" href="http://www.phpmyadmin.net/home_page/index.php">phpMyAdmin</a> が推奨されているが、今回は面倒なので全部 mysql コマンドで処理してしまった。)</fn>。</p>
[code:sql;gutter:false;title:カテゴリー別アーカイブテンプレートの場合]
$ /usr/local/mysql/bin/mysql -uroot -p mt
Enter password:
mysql> select template_identifier from mt_template where template_id = 1234;
+------------------------+
| template_identifier    |
+------------------------+
| entry_listing_category |
+------------------------+
1 row in set (0.00 sec)
mysql>
[/code]
<p>ページ送りのためには <code>template_identifier</code> が <code>～entry_listing</code> の形式になっている必要がある。mysql コマンド上から次の SQL 文を実行しよう。</p>
[code:sql;gutter:false]
mysql> update mt_template set template_identifier = 'category_entry_listing' where template_id = 1234;
Query OK, 1 row affected (0.00 sec)
Rows matched: 1  Changed: 1  Warnings: 0
mysql>
[/code]
<p>月別アーカイブテンプレートでは <code>template_identifier</code> が <code>entry_listing_databased</code> となっていたので、同様にして <b><code>databased_entry_listing</code></b> に書き換えた。</p>
[code:sql;gutter:false;title:月別アーカイブテンプレートの場合]
mysql> select template_identifier from mt_template where template_id = 2345;
+-------------------------+
| template_identifier     |
+-------------------------+
| entry_listing_databased |
+-------------------------+
1 row in set (0.00 sec)
mysql> update mt_template set template_identifier = 'databased_entry_listing' where template_id = 2345;
Query OK, 1 row affected (0.00 sec)
Rows matched: 1  Changed: 1  Warnings: 0
mysql>
[/code]
]]>
    </content>
</entry>
<entry>
    <title>【MovableType】“関連エントリー”の表示を改善する</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/improve-relational-entries.html" />
    <id>tag:blog.remora.cx,2010://4.675</id>
    <published>2010-08-11T12:49:32Z</published>
    <updated>2010-08-11T12:49:37Z</updated>
    <summary> 今まで記事の最後にある「関連エントリー」の表示は、記事のカテゴリーに属すものを...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Movable Type" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="タグ" label="タグ" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<img alt="カテゴリーの例" src="http://blog.remora.cx/2010/08/11/2010-08-11_133729.png" width="205" height="192" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" />
<p>今まで記事の最後にある「関連エントリー」の表示は、記事のカテゴリーに属すものを最新のものから並べただけだった。これでは、記事が複数のカテゴリーに属す場合、メインカテゴリーの関連記事が表示されない場合がある。</p>
<p>例えば、前回の記事「」は右図のように 4 つのカテゴリーに属していて、そのうち一番上の「keyhac」カテゴリーがメインカテゴリーだ。</p>
<p>この状態で従来の「関連エントリー」表示を行うと次のようになる。</p>
<img alt="従来の関連エントリー" src="http://blog.remora.cx/2010/08/11/2010-08-11_133021.png" width="442" height="231" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" />
]]>
        <![CDATA[<p>これでは肝心の「keyhac」カテゴリーの記事が後ろに追いやられてしまっている。これを改善して、以下のようにメインカテゴリーの記事は分けて表示するようにした。</p>
<img alt="新しい関連エントリー" src="http://blog.remora.cx/2010/08/11/2010-08-11_133210.png" width="469" height="511" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" />
[code:xml;title:コード例;highlight:[2,15,16]]
<div class="relatedEntries">
    <h2>“Movable Type”カテゴリーの記事</h2>
    <ul>
        <li class="odd">
            <a href="http://blog.remora.cx/2010/08/improve-relational-entries.html">【MovableType】“関連エントリー”の表示を改善する</a></li>
    </ul>
</div>
[/code]
<ul>
<li><p>2 行目、15 行目は <code>&lt;mt:SetVarBlock&gt;</code> タグを使って変数を定義しているが、このタグの中では改行してはいけない。改行すると、変数の値に改行文字が含まれてエラーになってしまう。</p>
[code:xml;gutter:false;title:悪い例]
[/code]
[code:xml;gutter:false;title:良い例]
[/code]
<p>下記リンクによれば <code>strip_feeds="1"</code> という属性を加えれば途中に改行があっても問題ないとの話なのだが、なぜかうまくいかなかった。</p>
<blockquote>
<p>mt:Entries categoriesなどのモディファイアに変数を導入するときの注意点｜ブログ｜styraise（スタイライズ）<br />
<a class="exlink" href="http://www.styraise.com/blog/web/movabletype/091023.html">http://www.styraise.com/blog/web/movabletype/091023.html</a></p>
</blockquote></li>
<li><p>15 行目の <code>&lt;mt:EntryAdditionalCategories&gt;</code> タグはメインカテゴリー<b>ではない</b>カテゴリーを列挙するタグである。これに付けた <b><code>setvar="foo"</code></b> という属性は、ブロックタグの内容を変数に格納する働きがある。つまり、次の 2 つは等価である。</p>
[code:xml;gutter:false;title:SetVarBlock を使った例]
[/code]
[code:xml;gutter:false;title:setvar 属性を使った例]
[/code]</li>
<li><p>16 行目の <code>&lt;mt:Entries&gt;</code> タグに指定した <b><code>unique="1"</code></b> という属性。これは、同じテンプレートに存在する<code>&lt;mt:Entries&gt;</code> に<b>現れていない</b>記事を選んでくれる。</p></li>
</ul>
]]>
    </content>
</entry>
<entry>
    <title>keyhac で Emacs 風ショートカットを定義する</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/emacs-like-bindings-with-keyhac.html" />
    <id>tag:blog.remora.cx,2010://4.674</id>
    <published>2010-08-09T08:26:33Z</published>
    <updated>2010-08-11T06:42:13Z</updated>
    <summary>キーカスタマイズソフト keyhac において、“複数のキー入力へアクションを割...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Windows" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="keyhac" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="python" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="キーボード" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="emacs" label="emacs" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="keyhac" label="keyhac" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="python" label="python" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>キーカスタマイズソフト <a class="exlink" href="http://sites.google.com/site/craftware/keyhac">keyhac</a> において、“複数のキー入力へアクションを割り当てる”ことが可能になっていた。要するにこれは、Emacs 風のショートカットを実現するためのものだ。</p>
[code:python;title:config.py の例１]
from keyhac import *
def configure( km ):
    # グローバルキーマップ
    kmg = km.defineWindowKeymap()
    # “切り取り”は C-W に退避させておく
    kmg[ "C-W" ] = "C-X"
    # マルチストローク設定
    kmg[ "C-X" ] = km.defineMultiStrokeKeymap()
    # 開く
    kmg[ "C-X" ][ "C-F" ] = "C-O"
    # 上書き保存
    kmg[ "C-X" ][ "C-S" ] = "C-S"
    # 名前をつけて保存
    kmg[ "C-X" ][ "C-W" ] = "A-F", "A"
    # 終了
    kmg[ "C-X" ][ "C-C" ] = "A-F4"
[/code]
<p>これにより、<kbd>Control</kbd> を押下したまま、<kbd>X</kbd><kbd>C</kbd> と順に叩いてウィンドウを閉じることができる。さらに応用として、</p>
]]>
        <![CDATA[[code:python;title:config.py の例２]
from keyhac import *
def configure( km ):
    # グローバルキーマップ
    kmg = km.defineWindowKeymap()
    # マルチストローク設定
    kmg[ "C-Q" ] = km.defineMultiStrokeKeymap()
    kmg[ "C-Q" ][ "C-U" ] = km.defineMultiStrokeKeymap()
    kmg[ "C-Q" ][ "C-U" ][ "C-I" ] = km.defineMultiStrokeKeymap()
    kmg[ "C-Q" ][ "C-U" ][ "C-I" ][ "C-T" ] = "A-F4"
[/code]
<p><kbd>Control</kbd> を押下したまま、<kbd>Q</kbd><kbd>U</kbd><kbd>I</kbd><kbd>T</kbd> と 4 つのキーを押すような組み合わせをも指定できる。</p>
<p>押すキーが長くなると <code>config.py</code> の記述が煩雑になるのでちょっとした関数を書いてみた。</p>
[code:python;title:config.py の例３]
from keyhac import *
# マルチストローク設定
def set_multistroke( km, command, func, modifier = "C" ):
    # ショートカット
    kmg = km.defineWindowKeymap()
    def set_default( d, i, value = km.defineMultiStrokeKeymap() ):
        def make_key( s ):
            return modifier + "-" + command[ s ]
        try:
            d[ make_key( i ) ]
        except:
            d[ make_key( i ) ] = value
        return d[ make_key( i ) ]
    for i in xrange( len( command ) ):
        if i == 0:
            km_ms = set_default( kmg, 0 )
        elif i < len( command ) - 1:
            km_ms = set_default( km_ms, i )
        else:
            set_default( km_ms, -1, func )
def configure( km ):
    set_multistroke( km, "XF", "C-O" )
    set_multistroke( km, "XS", "C-S" )
    set_multistroke( km, "XW", ( "A-F", "A" ) )
    set_multistroke( km, "XC", "A-F4" )
    set_multistroke( km, "QUIT", "A-F4" )
    set_multistroke( km, "STARTNOTEPAD",
        km.command_ShellExecute( None, None, "notepad.exe", u"", u"" )
[/code]
<p>最後の例では、<kbd>Control</kbd> を押下したまま <kbd>S</kbd><kbd>T</kbd><kbd>A</kbd><kbd>R</kbd><kbd>T</kbd><kbd>N</kbd><kbd>O</kbd><kbd>T</kbd><kbd>E</kbd><kbd>P</kbd><kbd>A</kbd><kbd>D</kbd> と順に押すことでメモ帳が起動する。フォルダ構造の奥深くに隠したアプリをショートカットを作らずに起動するために使えるかな？</p>
]]>
    </content>
</entry>
<entry>
    <title>【Movable Type】5.0 → 5.02 へのアップグレード</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/08/movable-type-upgrade.html" />
    <id>tag:blog.remora.cx,2010://4.670</id>
    <published>2010-08-02T03:01:02Z</published>
    <updated>2010-08-02T03:03:17Z</updated>
    <summary>今まで面倒で放置していたのだが、Movable Type を 5.0 から 5....</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Movable Type" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="MySQL" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="perl" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="captcha" label="Captcha" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="mysql" label="MySQL" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="perl" label="perl" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>今まで面倒で放置していたのだが、Movable Type を 5.0 から 5.02 にアップグレードしてみた。</p>
<blockquote>
<p>Movable Type 5.0 から 5.0x へのアップグレード<br />
<a class="exlink" href="http://www.movabletype.jp/documentation/mt5/upgrade/mt5.html">http://www.movabletype.jp/documentation/mt5/upgrade/mt5.html</a></p>
</blockquote>]]>
        <![CDATA[<h3>バックアップ</h3>
<p>まずは何は無くともバックアップ。</p>
[code:bash;gutter:false]
$ /usr/local/mysql/bin/mysqldump -a -uroot -p mt | gzip > mt_backup_2010080201.gz
Enter password:
[/code]
<p>これで、データベースの中身がカレントディレクトリに <code>mt_backup_2010080201.gz</code> というファイル名でバックアップされる。</p>
[code:bash;gutter:false]
$ cd /Users/delphinus/Sites
$ mv mt mt.bak
$ mv mt-static mt-static.bak
[/code]
<p>MT を公開しているディレクトリもバックアップしておく。</p>
<h3>MT 最新版のインストール</h3>
<p>予めダウンロードしておいた最新版の ZIP ファイルを解凍し、以前のディレクトリから必要なものをコピーする。</p>
[code:bash;gutter:false]
$ unzip MT-5.02-ja.zip
$ mv MT-5.02-ja mt
$ mv mt/mt-static .
$ cp mt.bak/mt-config.cgi mt/
$ cp -fR mt.bak/themes/テーマ名 mt/themes/
$ cp -fR mt.bak/plugins/プラグイン名 mt/plugins/
$ cp -fR mt-static.bak/support mt-static/
$ cp -fR mt-static.bak/plugins/プラグイン名 mt-static/plugins/
[/code]
<p>あとは上に挙げたリンクにもあるとおり、ブラウザから <code>/mt/mt.cgi</code> にアクセスすれば完成……のはずが、ちょっとしたエラーが起こった。データベースをアップグレードできないのだ。</p>
<h3>データベース構造を元に戻す</h3>
<p>以前、記事のタイトルや本文に JIS 第三、第四水準など、Unicode の BMP（基本多言語面）外の文字を使うときにテーブル構造をいじっていた。アップグレードの前にいったん元の設定に戻そう。</p>
<blockquote>
</blockquote>
[code:bash;gutter:false]
$ /usr/local/mysql/bin/mysql -uroot -p mt
Enter password:
[/code]
<p>次の SQL で設定の一部を元に戻す。</p>
[code:sql]
alter table mt_entry
    modify `entry_atom_id` varchar(255) character set utf8 default null
    ,modify `entry_basename` varchar(255) character set utf8 default null
    ,modify `entry_class` varchar(255) character set utf8 default 'entry'
    ,modify `entry_title` varchar(255) character set utf8 default null
    ;
[/code]
<p>ただしこの場合、記事のタイトルやファイル名に BMP 外の文字を使っているとそのデータが消えてしまう。予め確認しておこう。</p>
<p>ちなみに、再び BMP 外の文字に対応させるときは次の SQL を使う。</p>
[code:sql]
alter table mt_entry
    modify `entry_atom_id` varchar(191) character set utf8mb4 default null
    ,modify `entry_basename` varchar(191) character set utf8mb4 default null
    ,modify `entry_class` varchar(191) character set utf8mb4 default 'entry'
    ,modify `entry_title` varchar(191) character set utf8mb4 default null
    ;
[/code]
<p>もう一度ブラウザから <code>/mt/mt.cgi</code> にアクセスすると問題なくアップグレードが完了した。</p>
<h3>Captcha 画像への対応</h3>
<p>以上でアップグレードは完了したのだが、<code>Image::Magick</code> のバージョンにもよるのか、相変わらず Captcha 画像が使えない。以前と同じように <code>Captcha.pm</code> を修正して対応した。</p>
<blockquote>
</blockquote>]]>
    </content>
</entry>
<entry>
    <title>江迎？ えむかい？</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/07/emukai.html" />
    <id>tag:blog.remora.cx,2010://4.651</id>
    <published>2010-07-26T11:22:46Z</published>
    <updated>2010-07-26T11:25:24Z</updated>
    <summary>今日は書くこともないので前々から気になってたどうでもいい小ネタについて。 ...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="その他" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="漫画" label="漫画" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>今日は書くこともないので前々から気になってたどうでもいい小ネタについて。</p>
]]>
        <![CDATA[<p>週刊ジャンプで連載中の<a class="exlink" href="http://ja.wikipedia.org/wiki/めだかボックス">「めだかボックス」</a>の登場人物は、その名字が九州の地名から採られているとして有名だ。ちゃんと地図にまで纏めてくれた人までおるとね。</p>
<blockquote>
<p>真下のための無計画日記 九州・沖縄の地名から命名。<br />
<a class="exlink" href="http://syouboudiary.blog80.fc2.com/blog-entry-1031.html">http://syouboudiary.blog80.fc2.com/blog-entry-1031.html</a></p>
</blockquote>
<p>そんな中、上記の地図にも載っているキ○ガイ女子高生<b>“江迎”</b>（えむかえ）の登場シーンで驚いた。</p>
<p><b>生まれてこの方“えむかい”と読むのだと思ってました</b>orz</p>
<p>考えたらうちの家族は全員<b>“えむかい”</b>と読んでるぞ？ 気になって調べてみたら、</p>
<blockquote title="江迎郵便局 - Wikipedia">
<p>1997年（平成9 年）1月1日 - 局名の読みを<b>「えむかい」</b>から<b>「えむかえ」</b>に変更。<br />
<a class="exlink" href="http://ja.wikipedia.org/wiki/%E6%B1%9F%E8%BF%8E%E9%83%B5%E4%BE%BF%E5%B1%80">http://ja.wikipedia.org/wiki/%E6%B1%9F%E8%BF%8E%E9%83%B5%E4%BE%BF%E5%B1%80</a></p>
</blockquote>
<p>公共機関でも表記の揺れがあるらしい。更にググると、</p>
<blockquote title="佐賀県上峰町(三養基郡) - Yahoo!地図">
<p>江迎［地図］（<b>えむかい</b>）<br />
江迎(字碇)［地図］（<b>えむかい</b>あざいかり）<br />
江迎(字江越)［地図］（<b>えむかい</b>あざえごし）<br />
（略）<br />
<a class="exlink" href="http://map.yahoo.co.jp/address?ac=41345&type=">http://map.yahoo.co.jp/address?ac=41345&type=</a></p>
</blockquote>
<p>佐賀には<b>“えむかい”</b>って地名があるわけね<fn>(そういや、“上峰”ってキャラもいたな。)</fn>。父は佐賀の生まれなのでそれから伝染したのかも知れない。</p>
<p>こういうのは公式サイトで調べるのが一番いいのだが、江迎町は“平成の大合併”によってサイトが消滅。国会図書館の「消失したウェブサイト」一覧にも含まれていない。<a class="exlink" href="http://www.archive.org/">Internet Archive</a> には<a class="exlink" href="http://web.archive.org/web/*/http://www.emukae.jp">残ってる</a>んだけど……。こっちはリンク切れが多すぎてねえ。</p>
<blockquote>
<p>インターネット資料収集保存事業（ウェブサイト別） | 国立国会図書館<br />
<a class="exlink" href="http://warp.da.ndl.go.jp/search/">http://warp.da.ndl.go.jp/search/</a></p>
<p>消失したウェブサイト - 市町村合併<br />
<a class="exlink" href="http://warp.da.ndl.go.jp/lostwebsites/shichoson/shichoson.html">http://warp.da.ndl.go.jp/lostwebsites/shichoson/shichoson.html</a></p>
</blockquote>
<p>ちなみにこのサイト、かの有名な（？）佐賀県大和町はしっかり収録しておる。なぜ有名なのか分からない人も一目で理解できよう。</p>
<blockquote>
<p>佐賀県大和町役場<br />
<a class="exlink" href="http://warp.da.ndl.go.jp/info:ndljp/pid/260568/www.saganet.ne.jp/yamato/index.html">http://warp.da.ndl.go.jp/info:ndljp/pid/260568/www.saganet.ne.jp/yamato/index.html</a></p>
<p>特設ギャラリー<br />
<a class="exlink" href="http://warp.da.ndl.go.jp/info:ndljp/pid/260568/www.saganet.ne.jp/yamato/main/toppicture.html">http://warp.da.ndl.go.jp/info:ndljp/pid/260568/www.saganet.ne.jp/yamato/main/toppicture.html</a></p>
</blockquote>
<p>自治体がマスコットに萌えキャラを採用した最初期の例に当たるだろう。当時は公式キャラグッズまで販売されるほどたいそうな盛り上がりであった。</p>
<br />
<p>なんだか話がずれた。長崎の地名の話だ。とりあえず「めだかボックス」に未登場でなるたけ厨二っぽい地名を挙げると……<fn>(ほとんどが北松の地名になってしまった。県南はよう知らんちゃもん。)</fn></p>
<ul>
<ul>
<li><b>御厨（みくりや）</b></li>
<li><b>調川（つきのかわ）</b></li>
<li><b>潜木（くぐるぎ）</b></li>
<li><b>皆瀬（かいぜ）</b></li>
<li><b>百合野（ゆりの）</b></li>
<li><b>女の都（めのと）</b></li>
</ul>
<p>こんな感じかね？ でも“江迎”とか県民にとっては田舎くさいだけの名前が、全国区に行けば稀代の厨二原作者に採用されたわけだし、次に何が来るのかホント想像もつかんね。</p>
]]>
    </content>
</entry>
<entry>
    <title>「借りぐらしのアリエッティ」感想</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/07/the-borrower-arrietty.html" />
    <id>tag:blog.remora.cx,2010://4.650</id>
    <published>2010-07-25T12:03:45Z</published>
    <updated>2010-08-19T08:42:46Z</updated>
    <summary> 宮崎駿が監督しないジブリ作品というと、直近では「ゲド戦記」というどうしようもな...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="映画" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="感想" label="感想" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="映画" label="映画" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<iframe class="youtube-player" width="640" height="385" src="http://www.youtube.com/embed/SuY6wrMDptA"></iframe>
<p>宮崎駿が監督しないジブリ作品というと、直近では<a class="exlink" href="http://ja.wikipedia.org/wiki/ゲド戦記">「ゲド戦記」</a>というどうしようもない例があった。そんなわけでだいぶハードルを下げて見に行ったつもりだったのだが……。う〜ん。これは、<b>“ゲドよりはマシ”</b>といったレベルかも知れない。</p>
]]>
        <![CDATA[<blockquote>
<p>スタジオジブリ：新作「借りぐらしのアリエッティ」　宮崎駿脚本、３６歳、麻呂こと米林監督を抜てき - MANTANWEB（まんたんウェブ）<br />
<a class="exlink" href="http://www.mantan-web.jp/2009/12/16/20091216mog00m200035000c.html?inb=yt">http://www.mantan-web.jp/2009/12/16/20091216mog00m200035000c.html?inb=yt</a></p>
</blockquote>
<p>今回の作品は宮崎監督が企画・脚本、監督は新人の米林宏昌が務めた。だが周知の通り、宮崎駿は映画を作るときに脚本を必要とせず、直接絵コンテを描きながら作り込むという作風だ。今回の“脚本”という役割も、大まかなプロットを監督に口頭で伝える程度だったのではないかと想像する。</p>
<p>すると監督の役割は、宮崎駿の与えたイメージを膨らませ、大まかだったキャラクタに肉付けする作業になる。これがどうにもうまく行っていない。</p>
<p>人間が行う環境破壊に対しての警鐘なのか？ それとも“滅び行く種族”に対して歴史的な見地から哲学的なテーマを導きたいのか？ はたまた、単に少年少女の成長とその冒険活劇を描きたいのか？ この辺がはっきりしないのだ。</p>
<br />
<p>もちろん、この“テーマ”とやらは深く映画を楽しみたい人が自分で探し出せばよいのであって、あからさまに提示する必要はない。問題なのは、娯楽映画として見てなんの高揚感も満足感も得られない、映画として純粋に“つまらない”ことにある。</p>
<p>これではプロデューサーの鈴木敏夫がねがう<a class="exlink" href="http://hochi.yomiuri.co.jp/entertainment/news/20100718-OHT1T00031.htm">「『崖の上のポニョ』越え」</a>は到底無理だろう。あの作品は子供向けの娯楽作品として作り、しかもそれに完璧に成功していながら、大人が“テーマ”を深読みしても十分対応できる傑作だった。</p>
<blockquote>
<p>崖の上のポニョが神過ぎた件:ハムスター速報　２ろぐ　跡地<br />
<a class="exlink" href="http://urasoku.blog106.fc2.com/blog-entry-487.html">http://urasoku.blog106.fc2.com/blog-entry-487.html</a></p>
</blockquote>
<p>古稀を迎えてますます盛んな天才監督と、ジブリ歴代最年少の新人監督を比べるのは酷かも知れないけどさ。先週行った<a href="http://blog.remora.cx/2010/07/inception.html">「インセプション」</a>と同じ 1800 円を払って見てるわけよ？ せめて値段分は楽しませて欲しいというのが正直なところ。こんなていたらくでは、宮崎駿がいなくなったら日本のアニメはどうなるのだろう。<a class="exlink" href="http://ja.wikipedia.org/wiki/細田守">細田守</a>にでも任せようか？</p>
<br />
<p>ダメなところばかり書いてしまったが、いいところももちろんある。森や住まいの丁寧な描写、“人形の家”の驚くほど美しい色彩、ここら辺はジブリの面目躍如だ。今回は声優の演技も問題ない。</p>
<p>でも一番の演技者は猫！ 飼い主に対してのつれない態度、獲物を追うときの荒々しさ、そしていざデレたときの従順な仕草！ これは久々によい猫を見た。監督は猫好きなのだろうか。</p>
<br />
<p>まとめると、「ゲド」よりはマシ、でも 1800 円の価値はないってところ。引退するする詐欺の宮崎駿は、少なくとももう一本の長編を撮るようだ。将来の日本アニメよりも、まずはそちらに期待したい。</p>
<blockquote>
<p>ジブリ新作監督に若手の米林宏昌氏、宮崎駿監督は次回作にやる気満々－アニメニュース Japanimate.com<br />
<a class="exlink" href="http://japanimate.com/Entry/1272/">http://japanimate.com/Entry/1272/</a></p>
</blockquote>]]>
    </content>
</entry>
<entry>
    <title>【Perl】my と our と local と……</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/07/my-our-local.html" />
    <id>tag:blog.remora.cx,2010://4.649</id>
    <published>2010-07-23T08:40:55Z</published>
    <updated>2010-08-13T02:24:27Z</updated>
    <summary>当たり前のことなのだけど、改めて纏めてみる。レキシカルスコープとパッケージの範囲...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="perl" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="perl" label="perl" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>当たり前のことなのだけど、改めて纏めてみる。レキシカルスコープとパッケージの範囲って全然違うんだなあ。</p>
<h3><code>our</code> と <code>my</code></h3>
[code:perl;title:サンプル 1;highlight:[10,13,14]]
#!/usr/bin/perl
use strict;
use feature qw! say !;
package AAA;
our $our_var = 123;
my $my_var = 567;
package DDD;
say '$our_var      : ' . ( $our_var      // "undefined" );
say '$AAA::our_var : ' . ( $AAA::our_var // "undefined" );
say '$DDD::our_var : ' . ( $DDD::our_var // "undefined" );
say '$my_var       : ' . ( $my_var       // "undefined" );
say '$AAA::my_var  : ' . ( $AAA::my_var  // "undefined" );
say '$DDD::my_var  : ' . ( $DDD::my_var  // "undefined" );
[/code]
[code:plain;title:実行例 1;gutter:false]
$our_var      : 123
$AAA::our_var : 123
$DDD::our_var : undefined
$my_var       : 567
$AAA::my_var  : undefined
$DDD::my_var  : undefined
[/code]
<ol>
<li><code>our</code> も <code>my</code> もレキシカルスコープ全体で有効になる。この例の場合、その範囲はスクリプト全体となる。</li>
<li>レキシカルスコープ内では例えパッケージが違っていても参照できる（10, 13 行目）。</li>
<li><code>our</code> は変数をパッケージの名前空間に紐付けする。つまり、<b>グローバル変数を作る</b>。<code>my</code> にそのような効果はないのでパッケージ名を付けても参照できない（14 行目）。</li>
</ol>
]]>
        <![CDATA[<h3><code>our</code> と <code>use vars</code></h3>
<p><code>our</code> とよく似た機能として <code>use vars</code> プラグマがある。どちらも変数をパッケージの名前空間に紐付けする点では同じだが、<code>our</code> が<b>レキシカルスコープ内で有効になる</b>のに対して、<code>use vars</code> は<b>パッケージ内で有効になる</b>点が異なる。</p>
[code:perl;title:サンプル 2;highlight:[12]]
#!/usr/bin/perl
use strict;
use feature qw! say !;
package AAA;
use vars qw! $use_vars_var !;
$use_vars_var = 678;
our $our_var = 123;
package DDD;
say $our_var;           # これは大丈夫
say $AAA::use_vars_var; # これも大丈夫
say $use_vars_var;      # ここでエラー！
[/code]
<p><code>use vars</code> が無効な範囲でもパッケージ名で修飾すれば参照できる（12 行目）。歴史の古いモジュールなどではよく見かけるが、<code>our</code> の使える今では、あえて使う意味はない。</p>
<h3><code>local</code> と <code>local our</code></h3>
<p><code>local</code> はグローバル変数にスコープ内でのみ有効な値を与えるときに使われる。</p>
[code:perl;title:サンプル 3;highlight:[5,8]]
#!/usr/bin/perl
use strict;
use feature qw! say !;
our $var = 123;
{
    local $var = 345;
    &say_var;
}
&say_var;
sub say_var {
    say $main::var // "undefined";
}
[/code]
[code:plain;title:実行例 3;gutter:false]
345
123
[/code]
<p><code>local</code> 文で与えた変更はスコープ内で呼び出された関数でも有効だ。では次のコードだとどうなるか。</p>
[code:perl;highlight:[6];title:サンプル 4]
#!/usr/bin/perl
use strict;
use feature qw! say !;
{
    our $var = 345;
    &say_var;
}
&say_var;
sub say_var {
    say $main::var // "undefined";
}
[/code]
[code:plain;title:実行例 4;gutter:false]
345
345
[/code]
<p><code>our</code> が有効なのはスコープ内だけであるのに、そこで与えた変更はスコープ外にも波及する。これを避けるために <code>local our</code> を使う。</p>
[code:perl;highlight:[6];title:サンプル 5]
#!/usr/bin/perl
use strict;
use feature qw! say !;
{
    local our $var = 345;
    &say_var;
}
&say_var;
sub say_var {
    say $main::var // "undefined";
}
[/code]
[code:plain;title:実行例 5;gutter:false]
345
undefined
[/code]
<p>これで<b>スコープ内だけで有効なグローバル変数</b>が使えるようになった。一時的に、定数に別の値を与えて関数を呼び出す場合に有効だ。</p>
<h3>でも結局……</h3>
<p>しかしこのような例は Perl においてさえもレガシーといえる書き方だ。関数の挙動を決めるのにはグローバル定数なんか使わず、素直に引数を与えて呼び出した方がよい。</p>
[code:perl;title:サンプル 6]
#!/usr/bin/perl
use strict;
use feature qw! say !;
my $var = 678;
{
    my $var = 345;
    &say_var( $var );
}
&say_var( $var );
sub say_var {
    my $var = shift;
    say $var // "undefined";
}
[/code]
[code:plain;title:実行例 6;gutter:false]
345
678
[/code]
<p>これだけ書いておいて何だが、結局言えるのは<b>「グローバル変数はトラブルの元。全部 <code>my</code> 使ってレキシカル変数で処理した方がマシ」</b>ってこと。他人のコード読むときは仕方ないけどね。</p>
]]>
    </content>
</entry>
<entry>
    <title>【Javascript】SyntaxHighlighter 3.0 を Movable Type で使う</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/07/syntaxhighlighter-3-in-movable-type.html" />
    <id>tag:blog.remora.cx,2010://4.647</id>
    <published>2010-07-21T11:01:01Z</published>
    <updated>2010-08-10T01:28:38Z</updated>
    <summary>SyntaxHighlighter を Movable Type で使うプラグインは SyntaxHighlighter 2.x にしか対応していないのだが、最新版の 3.0.83 で無理矢理動かしてみた。</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Movable Type" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="javascript" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="javascript" label="Javascript" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<blockquote>
</blockquote>
<p>SyntaxHighlighter を Movable Type で使うプラグインには次のものがある。</p>
<blockquote>
<p>SyntaxHighlighter<br />
<a class="exlink" href="http://alexgorbatchev.com/SyntaxHighlighter/">http://alexgorbatchev.com/SyntaxHighlighter/</a></p>
<br />
<p>SyntaxHighlighter for Movable Type | kwrogu<br />
<a class="exlink" href="http://blogspot.makotokw.com/portfolio/movabletype/syntaxhighlighter/">http://blogspot.makotokw.com/portfolio/movabletype/syntaxhighlighter/</a></p>
<p>SyntaxHighlighter  for Movable Type « kwLog<br />
<a class="exlink" href="http://blog.makotokw.com/portfolio/movabletype/syntaxhighlighter/">http://blog.makotokw.com/portfolio/movabletype/syntaxhighlighter/</a></p>
</blockquote>
<p>これは SyntaxHighlighter 2.x にしか対応していないのだが、最新版の 3.0.83 で無理矢理動かしてみた。</p>
]]>
        <![CDATA[<h3>実際の使用例</h3>
<p>これが<fn>(下のコードには最初の大括弧“[”の直後に幅ゼロのスペース（U+200B）がおいてあるので注意！)</fn></p>
[code:plain;gutter:false]
[&#x200b;code:python;highlight:[4,8,12];title:Python クックブック 2.23 より]
try:
    from msvcrt import getch
except ImportError:
    # WindowsではないのでUnix的なアプローチを試みる
    def getch():
        import sys, tty, termios
        fd = sys.stdin.fileno()
        old_settings = termios.tcgetattr( fd)
        try:
            tty.setraw( fd )
            ch = sys.stdin.read( 1 )
        finally:
            termios.tcsetattr( fd, termios.TCSADRAIN, old_settings )
        return ch
[&#x200b;/code]
[/code]
<p>こうなる。</p>
[code:python;highlight:[4,8,12];title:Python クックブック 2.23 より]
try:
    from msvcrt import getch
except ImportError:
    # WindowsではないのでUnix的なアプローチを試みる
    def getch():
        import sys, tty, termios
        fd = sys.stdin.fileno()
        old_settings = termios.tcgetattr( fd)
        try:
            tty.setraw( fd )
            ch = sys.stdin.read( 1 )
        finally:
            termios.tcsetattr( fd, termios.TCSADRAIN, old_settings )
        return ch
[/code]
<h3>1. ヘッダーにスタイルシートを追加</h3>
<p>サイトのヘッダーに SyntaxHighlighter のテーマを表すスタイルシートを追加する。デザインテンプレートをいじるといいだろう<fn>(SyntaxHighlighter 3.0 を“<code>サイトトップ/sh30</code>”に解凍した場合。以下同様。)</fn>。</p>
[code:html;gutter:false]
<link rel="stylesheet" href="/sh30/styles/shCoreDefault.css" type="text/css" />
[/code]
<h3>2. スクリプトを追加</h3>
<p>SyntaxHighlighter の設定及び起動を行うスクリプトをおく。これもデザインテンプレートをいじると良い。サイトのパフォーマンスを重視するなら <code>&lt;/body&gt;</code> タグの直前に置くのがいいらしいよ。</p>
<blockquote>
<p>javascriptは最後（<code>&lt;/body&gt;</code> の直前）に置く。 | サイト速度改善のコツ<br />
<a class="exlink" href="http://sitespeed.blog24.fc2.com/blog-entry-5.html">http://sitespeed.blog24.fc2.com/blog-entry-5.html</a></p>
</blockquote>
[code:js;html-script:true;title:コード例]
<script type="text/javascript" src="/sh30/scripts/shCore.js"></script>
<script type="text/javascript" src="/sh30/scripts/shAutoloader.js"></script>
<script type="text/javascript" src="/sh30/scripts/shBrushXml.js"></script>
<script type="text/javascript">
SyntaxHighlighter.autoloader(
     "bash      /sh30/scripts/shBrushBash.js"
     ,"css      /sh30/scripts/shBrushCss.js"
     ,"diff     /sh30/scripts/shBrushDiff.js"
     ,"perl pl  /sh30/scripts/shBrushPerl.js"
     ,"plain    /sh30/scripts/shBrushPlain.js"
     ,"sql      /sh30/scripts/shBrushSql.js"
     ,"python py    /sh30/scripts/shBrushPython.js"
     ,"html xml xhtml   /sh30/scripts/shBrushXml.js"
     ,"js jscript javascript    /sh30/scripts/shBrushJScript.js"
);
SyntaxHighlighter.all();
</script>
[/code]
<p>サイトで使用する可能性のあるコード定義ファイルを並べておく。このうち必要なものだけがロードされる。利用可能な言語（の略号）とファイルの一覧はこちら。</p>
<blockquote>
<p>SyntaxHighlighter - Bundled Brushes<br />
<a class="exlink" href="http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/">http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/</a></p>
</blockquote>
<h3>3. プラグインへのパッチ</h3>
<p>最後に、<code>Plugin.pm</code> に細工して、<code>title</code> やその他のオプションを使用可能にする。</p>
[code:diff;title:mt/plugins/SyntaxHighlighter/lib/SyntaxHighlighter/Plugin.pm;highlight:[49]]
*** Plugin.pm.orig	2010-07-20 14:45:43.000000000 +0900
--- Plugin.pm	2010-07-20 14:52:44.000000000 +0900
***************
*** 194,200 ****
      my ($class,$code,$version) = @_;
      if ($version eq '') { $version = '1.5'; }
      if ($version=='2.0') {
!         return "<pre class='brush: $class'>".MT::Util::encode_html($code)."<\/pre>";
      } else {
          return "<pre name='code' class='$class'>".MT::Util::encode_html($code)."<\/pre>";
      }
--- 194,216 ----
      my ($class,$code,$version) = @_;
      if ($version eq '') { $version = '1.5'; }
      if ($version=='2.0') {
!         my @s_class = split /;/, $class;
!         my %params;
!         $params{brush} = shift @s_class;
!         my $title = "";
!         for (@s_class) {
!             my ($k, $v) = split /:/;
!             if ($k eq "title") {
!                 $title = " title='".MT::Util::encode_html($v)."'";
!             } else {
!                 $params{$k} = $v;
!             }
!         }
!         my $p = "";
!         while (my($k, $v) = each %params) {
!             $p .= "$k:$v;";
!         }
!         return "<pre class='$p'$title>".MT::Util::encode_html($code)."<\/pre>";
      } else {
          return "<pre name='code' class='$class'>".MT::Util::encode_html($code)."<\/pre>";
      }
***************
*** 207,213 ****
      if (UNIVERSAL::can($ctx, 'stash') and my $blog_id = $ctx->stash('blog_id')) {
         #$version = $plugin->get_config_value('syntaxhighlighter_version',"blog:".$blog_id);
      }
!     $text =~ s/\[code:([\w#+-]+)\](.*?)\[\/code\]/&sh_transform($1,$2,$version)/esg;
      return $text;
  }
--- 223,229 ----
      if (UNIVERSAL::can($ctx, 'stash') and my $blog_id = $ctx->stash('blog_id')) {
         #$version = $plugin->get_config_value('syntaxhighlighter_version',"blog:".$blog_id);
      }
!     $text =~ s!\[code:([^[\]:;]+(?:;[^[\]:;]+:(?:[^[\]:;]+|\[[^[\]:;]+\]))*)\](.*?)\[/code\]!&sh_transform($1,$2,$version)!xesg;
      return $text;
  }
[/code]
<p>後は、Apache を再起動すれば利用可能になるだろう。</p>
<h4>おまけ</h4>
<p>ハイライトした場所の正規表現が非常に複雑なので、覚え書きを置いておく。</p>
[code:perl;gutter:false]
$text =~ s!
    # 始まり
    \[code:
        # キャプチャ開始
        (
            # 大括弧とコロンとセミコロン以外の文字
            [^[\]:;]+
            (?:
                # セミコロン
                ;
                # 大括弧とコロンと（以下略）
                [^[\]:;]+
                # コロン
                :
                (?:
                    # 大括弧と（以下略）
                    [^[\]:;]+
                    # あるいは
                    |
                    # 大括弧で囲まれた、
                    \[
                        # 大括弧と（以下略）
                        [^[\]:;]+
                    \]
                )
            # 以上のものが 0 回以上繰り返す
            )*
        # キャプチャ終了
        )
    \]
    # コード本体
    (.*?)
    # 終わり
    \[/code\]
!
    &sh_transform($1,$2,$version)
!xesg;
[/code]
]]>
    </content>
</entry>
<entry>
    <title>【Javascript】SyntaxHighlighter 3.0 の新機能と注意点</title>
    <link rel="alternate" type="text/html" href="http://blog.remora.cx/2010/07/new-function-of-syntaxhighlighter-3.html" />
    <id>tag:blog.remora.cx,2010://4.646</id>
    <published>2010-07-20T14:22:25Z</published>
    <updated>2010-07-20T14:25:15Z</updated>
    <summary>ブログ等でコードをさらすときに必携のスクリプト“SyntaxHighlighte...</summary>
    <author>
        <name>delphinus</name>
        <uri>http://blog.remora.cx</uri>
    </author>
        <category term="Movable Type" scheme="http://www.sixapart.com/ns/types#category" />
        <category term="javascript" scheme="http://www.sixapart.com/ns/types#category" />
    <category term="javascript" label="Javascript" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <content type="html" xml:lang="ja" xml:base="http://blog.remora.cx/">
        <![CDATA[<p>ブログ等でコードをさらすときに必携のスクリプト“SyntaxHighlighter”がメジャーバージョンアップして 3.0 になっていた。2.0 系、2.1 系よりアップデートするときの新機能と注意点について書いてみる。</p>
<blockquote>
<p>SyntaxHighlighter<br />
<a class="exlink" href="http://alexgorbatchev.com/SyntaxHighlighter/">http://alexgorbatchev.com/SyntaxHighlighter/</a></p>
<p>新機能について<br />
<a class="exlink" href="http://alexgorbatchev.com/SyntaxHighlighter/whatsnew.html">http://alexgorbatchev.com/SyntaxHighlighter/whatsnew.html</a></p>
</blockquote>
]]>
        <![CDATA[<h3>1. コードのコピー方法</h3>
<p>大きく変わったのがコードのコピー機能。2.1 系までは Flash を使ったツールバーが表示されていて、それを使ってコードをクリップボードにコピーしていた。昨今の Flash 嫌いの風潮（？）に併せてこれが改善。コードをダブルクリックするとシンタックスハイライトが解除され、コード全体を簡単にコピー可能になった。</p>
[code:perl;title:コピーテスト]
#!/usr/bin/perl
use utf8;
use 5.12.0;
use warnings;
binmode STDOUT => ":utf8";
say "コードをダブルクリックすると全体が反転します。";
say "その状態で Ctrl-C（Cmd-C） を押してコピーしてください。";
say "コードの外をクリックして選択を解除すると";
say "シンタックスハイライトが復活します。";
[/code]
<h3>2. タイトルの設定</h3>
<p>これも待望の機能。コードにタイトルを付けられるようになった。これは <code>&lt;caption&gt;</code> タグを使って実現されている。次のように書くと、</p>
[code:plain]
<script class="code:js;html-script:true"
    title="これはテストスクリプトです"
    type="syntaxhighlighter">
<![CDATA[
<p>Hello, World!</p>
<script type="text/javascript">
alert( "これはアラートです。" );
</script>
]]&gt;
</script>
[/code]
<p>このようにタイトル付きで表示される。</p>
[code:js;html-script:true;title:これはテストスクリプトです]
<p>Hello, World!</p>
<script type="text/javascript">
alert( "これはアラートです。" );
</script>
[/code]
<h3>3. ハイライト定義ファイルのオートロード機能</h3>
<p>各言語用のハイライト定義ファイル（<code>shBrushXXXX.js</code> ）を動的にロードしてくれる機能が加わった。<code>shAutoloader.js</code> を別途読み込んだ上で、<code>SyntaxHighlighter.autoloader()</code> を呼び出すことで有効になる。</p>
[code:javascript;html-script:true;highlight:[3];title:設定例]
<script type="text/javascript" src="/sh/scripts/shCore.js"></script>
<script type="text/javascript" src="/sh/scripts/shAutoloader.js"></script>
<script type="text/javascript" src="/sh/scripts/shBrushXml.js"></script>
<script type="text/javascript">
SyntaxHighlighter.autoloader(
     "bash                      /sh/scripts/shBrushBash.js"
     ,"css                      /sh/scripts/shBrushCss.js"
     ,"diff                     /sh/scripts/shBrushDiff.js"
     ,"html xml xhtml           /sh/scripts/shBrushXml.js"
     ,"js jscript javascript    /sh/scripts/shBrushJScript.js"
     ,"perl pl                  /sh/scripts/shBrushPerl.js"
     ,"plain                    /sh/scripts/shBrushPlain.js"
     ,"python py                /sh/scripts/shBrushPython.js"
     ,"sql                      /sh/scripts/shBrushSql.js"
     ,"tt tt2                   /sh/scripts/shBrushTT2.js"
     ,"yaml yml                 /sh/scripts/shBrushYAML.js"
);
SyntaxHighlighter.all();
</script>
[/code]
<p>このように設定しておくと、各定義ファイルが必要になった時点でロードされる。余分なファイルを読んでおく必要がないので便利だ。</p>
<p>注意すべきは 3 行目の <code>shBrushXml.js</code> で、これは予め別個に読み込んでおいた方がよい。そうしないと <code>html-script</code> オプション<fn>(HTML に埋め込まれたスクリプト（Javascript + HTML な文書など）をハイライトするときに使うオプション。)</fn>が使えない。</p>
<h3>4. 各種 Javascript ライブラリへの対応</h3>
<p>サーバーサイドやデスクトップなどで使われる CommonJS に対応した……らしいけど、使ったこと無いのでよくわかんない。</p>
<blockquote>
<p>CommonJS: JavaScript Standard Library<br />
<a class="exlink" href="http://www.commonjs.org/">http://www.commonjs.org/</a></p>
<p>CommonJS Spec Wiki<br />
<a class="exlink" href="http://wiki.commonjs.org/wiki/CommonJS">http://wiki.commonjs.org/wiki/CommonJS</a></p>
</blockquote>
<h3>5. SASS への対応</h3>
<p>CSS を簡易かつ系統的に記述できるメタ言語である SASS に対応した……これも使ったことないや……</p>
<blockquote>
<p>Sass - Syntactically Awesome Stylesheets<br />
<a class="exlink" href="http://sass-lang.com/">http://sass-lang.com/</a></p>
</blockquote>
<hr />
<p>等々新機能が目白押し……だが、いいことばかりではなく、少し残念な変更点もある。長い行があった場合折り返して表示するオプション“<code>wrap-lines</code>”が無くなり、強制的にスクロールバーが表示されるようになってしまったのだ。</p>
[code:plain;gutter:false]
a long long long long long long long long long long long long long long long long long long long long long long line
[/code]
<p>そしてこの場合、標準のテーマを使っていると最終行が隠れて見えなくなってしまうという不具合がある（IE7、IE8 で確認）。これを解決するにはスタイルシートに次の行を加えればよい。</p>
[code:css]
.syntaxhighlighter {
  overflow-y: hidden !important;
}
.syntaxhighlighter table {
  margin-bottom: 1em !important;
}
[/code]
<h4>変更前</h4>
<img alt="100720-0001.png" src="http://blog.remora.cx/2010/07/20/100720-0001.png" width="486" height="159" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" />
<h4>変更後</h4>
<img alt="100720-0002.png" src="http://blog.remora.cx/2010/07/20/100720-0002.png" width="486" height="159" class="mt-image-center" style="text-align: center; display: block; margin: 0 auto 20px;" />
<p>Firefox では逆に空行が増えてしまうがしょうがあるまい。そのうち解決されるだろう。</p>]]>
    </content>
</entry>
</feed>
