公開時のデザインでプレビューする MT プラグイン : 亜細亜ノ蛾

December 26, 2006

公開時のデザインでプレビューする MT プラグイン

更新: 2007 年 03 月 04 日 15:37
2006 年 12 月 26 日 23:46 に asiamoth が投稿
カテゴリー: Movable Type
コメントする
トラックバックする

実際に公開するデザインでプレビュー

The blog of H.Fujimoto：エントリーのプレビューを行うプラグイン(MT3.2/3.3対応版) で公開されているプラグインを導入しました。これは、実際に公開する記事のデザインでプレビューできる MT 用プラグインです。

いままで導入していなかったのが悔やまれるほど、便利なプラグインです。導入も「プラグインディレクトリにぶっこみんぐ & CGI のパーミッション変更～」と簡単──といいたいところですが、プレビュー専用のテンプレートを作成する必要があります。

The blog of H.Fujimoto：エントリーのプレビューを行うプラグイン(その1）の 5 番の作業がテンプレート作成になります。要するに、プレビューを行いたいテンプレートをコピーして、専用タグで挟み込むだけです。

自分の場合、<head>……</head> の中にある CSS へのリンクや記事を挟み込む <div>……</div> など、必要なところだけを残して、ナビゲーション部分などは削除しました。

自動的にプレビューを表示

記事を下書き状態のまま保存すると、「プレビュー」ボタンが現れます。このボタンを押すと新しくウィンドウが開き、プレビュー用のテンプレートが再構築されます。再構築が終わると、プレビュー画面へのリンクが現れます。

しかし、どうせなら自動的に開く方が便利なので、3 分間ハッキングしてみました。

3 分間ハッキング

mtdir/plugins/RebuildPreview/tmpl/rebuildpreview.tmpl を開き、下記の行（35 行めくらい）を見つけます。

<TMPL_IF NAME=FUNC_END_REBUILD>
<!-- 再構築終了メッセージ 開始 -->
<h4 class="message">プレビューの準備ができました</h4>
<p>
<TMPL_LOOP NAME=TEMPLATE_LOOP>
<a href="<TMPL_VAR NAME=TEMPLATE_URL>" target="mt_preview_template"><TMPL_VAR NAME=TEMPLATE_NAME></a><br />
</TMPL_LOOP>
</p>
<!-- 再構築終了メッセージ 終了 -->
</TMPL_IF>

そして、次のように変更します。リンクのすぐ上に JavaScript を入れるだけですね。

<TMPL_IF NAME=FUNC_END_REBUILD>
<!-- 再構築終了メッセージ 開始 -->
<h4 class="message">プレビューの準備ができました</h4>
<p>
<TMPL_LOOP NAME=TEMPLATE_LOOP>
<script language="javascript" type="text/javascript">
<!--
function doRedirectPreview () {
    window.location = "<TMPL_VAR NAME=TEMPLATE_URL>";
}
setTimeout('doRedirectPreview()', 200);
-->
</script>
<a href="<TMPL_VAR NAME=TEMPLATE_URL>"><TMPL_VAR NAME=TEMPLATE_NAME></a><br />
</TMPL_LOOP>
</p>
<!-- 再構築終了メッセージ 終了 -->
</TMPL_IF>

これで、「プレビュー」ボタンを押してから実際にプレビューが表示されるまでが自動になりました。便利！