MovableTypeにお問い合わせフォームを設置

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

MovableTypeにお問い合わせフォームを設置できるメールフォームプラグインをご紹介。

インストール

ダウンロードしたMailForm_1_30.zipを解凍すると、MailFormというディレクトリが作成されます。

FTPでMovableTypeをインストールしたサイトにアクセスして、解凍したMailFormディレクトリをpluginsディレクトリにアップロードします。

MailForm内のmt-mail-form.cgiのパーミッションを変更します。(755とか700に)

テンプレートの作成

ヘッダーメニューのデザイン > テンプレート から「ブログのテンプレート」へ。

『インデックステンプレートを作成』から新規にテンプレートを作成します。

メールフォームを表示したい箇所に以下のような記述を行います。

出力ファイル名(これがお問い合わせフォームのファイル名になります)、テンプレート名は適当なもので大丈夫です。

<form method="post" action="<$MTCGIPath$>plugins/MailForm/mt-mail-form.cgi">
	<dl>
		<dt><label for="mail-author">名前</label></dt>
		<dd><input type="text" size="30" name="mail_author" /></dd>
		<dt><label for="mail-email">メールアドレス</label></dt>
		<dd><input type="text" size="30" name="mail_email" /></dd>
		<dt><label for="mail-url">タイトル</label></dt>
		<dd><input type="text" size="30" name="mail_subject" /></dd>
		<dt><label for="mail-text">本文</label></dt>
		<dd><textarea rows="10" cols="50" name="mail_text"></textarea></dd>
		<dd>
			<input type="submit" name="mail_preview" value="確認" id="mail-preview" />
			<input type="submit" name="mail_post" value="送信" id="mail-post" />
			<input type="hidden" name="mail_blog_id" value="<$MTBlogID$>" />
		</dd>
	</dl>
</form>

次に右メニューのクイックフィルタより『テンプレートモジュール』を選択、『モジュールテンプレートを作成』から以下の3つのモジュールテンプレートを作成します。

モジュールテンプレートに関しては、先ほど作成したテンプレートの「メールフォームを表示したい箇所」を以下のような内容に変更を行ったものです。

mail_preview

確認画面用のテンプレート

<form method="post" action="<$MTCGIPath$>plugins/MailForm/mt-mail-form.cgi">
	<p>以下の内容でよろしければ『送信ボタン』を押してください。</p>
	<dl>
		<dt><label for="mail-author">名前</label></dt>
		<dd><MTMailPreviewAuthor><input type="hidden" name="mail_author" value="<MTMailPreviewAuthor>" /></dd>
		<dt><label for="mail-email">メールアドレス</label></dt>
		<dd><MTMailPreviewEMail><input type="hidden" name="mail_email" value="<MTMailPreviewEMail>" /></dd>
		<dt><label for="mail-url">タイトル</label></dt>
		<dd><MTMailPreviewSubject><input type="hidden" name="mail_subject" value="<MTMailPreviewSubject>" /></dd>
		<dt><label for="mail-text">本文</label></dt>
		<dd><MTMailPreviewBody><input type="hidden" name="mail_text" value="<MTMailPreviewBody>" /></dd>
		<dd>
			<input type="button" name="mail_preview" value="修正する" id="mail-preview" onclick="history.back();" />
			<input type="submit" name="mail_post" value="送信" id="mail-post" />
			<input type="hidden" name="mail_blog_id" value="<$MTBlogID$>" />
		</dd>
	</dl>
</form>

mail_error

項目にエラーがある際のテンプレート

<form method="post" action="<$MTCGIPath$>plugins/MailForm/mt-mail-form.cgi">
	<p>以下の項目を修正してください。</p>
	<p><MTErrorMessage></p>
	<dl>
		<dt><label for="mail-author">名前</label></dt>
		<dd><input type="text" size="30" name="mail_author"  value="<MTMailPreviewAuthor>" /></dd>
		<dt><label for="mail-email">メールアドレス</label></dt>
		<dd><input type="text" size="30" name="mail_email"  value="<MTMailPreviewEMail>"/></dd>
		<dt><label for="mail-url">タイトル</label></dt>
		<dd><input type="text" size="30" name="mail_subject"  value="<MTMailPreviewSubject>"/></dd>
		<dt><label for="mail-text">本文</label></dt>
		<dd><textarea rows="10" cols="50" name="mail_text"><MTMailPreviewBody></textarea></dd>
		<dd>
			<input type="submit" name="mail_preview" value="確認" id="mail-preview" />
			<input type="submit" name="mail_post" value="送信" id="mail-post" />
			<input type="hidden" name="mail_blog_id" value="<$MTBlogID$>" />
		</dd>
	</dl>
</form>

mail_post

送信が終了した際のテンプレート

<p>お問い合わせありがとうございました。</p>

設定

ヘッダーメニューの『設定』から『プラグイン』を選択、Mail Form 1.30.1で以下の項目の設定を行います。

送信先のメールアドレスの規定値
自動返信時の送信元のメールアドレスの規定値
メールの題名の前に付加する文字列

これでお問い合わせフォームの作成は完了です。

メールフォームプラグインは非常に拡張性に優れており、項目の追加なども簡単にできます。

関連エントリー

MovableTypeにタグクラウド(SEO対策済み)を設置する
ムーバブルタイプでGoogleSitemapを使う。
WordPressにお問い合わせフォームを設置する。
Contact Form ][に項目を追加する方法
Contact Form ][を日本語化する。

スポンサードリンク

«独立開業 | メイン | FirefoxでHTTP ヘッダを確認する『Live HTTP Headers』»

このエントリーのトラックバックURL
http://blog.webcreativepark.net/cgi/mt/mt-bt.cgi/1203
トラックバック内容
» Movable Type 4.12対応のプラグイン情報 from heeha.ws::blog
エントリーの関連付けを行うプラグイン 関連記事をエントリーに表示するプラグイン:Movable Type(MT)の無料テンプレート Movable ...
コメント

お問い合わせフォームを設置したのですが、IEから見ると化けてしまいます。
どうすればいいでしょうか。

投稿者:藤間 | 2009年2月16日 14:38

>藤間さん

それだけでは原因はわかりませんが、おそらくテンプレートのHTMLの問題じゃないかなと思います。

本エントリーはソースは「メールフォームを表示したい箇所に」設置しているでしょうか?

投稿者:西畑一馬 | 2009年2月16日 15:00

大変素晴らしいプラグインですね!

掲載内容通りに試みてるのですが、
確認や送信ボタンを押すと404エラーが出てしまいます。
MTは2.8.4でロリポップを利用しています。

何が原因かもし分かりましたら教えて頂けないでしょうか?

投稿者:困った | 2009年9月 9日 13:32

>困ったさん

たぶんプラグインが対応してないと思います。
MTはバージョンアップしたほうがよいですよ。

投稿者:西畑一馬 | 2009年9月 9日 17:10
コメントを投稿