WordPressに問合せフォームを追加しよう 【MW WP Form】

問い合わせフォームをWordPressに実装してみます。
今回は、MW WP Formを利用しました。

MW WP Form

ショートコードによるフォーム作成MW WP Form はシンプルなショートコードを記述して入力フィールドを追加していきます。フォーム作成画面には自由にHTMLを入力することができるので自由にフォームをデザインする...

mw-wp-form.web-soudan.co.jp

MW WP Form のインストール

管理画面のプラグイン追加画面よりキーワード MW WP Form で検索します。
今すぐインストールし、 有効化へ進めていきます。

問い合わせフォーム

このような、「お名前」、「メールアドレス」、「お問合せ内容」、と「確認・送信ボタン」が配置されたフォームを設置します。

フォームの追加

「新規追加」をクリックしフォームを作成します。
フォーム名は、「問合せフォーム」としました。

お名前フィールドの追加

問い合わせいただく方の「お名前」を入力する項目を追加します。
名前を入力するので「テキストフィールド」を使用します。

「テキストフィールド」を選択し「フォームタグを追加」をクリックしフィールドの属性を設定します。

「name」のみ設定し「Insert」ボタンをクリックします。

※「必須項目」などのバリデーションルールは後ほど設定します。

メールアドレスフィールドの追加

問い合わせいただく方の「メールアドレス」を入力する項目を追加します。
メールアドレスを入力するので「Email フィールド」を使用します。

「Email フィールド」を選択し「フォームタグを追加」をクリックしフィールドの属性を設定します。

「name」のみ設定し「Insert」ボタンをクリックします。

※「必須項目」などのバリデーションルールは後ほど設定します。

お問合せ内容フィールドの追加

「お問合せ内容」を入力する項目を追加します。
「テキストエリアフィールド」を使用します。

「テキストエリアフィールド」を選択し「フォームタグを追加」をクリックしフィールドの属性を設定します。

「name」のみ設定し「Insert」ボタンをクリックします。

※「必須項目」などのバリデーションルールは後ほど設定します。

送信ボタンの追加

「送信ボタン」を追加します。
「確認・送信フィールド」を使用します。

「確認・送信フィールド」を選択し「フォームタグを追加」をクリックしフィールドの属性を設定します。

必須項目の設定

「フォームを編集」画面の下に「バリデーションルール」に今回追加した各項目の「必須項目」や「文字数」などのルールを設定します。

先ほど登録した「Ｅメール」項目に「必須項目」と「メールアドレス」形式ルールを登録します。

自動返信メールの設定

先ほど登録した「Ｅメール」項目宛てに自動返信メールを送信するには「自動返信メール設定」欄に「Ｅメール」を設定します。

完了画面メッセージの設定

問い合わせフォームをページに貼り付け

問い合わせフォームをページに貼り付けるための「フォーム識別子」をメモします。

「新規追加」にて「問合せページ」を作成します。

先ほどメモした「フォーム識別子」を貼り付けます。

最後に

作成した「問合せページ」を表示し動作確認します。