WordPressテーマdeerのデモサイト(コーポレートサイト)

手順5)プラグインの設定をしよう【その2:Ninja Forms】

  
忍者フォーム
\ この記事を共有 /
手順5)プラグインの設定をしよう【その2:Ninja Forms】

今回から、WordPressのオススメプラグインを設定していきましょう。

最低限入れておきたいプラグインは、以下の4つです。

  1. Ninja Forms Contact Form – The Drag and Drop Form Builder for WordPress★今回はコレ
  2. hCaptcha for WordPress
  3. Webp converter for Media
  4. WP Multibyte Patch

このページでは、Ninja Formsというお問い合わせフォームを作るためのプラグインを設定していきましょう。

お問合せフォームが作れるプラグイン「Ninja Forms」

プラグインのインストール方法は、前回の「手順4)プラグインの設定をしよう【その1:プラグインのインストール方法と削除方法を覚えよう】」でお伝えしています。

まずは、WordPressダッシュボードの左メニューで「プラグイン」⇒「新規追加」で「Ninja Forms」で検索すると、以下のアイコンが出てきます↓↓ こちらをインストールして有効化しましょう。

Ninja-Forms

Ninja Formsを設定してシンプルなお問合せフォームを作ろう

↓ WordPress左のメニューで「Ninja Forms」⇒「新規追加」をクリックしましょう。

Ninja-Forms

↓ 「YES. I AGREE!」をクリックしましょう。

Ninja-Forms

↓「空のフォーム」をクリックしましょう。

Ninja-Forms

↓ 右の方から追加したい項目を選んでいきます。まずは「」をクリックしましょう。

Ninja-Forms

↓ すると左の方に「名」というフォームが入ります。名のところの「歯車マーク」をクリックします。

Ninja-Forms

↓ ラベルを「お名前」、必須フィールド「オン」を押して「完了」をクリック。

Ninja-Forms

↓ 続いて「メール」の項目を追加していきます。

Ninja-Forms

↓ メールの設定ボタン(歯車)をクリックします。

Ninja-Forms

↓ ラベルを「メールアドレス」、必須フィールドを「オン」にして「完了」ボタンをクリック。

Ninja-Forms

↓ 続いて「段落テキスト」の項目を追加しましょう。

Ninja-Forms

↓ 追加した段落テキストの設定ボタン(歯車)をクリックしましょう。

Ninja-Forms

↓ ラベルを「お問い合せ内容」、必須フィールドを「オン」にして「完了」ボタンをクリック。

Ninja-Forms14

↓ 続いて「送信」ボタンを追加します。

Ninja-Forms

↓ 送信ボタンが追加されたら「設定(歯車)ボタン」をクリック

Ninja-Forms

↓ 右上の「完了」ボタンをクリック

Ninja-Forms

↓ 続いて「メールとアクション」をクリックしましょう。

Ninja-Forms

↓ 「管理者メールアドレス」をクリックしましょう。

Ninja-Forms

↓ 以下のように操作していきます。

  • 宛先を「あなたのメールアドレス」を入力
  • 件名は「サイトからお問合せがありました」などあなたのメールフォルダに来た時に分かりやすいように入力
  • 返信先の右の方のグレーのボタンをクリック
Ninja-Forms22.5

↓ 返信先の右の方のボタンを押すと、以下のような画面が出ます。「メール」をクリックしましょう。

Ninja-Forms

↓ 返信先に{field~~}が入ります。そしたら「完了」ボタンをクリックしましょう。

Ninja-Forms

↓ 続いて右下の「+」ボタンをクリックしましょう。

Ninja-Forms

↓ 次に「メール」をクリックしましょう。

Ninja-Forms

↓ アクション名「自動返信メール」、あらかじめ宛先に入っているものを消し、横のボタンをクリックしましょう。

Ninja-Forms

↓ メニューが出てくるので、「メール」をクリックして選びましょう。

Ninja-Forms

↓ 以下のようにそれぞれの項目を入力して「完了」を押します。

  • アクション名:自動返信メール
  • 宛先:宛先ボタンから「メール」を選んだもの
  • 返信先:あなたのメールアドレス
  • 件名:「例:【自動返信】お問合せありがとうございます」などと入力します。
  • メール本文:相手の方に届いても良い内容を入力します。
Ninja-Forms

↓ 続いて「公開」をクリック。

Ninja-Forms

↓ フォーム名を入力して「公開」ボタンをクリック

Ninja-Forms

↓ ここまでできたら右上の「×」ボタンをクリック。

Ninja-Forms

ここまでで、フォーム作りは完了。

続いて、出来上がったフォームをWebサイトに設置していきあす。

固定ページにお問合せフォームを設置しよう

↓ 出来上がったフォームのショートコード部分をコピーします。(「Ninja Forms」⇒「ダッシュボード」で以下の画面が開きます)

Ninja-Forms

↓ 「固定ページ」⇒「新規追加」をクリック

Ninja-Forms

↓ 初めて固定ページ作る画面に行くと、ブロックエディターのチュートリアルが出ます。「×」で消しましょう。

Ninja-Forms

↓ タイトルを「お問合せフォーム」、本文にコピーしたショートコードを貼ります。

Ninja-Forms

↓ パーマリンクのURLスラックを「contact」などと入力しましょう。

Ninja-Forms

↓ 右上の「公開」ボタンをクリック。

Ninja-Forms

↓ 確認が出るので再度「公開」をクリック。

Ninja-Forms

↓「固定ページを表示」をクリックしましょう。

Ninja-Forms

↓ 以下のようにお問合せフォームが出ていればまずはOKです。

Ninja-Forms39

試しに送信してみてください。

  • 管理者宛(自分宛て)に管理者向けメール
  • 送信者向けに自動返信メール

が届いていればバッチリオッケーです。

以上で今回のプラグイン「Ninja Forms」の設定は完了です。

続いて別のプラグインの設定にいきましょう。

>次のページ「hCaptcha for WordPressの設定」へ

コメント

メールアドレスが公開されることはありません。 が付いている欄は必須項目です