【簡単】Contact Form by WPFormsでお問い合わせフォームを作成するやり方

Contact Form by WPFormsでお問い合わせフォームを作成するやり方

ブログを開設したら必ず設置したいお問い合わせフォーム。
プラグイン「Contact Form by WPForms」を使用すれば、簡単にお問い合わせフォームの作成できます。

もちこ

お問い合わせフォーム設置のプラグインは「Contact Form 7」が有名ですが、「Contact Form by WPForms」の方が使いやすく初心者におすすめです!

この記事では、Contact Form by WPFormsを使用したお問い合わせフォームの作成のやり方を紹介していきます。

目次

プラグイン「Contact Form by WPForms」とは

「Contact Form by WPForms」は、お問い合わせフォームを簡単に作成できるプラグインです。

もちこ

無料版と有料版がありますが、無料版で問題なく使用できます!

Contact Form by WPFormsでお問い合わせフォームを設置する流れ

Contact Form by WPFormsでお問い合わせフォームを設置する流れを解説していきます。

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

まずはプラグイン「WPForms」をインストールします。

「プラグイン」→「新規プラグインを追加」をクリック。

WordPressプラグインインストール

「Contact Form by WPForms」と入力して検索後、インストールします。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

インストールが完了したら有効化をクリックします。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

これでインストールは完了です。

もちこ

次にフォーム名とテンプレート設定をします。

フォーム名とテンプレートを設定する

プラグインの有効化が完了すると、このような画面が表示されます。
「最初のフォーム作成」をクリックします。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

このような表示がされたら、「行きましょう!」をクリックして次に進みます。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

フォームに名前をつけて「簡単なお問い合わせフォーム」のテンプレートを選択します。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方
もちこ

フォームの名前は分かりやすければ何でもOKです!

お問い合わせフォームの内容を設定

お問い合わせフォームの内容を設定します。

テンプレートを使用すると、このようなお問い合わせページが作成されます。
「フィールドを追加」で必要な項目を増やすことができます。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

変更したい項目をクリックして、「フィールド設定」でラベルの名称や必須項目にするかなど編集することが可能です。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方
もちこ

「コメントまたはメッセージ」を「お問い合わせ内容」に変更しました。

自分好みにカスタマイズして使用できます。

Advanced Google reCAPTCHAを導入

お問い合わせフォームにはスパム対策にAdvanced Google reCAPTCHAを導入しましょう!

Advanced Google reCAPTCHAの初期設定のやり方はこちらの記事を参考にしてください。

WPFormsの編集画面で「CAPTCHA」をクリックします

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

すると、このような表示がされるので「WPForms 設定」をクリックします。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方
もちこ

WordPress管理画面の「WPForms」→「設定」からでも同じ画面に飛べます。

「CAPTCHA」を選択して設定してきます。

  • reCAPTCHAを選択
  • タイプ→reCAPTCHA v3を選択
  • サイトキーを入力
  • シクレットキーを入力

サイトキーとシークレットキーは、Google reCAPTCHA公式サイトから取得できます。
入力が完了したら、「設定を保存」をクリックします!

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

設定が完了したら、編集画面に戻り、もう一度「CAPTCHA」をクリックします。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

このような表示がされるので、「OK」をクリックします。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

reCAPTCHAが表示されているのを確認して、「保存」をクリックします。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

固定ページにお問い合わせフォームを埋め込む

固定ページにお問い合わせフォームを埋め込みをすると、簡単にお問い合わせページが作成できます。

WPFormsの編集画面の右上の「埋め込む」をクリックします。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

次にこのような画面が表示されるので「新規ページを作成」をクリック。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

ページ名を入力して、次に進みます。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方

ページ編集画面が表示されるので、リンクを「contact」に変更して、問題なければ「公開」をクリックします。

Contact Form by WPFormsでお問い合わせフォームを設置するやり方
もちこ

これでお問い合わせページが完成しました!

最後に、実際にお問い合わせが届くか自分でメッセージを送信してみましょう!

Contact Form by WPFormsでお問い合わせフォームを作成するやり方まとめ

Contact Form by WPFormsで簡単にお問い合わせフォームを作成するやり方を解説しました。

Contact Form by WPFormsでお問い合わせフォームを作成するやり方
  1. プラグイン「WPForms」をインストール
  2. フォーム名とテンプレートを設定
  3. お問い合わせフォームの内容を設定
  4. Advanced Google reCAPTCHAを導入
  5. 固定ページにお問い合わせフォームを埋め込む

Contact Form by WPFormsを使用すれば、プログラミングの知識がなくても簡単にお問い合わせフォームを作ることができます。

もちこ

必ずお問い合わせページは作成しましょう!

目次