Movable Type 備忘録

メールフォームテンプレートセット作ってみる

Mar092008
Author: bzbell
Categories: Customize
Tags: Customize, MailForm, Plugins

Next Page: サイドバーにメールフォーム設置してみる
Prev Page: PageBute プラグインをカスタマイズ２

こんにちわ^^

Movable Type 4 になってしばらくメールフォームは取り外してたのですが今回また設置してみました。

Movable Type 3 の頃からメールフォームプラグインを使わせてもらっていたのですが、Version 2 からは商用利用の場合に限り有償となったせいか、製品っぽくなった気がします。

テンプレートセットを利用してることもあって設置はすっごくカンタンにできます。
今回はメールフォームプラグインに自分専用のメールフォームのテンプレートセットを組み込んでしまおう (●＞∀＜●)／です。

既にあるメールフォームプラグインにテンプレートセットを組み込むのはカンタンです。

ディレクトリ構成

たとえば、わたしのサイトで使ってるメールフォームをメールフォームプラグインに組み込んでみましたので、追加した分のディレクトリ構成を以下に記します。

Mailform/
|
+---mt-static
|   +---plugins
|   |   +---MailForm
|   |   |    +---css
|   |   |    |   +---rails
|   |   |    |   |   +---mailform.php
|   |   |    |   |   +---mail_body.png
|   |   |    |   |   +---mail_container.png
|   |   |    |   |   +---mail_footer.gif
|   |   |    |   |   +---mail_form.png
|   |   |    |   |   +---mail_header.png
|   |   |    |   |   +---quotee.png
|   |   |    |   |   +---quotes.png
|
+---plugins
|   +---MailForm
|   |   |
|   |   +---template_sets
|   |   |   |   +---mt_memo.yaml
|   |   |   |   |
|   |   |   |   +---mt_memo_rails
|   |   |   |   |   +---mail_body.mtml
|   |   |   |   |   +---mail_common.mtml
|   |   |   |   |   +---mail_error.mtml
|   |   |   |   |   +---mail_form.mtml
|   |   |   |   |   +---mail_post.mtml
|   |   |   |   |   +---mail_preview.mtml
|   |   |   |   |   +---mail_reply.mtml

赤字のファイルがテンプレートセットの元ファイルになります。
青字のファイルはメールフォームテンプレートで使用する、スタイルシートとイメージファイルです。
そして、緑字のファイルが作成したメールフォームの各テンプレートです。

基本的にはオリジナルのテンプレートを自分好みにカスタマイズして作成するだけです。

組み込んでみる

YAML（ヤムル）ファイル作成
まず、自分用の YAML ファイルを作成します。

上記ディレクトリ構成でいうと、mt_memo.yaml というファイルがわたしが作成したものになります。ファイル名は任意で構いません。
具体的には以下のような内容になってます。
```
order: 3
sets:
  - name:
Movable Type MEMO（rails）
dir:
mt_memo_rails
```
赤字の部分はこちらのメールフォームプラグインV2.0・その2（サンプルテンプレートセットのインストール）の手順でテンプレートセットをインストールする際、ドロップダウンリストからどのテンプレートセットを適用するかを選択します。
そのドロップダウンリストの順番を示しています。番号が大きいほど下に表示されるようになります。

青字の部分は上記ドロップダウンリストに表示される名称です。

緑字の部分はこれから作成する、自分専用のテンプレートセットのディレクトリ名称になります。
YAML ファイルからの相対パスを指定します。上記ディレクトリ構成でいうと plugins/MailForm/template_sets/mt_memo_rails/ です。
各テンプレート作成
メールフォーム用の各テンプレートを作成します。

必要なファイルは以下の通りです。
- mail_body.mtml
  メールの内容になります。このファイルで定義したフォーマットでメール転送されます。
- mail_common.mtml
  メールフォームの本体になります。
- mail_error.mtml
  エラー発生時のテンプレートです。
- mail_form.mtml
  メールフォーム用のメインテンプレートになります。通常のブログテンプレートでいうところの、メインインデックステンプレートに相当します。
- mail_post.mtml
  メール送信完了時のテンプレートです。
- mail_preview.mtml
  メールプレビュー時のテンプレートです。
- mail_reply.mtml
  自動返信用のテンプレートです。このファイルで記述したフォーマットで自動返信されます。
上記ファイルは使用しようがしまいが、必ず用意する必要があります。また、ファイル名は上記ファイル名固定ですのでお間違いなく (￣∇￣)b

手っ取り早くデフォルトのテンプレートをカスタマイズするのが一番いいと思います。
一通り作成したらテンプレートセットディレクトリ（上記ディレクトリ構成でいう mt_memo_rails/）を template_sets/ ディレクトリの中に作成して、その中に各テンプレートファイルを格納します。
デザインしたスタイルシート、イメージファイル格納
最後に、自分でデザインしたスタイルシートやイメージファイルを格納します。

上記ディレクトリ構成でいうと、mt-static/plugins/MailForm/ ディレクトリの中に CSS/rails/ ディレクトリを作成してその中にスタイルシートやイメージファイルを格納してください。

以上で自分専用のメールフォーム用テンプレートセットの完了です。
後は既にインストール済みの MailForm プラグインを上書きインストールしてテンプレートを適用してみてください。

正しくインストールされればドロップダウンリスト中に、作成したテンプレートセット名称が一覧されるはずです。
もしエラーした場合、YAML の記述がおかしいか必要なテンプレートファイルが足らないなどが考えられます。

個人無償ライセンスの Movable Type ご使用に限って二次配布が許可されてますので、わたしが作ったメールフォームプラグインをダウンロードして参考にしてください。

MailForm Plugin by MT-MEMO Customize

一応一通りのカスタマイズ、Ajax 化をしてます。
動作はわたしのメールフォームを確認していただければと思います (●´∀｀●)

以下のページでメールフォームのインストールからカスタマイズについて詳しく説明されてます。

Trackback Pings(0)

TrackBack URL for this entry:

No trackbacks found.

Comments(6)

#1: Posted by 壱 [RES]

こんにちは。

私より先に、テンプレートセットの設置手順を解説していただけるとは思いませんでした（笑）。
なお、いずれこちらのブログでも手順をアップする予定です。

Posted on March 9, 2008

#2: Posted by bzbell [RES]

>>1 壱さん

こんにちわ^^

> 私より先に、テンプレートセットの設置手順を解説していただけるとは思いませんでした（笑）。

わぁ～すいません
テンプレートセットの説明もして頂けるとは思ってなかったです

> なお、いずれこちらのブログでも手順をアップする予定です。

はい。
いつもブログの方拝見させてもらてますので、投稿の際はリンクさせて頂きます

Posted on March 9, 2008

#3: Posted by kankiti [RES]: こんばんは。
いつもありがとうございます。
こちらのＰａｎｄｏｒａのテンプレートの中に組み込む場合は、どのようにすればよいでしょうか？現在２カラムで利用しています。左サイドバーで利用してますので右側の部分に送信フォームが表示されるようにしたいのです。
Posted on March 11, 2008

#4: Posted by bzbell [RES]

>>3 kankiti さん

こんばんわ^^

> こちらのＰａｎｄｏｒａのテンプレートの中に組み込む場合は、どのようにすればよいでしょうか？

メールフォームのテンプレートセットはテンプレートに依存することなく作成することができます。
まずは配布元さんのメールフォームの手順で設置して頂いてから、記事内のように kankiti さん用のテンプレートセットを作成することになると思います
お試しください

Posted on March 11, 2008