Ogawa::Memoranda

Canonical URLを相対URLに変換するプラグインを公開します。

MTTruncateURL Plugin.ja JP - Ogawa Code

MTEntryPermalinkやMTArchiveLinkを始めとして多くのMTタグがcanonical URL(例: http://www.domain.tld/blog/index.html)を生成します。したがって、生成されるHTMLファイルのサイズは肥大化したり、内部リンクと外部リンクの区別が難しくなったりしがちで不便なこともあります。MTTruncateURL Pluginを使うと、canonical URLを相対URLに簡単に置き換えることができます。

なぜこのプラグインを作ったのかというと、ここのところMozilla FirefoxをマイマシンのDefault BrowserにしているのでCSS3の機能も利用してみたいと思ったからです。なんか話が遠いなあと思った人、大正解!!

CSS3で以下のように書くと、A要素のhref属性の先頭が「http:」にマッチする場合に、そのA要素のcontentの直前に/blog/images/web.gifの画像を追加します(何のことかさっぱり分からない人はFirefoxを使ってこのページを見た方が分かりやすいでしょう)。

a[href^="http:"]:before {
    content: url("/blog/images/web.gif");
    vertical-align: middle;
}

そうするとですよ、外部リンクにのみこれを有効にしたいと思ったら内部リンクは相対URLじゃないと区別できないですよ、外部リンクに全部class属性を振るとかはめんどくさいですよ、と思ったですよ。思うが早いかプラグイン作ったですよ。

が、作って3秒後にはたと気が付きました。Stylesheetに↓を追加すればいいだけですよと…。もうアフォですかと…。

a[href^="http://as-is.net/"]:before {
    content: '';
    vertical-align: baseline;
}

正確にはこのBlogで使っているCSSでは以下のように書いてあります。class属性がcontentである要素の子要素で、class属性を持たない要素に含まれるA要素に関して処理を行っています。訳が分からないかもしれませんが、私のところでは本文、コメントに含まれるA要素にマッチします。

.content *:not([class]) a[href^="http:"]:before {
    content: url("/blog/images/web.gif");
    vertical-align: middle;
}
.content *:not([class]) a[href^="http://as-is.net/"]:before {
    content: '';
    vertical-align: baseline;
}