MovableTypeで生HTML

Movable TypeSite Management

MovableTypeでHTMLをそのまま出力したいときにはどうすればいいか??ということを最近考えていろいろためしています。文章の再利用性が下がるのはいやなので、HTMLのコードを生の文章として出力するために<や>をHTMLエスケープの&gt;や&lt;といった文字参照で書きたいとは思いません…。そこでMTMacro(MovableTypeのプラグイン)を使用して、文字を正規表現で検索、置換することによって、生のコードをそのままエントリーにかけるように努力してみました。
方針としては、スタイルが変わる可能性がある<pre>タグは使用しない(もちろんスタイルシートを適用すれば回避できますが…)で、<や>を&lt;や&gt;に置換することにしました。こうすれば、例えばコード内に強調したいところがあった場合、コード内<strong>タグを使用することができます!!

で、肝心の方法ですが、まずは使用方法の説明を。

<code>
<html>
<head>
</head>
<body>
<font <span style="color: red;">style="color: red;"</span>>タグ内のタグは有効</font>
<font><<strong>>コード内で置換して欲しくないタグは左右のタグのように2重タグ化する<</strong>></font>
</body>
</code>

次に設定方法。
現在はMTMacroで次の2段階の置換を作用させています。
まずどこからどこまでが生のコードだかわからないので、
public_codeマクロ
<MTMacroDefine name="public_code" ctag="code">
<div class="code"><MTMacroApply macro="Tag2Char escapedTag"><MTMacroContent></MTMacroApply></div>
</MTMacroDefine>

でコードの位置を把握、そしてこの部分をさらにTag2Char、escapedTagという2つのマクロを順にかけています。
Tag2Charマクロ
<MTMacroDefine name="Tag2Char" pattern=
"m/\x3c(?!(?:br\s\/?|\/?p)\x3e)
((?:[^\x22'\x3c\x3e]|\x3c[^\x3e]*\x3e|\x22[^\x22]*\x22|'[^']*')*)\x3e/m">
&lt;<MTMacroMatch position="1">&gt;
</MTMacroDefine>

escapedTagマクロ
<MTMacroDefine name="escapedTag" pattern=
"m/\x26lt;\x3c((?:[^\x22'\x3e]|\x22[^\x22]*\x22|'[^']*')*)\x3e\x26gt;/m">
<<MTMacroMatch position="1">>
</MTMacroDefine>

まずTag2Charマクロで、普通のタグの<や>を&lt;、&gt;に置換しています。このとき、MovableTypeによって自動的につけられるおそれのある<p>タグ、<br />タグは対象にならないよう正規表現の(?!)の部分で回避しています。またタグ内のタグ(例えば<img <strong>src="hoge.img"</strong> width="100">のようなもの)は外側のタグだけ処理されるようにしてあります。
次にescapedTagマクロですが、2重タグを検出して、1重タグに置換しています。Tag2Charマクロが適用されたあとなので、&lt;<、>&gt;で検出しています。
以上のマクロをテンプレート上のどこかに書いて、public_codeマクロを適用すれば、上記の目的はいちおう達成されます～

October 23, 2003 19:36 fenrir が投稿 : 固定リンク | | このエントリーを含むはてなブックマーク

コメント

コメントする