フォームの作成と投稿データの管理

この機能はパッケージ版Lite以上のプランをご契約の場合にご利用頂けます。

フォーム項目の作成

まず、お名前・ご意見などフォームを構成する項目を作成します。

  1. Movable Typeのサイドメニューにある[フォーム]の中の[フォーム項目]をクリックします。
  2. ページタイトルの下にある[新規作成]をクリックします。
  3. フォーム項目の作成画面が表示されるので必要事項を入力していきます。
    • 名前はフォームのラベルになります。
    • ベースネームはフォーム項目を識別するために利用されます。またinput要素のname属性値になります。
  4. 入力が完了したら[保存]をクリックします。
  5. 2〜4を繰り返し、必要なフォーム項目を作成していきます。

フォームの作成

フォーム項目を作成したら、それらをひとまとめにしてフォームにします。

  1. Movable Typeのサイドメニューにある[フォーム]の中の[フォーム]をクリックします。
  2. ページタイトルの下にある[新規作成]をクリックします。
  3. まずフォームに必要な項目を[すべてのフォーム項目一覧]から選択してチェックを入れます。その後[→]をクリックし、このフォームの項目にセットします。さらに項目をドラッグ&ドロップで並べ替えて表示順を整えます。
  4. 次に[フォームの設定]を行います。
    • テンプレートは通常[[archive] アプリ用ウェブページ(WebView)]を選択します。
  5. 続いて[フォームのメッセージ]を開き、確認画面や送信完了時など、必要に応じて表示されるメッセージを入力していきます。
  6. 最後に[メール通知]を開き、メール通知(管理者への通知)の設定・送信者への通知の設定を行います。
  7. 設定が完了したら[保存]をクリックして完了です。

フォームを選択するカスタムフィールドの作成

フォームとウェブページが関連付けできるよう、カスタムフィールドを作成します。

  1. Movable Typeのサイドメニューにある[カスタムフィールド]の中の[新規]をクリックします。
  2. カスタムフィールドの編集画面が開くので、画面に沿って入力していきます。標準的な設定は以下の通りです。
    • 名前は「フォームを選択」とします。
    • 種類は「フォーム」を選択します。
    • ベースネームは「contactformselector」とします。
    • テンプレートタグは「ContactFormSelector」とします。
  3. [保存]をクリックし、カスタムフィールドを保存します。
  4. Movable Typeのサイドメニューにある[デザイン]の中の[テンプレート]をクリックします。
  5. [アプリ用ウェブページ(WebView)]を開きます。<$mt:PageBody$>の下に先ほど設定したテンプレートタグ(<$mt:ContactFormSelector$>)を記述します。(ContactFormSelectorと設定した場合は既に記述されていますので設定の必要はありません。)

ウェブページとフォームの関連付け

フォームが実際にサイトに表示されるよう、ウェブページを作成してフォームをセットします。

  1. Movable Typeのサイドメニューにある[ウェブページ]の中の[新規]をクリックします。
  2. ウェブページの編集画面が開くので、カスタムフィールド[フォームを選択]で先ほど作成したフォームを選択します。
  3. [公開]をクリックします。
  4. ウェブページの一覧に戻り、先ほど作成したウェブページのIDを確認します。(IDが表示されていない場合は、一覧右上の[表示オプション]でIDにチェックを入れて下さい。)
  5. Movable Typeのサイドメニューにある[設定]の中の[アプリの設定]をクリックし、アプリの設定画面を開きます。
  6. フォームのURL欄にhttps://[your domain]/__app__/pages/[ウェブページのID].htmlを入力し保存をクリックします。

受け付けたフォームデータの確認

フォームで受付をしたデータは、メール通知の他にMovable Typeの管理画面上でも確認ができます。

  1. Movable Typeのサイドメニューにある[フォーム]の中の[投稿]をクリックします。
  2. 現在までに受け付けた投稿データが表示されます。投稿データのリンクをクリックすると、投稿データの編集画面に遷移し詳細が確認できます。