小粋空間

●ポップアップ画面を用いたコメント投稿（その1：基本動作）

ポップアップ画面を利用したコメント投稿の仕組みについてご説明致します（分かる範囲で）。このエントリーを投稿した段階ではテンプレートおよびカスタマイズ方法を公開しておりません。予めご了承ください。

最初に Movable Type ユーザー・マニュアルよりポップアップの定義を引用します。

アーカイブの1ページに2つ以上のエントリーを持つような種類のアーカイブを使う場合、コメントをインラインにするのはあまり意味がありません。 そのような場合のために、Movable Typeでは動的に生成されるコメント用ポップアップ・ウィンドウを利用できます

次に図を用いてポップアップを利用したメインページからのページ遷移について示します。図および説明はデフォルトテンプレートおよびデフォルト設定を前提にしています。またポップアップを利用する場合でも個別エントリーアーカイブからのコメント投稿は有効という前提です。
通常のコメント投稿は、メインページや各アーカイブページからエントリー下に表示される時間のリンクをクリックすると、個別エントリーアーカイブ（図の左側）にジャンプします。そこでコメントを入力し「確認」をクリックすればコメント・プレビュー画面（図の左下）に遷移します。コメント・プレビュー画面で「投稿」をクリックするとコメントが反映された個別エントリーアーカイブにリダイレクトします。個別エントリーアーカイブで「投稿」をクリックすれば、同じようにコメントが反映された個別エントリーアーカイブにリダイレクトします。

ポップアップを利用したコメント投稿の場合、メインページや各アーカイブページのエントリー下にある"Comments"のリンクをクリックするとポップアップするように予め設定することを前提とします（設定方法は別途）。ポップアップしたコメント・リスト上でコメントを入力し、「確認」をクリックすればコメント・プレビュー画面（ポップアップ：図の右側）に遷移します。その画面で「投稿」をクリックするとコメントが反映されたコメント・リスト（図の右下）にリダイレクトします。コメント・リストで「投稿」をクリックすれば、同じようにコメントが反映されたコメント・リストにリダイレクトします。

上記の動作を実現するためには、個別エントリーアーカイブからのリダイレクト先とポップアップ画面からのリダイレクト先をダイナミックに変更させる仕組みが必要になります。なぜなら「コメント・リスト」テンプレートはどちらも同じものが使われているためです。

当初このサイトではポップアップ画面を利用していたのですが、ポップアップ画面からの投稿後のリダイレクト先が図のような遷移にならずメインページになる、つまり狭いポップアップ画面に3カラムのページが表示されてしまうため途中からポップアップしない設定に変更しました。
当時は設定方法に問題があったためそうなっていました。今回はリダイレクト先の設定方法を含めてテンプレートおよびカスタマイズ方法を次回以降にご説明する予定です。

ポップアップ画面利用についてはひとつ制約があります。前述の通りコメント・プレビュー画面は個別エントリーアーカイブおよびコメント・リスト、いずれからの遷移においても同一のテンプレートを使用します。つまりポップアップの利便性を考慮すると、コメント・プレビュー画面は必然的に1カラムになります。ポップアップは画面サイズを任意に指定できますので情報量をコントロールする（例えばマルチカラム化等）ことも可能ですが、使用目的から考えると必要最低限の情報を表示することが好ましいでしょう。