WordPressサイトで問い合わせフォームを作成する

当ページのリンクには広告が含まれています。
  • URLをコピーしました!
生徒

WordPressのサイトに問い合わせフォームを設置したいです

先生

WPFormsプラグインで問い合わせフォームを作る方法を説明します

目次

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

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

問い合わせフォームを設置するメリット
  • 訪問者から内容に対する指摘を受けられる
  • 訪問者からの依頼や質問を受けられる

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

この記事でわかること
  • プラグインWPFormsを利用してWordPressサイトに問い合わせフォームを設置する手順
  • プラグインWPFormsの設定方法や使い方

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

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

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

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

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

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

フォームの作成画面になるので、作成するフォームの名前を入力してテンプレートを選択します。

ここでは名前は「お問い合わせ」、テンプレートはSimple Contact Formを選択しています。

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

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

画面項目の設定


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

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

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

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

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

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

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

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

以上で画面項目の設定は完了です。

これまでの設定内容をまとめると以下になります。

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

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

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

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

次は、フォームが送信された時の通知方法を設定します。

通知画面を開いてデフォルト通知スマートタグを表示をクリックします。

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

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

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

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

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

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

次に、送信後に表示される内容を設定するために確認画面を開きます。

以下の3つから送信後の動作確認タイプを選択できます。

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

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

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

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

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

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

WordPressの管理メニューで固定ページ新規追加を開きます。

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

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

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

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

この1冊でゼロからWEBサイト完成までがわかります
¥2,200 (2023/06/11 07:58時点 | Amazon調べ)
よかったらシェアしてね!
  • URLをコピーしました!
目次