【MovableType】Tidy を使って HTML を整形するプラグイン

by
このエントリーをはてなブックマークに追加

以前、「外部リンクを明示するMovableTypeプラグイン | blog.delphinus.dev」で紹介したプラグインで、MovableType で生成する HTML をちょっとだけ整形してみた。今度は本格的なツールを使ってみよう。

HTML Tidy による整形

HTML Tidy は整形ツールとしては一番著名で強力なツールだ。歴史も古く、最初のバージョンは前世紀まで遡る。

HTML Tidy Project Page
http://tidy.sourceforge.net/

現バージョンの `HTML::Tidy` では tidyp というツールが推奨されているようだ。tidyp を使うならば、後述の `HTML::Tidy` のバージョン違いによるエラーは起こらない。詳しくはこちら。
【Perl】HTML / XML の 整形には tidy“p”？ | blog.delphinus.dev

そしてそれを Perl から利用するためのモジュールが HTML::Tidy。

HTML::Tidy – search.cpan.org
http://search.cpan.org/~petdance/HTML-Tidy-1.50/lib/HTML/Tidy.pm

更に HTML::Tidy を利用して、MovableType で生成する HTML の整形を行ってくれるのがこれ。

Movable Type Monday: Etelos Partnership, Plugin Development, HTML Tidy, and More | The Blog Herald
http://www.blogherald.com/2009/04/07/movable-type-monday-etelos-partnership-plugin-development-html-tidy-and-more/

3つもインストールしなければならない上、一つ一つがかなり曲者だった（Mac OS X を使っていることが主因なんだけれども）。

libtidy のインストール

実は tidy というプログラム自体は Mac OS X に標準で含まれている1。「/usr/bin/tidy」にあるのがそれだが、HTML::Tidyの動作のためにはlibtidyというライブラリが別に必要だ。

The tidy folks don’t distribute a libtidy distribution. You’ll have to check out the CVS tree and build it from there. Here are the steps.
http://search.cpan.org/~petdance/HTML-Tidy-1.00/lib/HTML/Tidy.pm#Building_libtidy

ところが、このドキュメントに書いてある通りに実行してもインストールがうまく行かない。この時点でかなりアレである。ここでググってみると失敗してる人も多い。

MacOS X には HTML::Tidy はインストールできないのか – make world
http://d.hatena.ne.jp/littlebuddha/20100224/1267025761

そこでいつもの通り MacPorts である。どうやら最近のバージョンは Mac OS X でうまく動かないらしく、MacPorts にはかなり古いもの2が納められている。でもまあ、動けばいいのだ。

$ sudo port install tidy

実行ファイル /opt/local/bin/tidy や、ライブラリ /opt/local/lib/libtidy.a ができているはずなので確認しよう。

HTML::Tidy のインストール

これも困ったことに最新バージョン（1.50）がインストールできない。しょうがないので一つ前のバージョンを無理矢理インストールする。

$ sudo cpan -i P/PE/PETDANCE/HTML-Tidy-1.08.tar.gz

MovableType プラグインのインストール

sixapart’s mt-plugin-tidings at master – GitHub
http://github.com/sixapart/mt-plugin-tidings

インストールは非常に簡単で、解凍して出てきた「plugins/Tidings」ディレクトリを「mt/plugins」にコピーするだけだ。

……だけなのだが、これもまた、うまく行かない。ソースを見ると、<body> の中身だけを整形する show-body-only オプションが有効になっているのだ。このまま HTML を整形すると <head> がばっさり切り落とされて壊れてしまう。ソースを次のように変更した（ついでに、アンダーバーに代えてハイフンを区切り文字として使えるようにした）。

*** Util.pm.orig        2010-03-04 16:47:24.000000000 +0900
--- Util.pm     2010-03-04 17:31:32.000000000 +0900
***************
*** 28,34 ****
      }
      my $params;
      $params->{show_warnings} = 0;
-     $params->{show_body_only} = 1;
      if ( $addl_options ) {
          my @options = split(/;/, $addl_options);
          foreach my $option ( @options ) {
--- 28,33 ----
***************
*** 37,42 ****
--- 36,42 ----
              my $key = $results[0];
              my $val = $results[1];
              $key =~ s|\s*(.*)\s*|$1|;
+             $key =~ s|-|_|g;
              $val =~ s|\s*(.*)\s*|$1|;
              $params->{$key} = $val;
          }

実際に整形してみる

やっとインストールできた。では、実際に動かしてみよう。整形したい HTML テンプレートを <mt:Section> 〜 </mt:Section> で囲むとプラグインが有効になる。

例えば、次のような汚らしい HTML テンプレートを整形してみる（オプションは後で説明する）。

<mt:Section tidy="xhtml","indent:auto;indent-attributes:yes;sort-attributes:alpha;wrap:80;break-before-br:yes">
<html><head><script>alert("Hello, World!");
</script><body><table><td>aaa<br>bbb</td></table>
</mt:Section>

これが次のような HTML に変わる。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta name="generator"
        content=
        "HTML Tidy for Mac OS X (vers 1 September 2005), see www.w3.org" />
<script type="text/javascript">
//<![CDATA[
alert("Hello, World!");
//]]>
</script>
  <title></title>
</head>
<body>
  <table>
    <tr>
      <td>aaa
      <br />
      bbb</td>
    </tr>
  </table>
</body>
</html>

オプションの意味を説明すると次のようになる。

tidy="xhtml"
整形する文書の種類を指定する。xhtml（デフォルト）、html、xml の3つが指定可能。
indent:auto
タグをインデントする。auto を指定すると、ブロック要素を含まない場合はインデントしなかったりする（<td><a> 〜 </a></td> の場合など）。
indent-attributes:yes
タグの属性をインデントする。
sort-attributes:alpha
タグの属性をアルファベット順にソートする3。
wrap:80
各行を 80 文字で区切る。でも URL がそれに収まるわけはないのであんまり意味がないオプション。
break-before-br:yes
<br />タグの前で改行する。

他にも、それこそ星の数ほどのオプションがあるので色々試してみよう。

HTML Tidy Configuration Options Quick Reference
http://tidy.sourceforge.net/docs/quickref.html

  1. あるいはXcodeのインストールと同時に入ったのか？ その辺はよくわからない。 ↩
  2. 2005 年リリースと書いてある。 ↩
  3. このオプションは 2007/6/14 版から付いたらしいのでうちのバージョンでは効いてないのかな？ ↩

4 thoughts on “【MovableType】Tidy を使って HTML を整形するプラグイン”

  1. [Mac OS X][MacPorts][Perl][CPAN]Mac OS X で HTML::Tidy 再び

    MacOS X には HTML::Tidy はインストールできないのか で HTML::Tidy のインストールに失敗すると書いた。先日、delphi…

    返信

  2. とても参考になりました！
    しかし、残念ながら、私の Mac ではもとからある Perl の環境に手を加えたくないことと、CPAN モジュールの依存が壊れたときに対応しやすいように、local::lib を利用しているためか、HTML::Tidy のインストールがうまくいきませんでした…。
    もしかしたら、通常の root ユーザーでのインストールならば、成功するかもしれません。
    Mac は環境が特殊なせいで、けっこう苦労します…。

    返信

  3. コメントありがとうございます。
    ううむ。不思議ですねえ？最新エントリも拝見しましたが、僕と全く違う状況のようです。こちらでもまた検証してみますね。
    >Mac は環境が特殊なせいで、けっこう苦労します…。
    そこがまた、いいところですねｗ　いじり甲斐があります。

    返信

コメントを残す