WEBサイトの問い合わせフォームについて

WEBサイトに問い合わせフォームを設置すると以下のメリットがあります。

この記事では、プラグインWPFormsを使用してお問い合わせフォームを作成する方法を説明します。

WPFormsプラグインをインストール

WordPressの管理画面でプラグインー新規追加を開いて、キーワードにContact Form by WPFormsと入力して、検索結果からContact Form by WPFormsをインストールします。

インストールが完了すると 有効化ボタンが表示されるのでクリックします。

インストールして有効化すると、WordPressの管理画面にWPFormsのメニューが追加されます。その中の新規追加をクリックします。

WPFormsでフォーム画面を作成する

WPFormsの開始画面が表示されるので「フォームを作成」をクリックします。

「空白のフォーム」を選択してゼロからフォームを作成することもできますが、問い合わせフォームを作るのであれば、英語とはいえ「Simple Contact Form」を基に作成する方が簡単です。

選択したテンプレートからフォームが作成されます。

画面項目の設定

テンプレートの項目に加えて会社名欄も設けたいので「単一行テキスト」フィールドをドラッグして先頭の位置に配置します。

選択したテンプレートを基に作成されたフォームが表示されます。

配置したテキスト欄を選択して、画面左側のフィールド設定のラベル欄を会社名に変えます。

個人の場合もあるので、その下の必須はOFFのままにしています。

次にその下のテキスト欄を選択して、同じようにラベルをお名前に変更します。また、フォーマットをシンプルへと変更します。

本名の入力を求めたい場合は、姓と名の2つの欄のままでもよいと思います。

次のメールアドレス欄も同様に、ラベルをメールアドレスへと変更します。

最後の入力欄も同じようにラベルをお問い合わせ内容に変更します。

項目	必須	入力タイプ
会社名	NO	単一行テキスト
お名前	YES	名前［シンプル］
メールアドレス	YES	メール
お問い合わせ内容	YES	段落テキスト

次に設定ページへと移動して「送信」ボタンの文字を英語から変更します。

フォーム編集は終わりましたので、ここでフォームを保存しておきます。

フォーム送信時の通知方法を設定する

「メールアドレス」欄がリストに表示されるので選択します。

送信先メールアドレス欄には{field_id="1"},{admin_email}と入力します。

これでフォーム送信時に送信した方にも通知メールが送信されます。

フォームを送信した方にも送信されるのに合わせて、通知メールの件名などを編集します。

メールメッセージに最初からある{all_fields}は全ての項目の入力内容を表示するためのもので、これが無いと入力内容の確認ができないので、必ず残すようにします。

フォーム送信完了後の動きを設定する

項目	説明
メッセージ	入力フォームのページのまま確認メッセージを表示（入力フォームは見えなくなる）
ページを表示	このサイト内の別ページに移動
URLに移動（リダイレクト）	外部サイトのページに移動

ここではメッセージを選択していますが、使い方に応じて変えてください。

メッセージの場合の表示は以下のようになります。

ページに配置する時に必要なショートコードをメモしておきます。

作成したフォームをページに配置する

ページにショートコードのブロックを配置します。

作成したフォームのショートコードを入力します。

編集ページではショートコードが表示されているだけですが、ページのプレビューを開くと、ページにフォームが配置されています。

以上でお問い合わせフォームの設置は完了です。