WordPressにお問い合わせフォームを設置する方法

  • 2023年10月16日
  • 2024年4月14日
  • WordPress

こんにちは!

ブログ初心者のハナサクです!

ちょっと前から迷惑メールが届くようになったので、セキュリティの強いお問い合わせフォームを設置したいと考えておりました。

ハナサクが使っているWordPressのテーマ「THE THOR(ザ・トール)」にはお問い合わせフォームが付いてますが、最近迷惑メールが届きます!

これが原因なのかはわかりませんが、できれば迷惑メールは届かないほうがよいので、しっかりとしたお問い合わせフォームが無いか、他のブロガーの先輩はどんなお問い合わせフォームを使っているのか調べました。

※お問い合わせフォームはアフィリエイトやGoogleアドセンスの審査時にも必ず必要なものなので探しました!

 

ハナサク
すぐに人気のお問い合わせフォームを発見しました!

 

 

WordPressにおすすめのお問い合わせフォームを探しました

WordPressでお問い合わせと言えばコレ!

というぐらい人気でした!

知らなかった…。

そのお問い合わせフォームの名前は

WordPressのプラグイン「Contact Form 7(コンタクトフォーム7)」です。

 

知ってるよ!

という声が聞こえてきそうな感じですが、WordPress初心者のハナサクは知りませんでした。

知べたら「Contact Form 7(コンタクトフォーム7)」の情報ばかりで驚きました!

とても有名なお問い合わせフォームのプラグインのようです。

 

しかも、このプラグインは作成者が日本人という事もあり、操作方法などの情報も本当に多くブログ初心者のハナサクでも簡単に設置できそうです。

 

「Contact Form 7(コンタクトフォーム7)」プラグイン

Contact Form 7(コンタクトフォーム7)プラグインの詳細などは下記プラグインのサイトをご覧ください。

検証済みのWordPressバージョンなども確認することができます。

「Contact Form 7」WordPressプラグイン の情報はこちら

Contact Form 7

 

とてもよいお問い合わせフォームが見つかり決まったので、さっそくWordPressで人気のお問い合わせフォームプラグイン「Contact Form 7(コンタクトフォーム7)」を設置していきます!

 

WordPressにお問い合わせフォームプラグイン「Contact Form 7」を設置する方法

プラグインをインストールするためにWordPressにログインします。

※ログイン済の方はそのまま進みます!

 

ダッシュボード(管理画面)の左側メニューから「プラグイン」項目の「新規プラグインを追加」をクリックします。

ダッシュボード(管理画面)の左側メニューから「プラグイン」項目の「新規プラグインを追加」をクリックします

 

プラグインを追加のページが表示されましたら、右側にある検索窓に「 Contact form 7 」と入力します。

プラグインを追加のページが表示されましたら、右側にある検索窓に「 Contact form 7 」と入力します。

 

「 Contact form 7 」のプラグインが表示されましたら「今すぐインストール」をクリックします。

「contact」と表示した時点で表示されておりました!富士山アイコンマークのプラグインがContact form 7です。

「 Contact form 7 」のプラグインが表示されましたら「今すぐインストール」をクリックします。

 

インストールが終わりましたら「有効化」をクリックします。

「ContactForm」のインストールが終わりましたら「有効化」をクリックします。

 

ここまでの作業で「 Contact form 7 」のプラグイン導入設置は完了です。

 

ハナサク
プラグインのインストールと有効化って思っていたよりも簡単だったね!

 

「Contact form 7」お問い合わせフォーム設定

ここからは「Contact form 7」のお問い合わせフォームを使うための設定を行います。

「Contact form 7」を有効化したあとに、WordPressの左側メニューに「お問い合わせ」の項目が追加されました。

「Contact form 7」を有効化したあとに、WordPressの左側メニューに「お問い合わせ」の項目が追加されました。

 

「お問い合わせ」項目をクリックすると「コンタクトフォーム」ページが開きました。

 

既に「コンタクトフォーム1」というものが作成されています。

これはデフォルトで作成されているようです。

そのままこの「コンタクトフォーム1」を使いたいと思います。

「コンタクトフォーム1」をクリックまたは、マウスオンで表示される「編集」をクリックします。

既に「コンタクトフォーム1」というものが作成されています。

 

コンタクトフォームの編集ページが開きました。

触ると失敗しそうな危険な感じの情報が書いてますね。。。

とりあえず今回は内容は触りません。

あくまでもお問い合わせフォームの設置が目的なので今回は詳しい設定は行わず設置を目的に進めます!

 

ただ、名前(タイトル)が「コンタクトフォーム1」のままは嫌なので「お問い合わせフォーム」に変えてみました。

情報の変更後は右側にある「保存」のクリックを忘れずに!

コンタクトフォームの編集ページが開きました。

 

コンタクトフォームの画面に戻ると「お問い合わせフォーム」に名前(タイトル)が変わっていました!

これでお問い合わせフォーム自体はできましたが、実はまだ使えません!

最後にもうひとつだけ設定の続きがあるのでもう少し頑張って進めましょう!

名前(タイトル)の右側に「ショートコード」という「 [contact-fo—————- title=”お問い合わせフォーム”] 」があるのでこれを[ ](カッコ)も一緒にコピーします!

名前(タイトル)の右側に「ショートコード」という「 [contact-fo---------------- title="お問い合わせフォーム"] 」があるのでこれを[ ](カッコ)も一緒にごとコピーします!

 

固定ページにショートコードを貼り付けます

左側のメニュー「固定ページ」項目から「新規固定ページを追加」をクリックします。

 

固定ページの編集が表示されましたら情報の入力とコピーしたショートコードを貼り付けます。

固定ページでの操作は下記①~④の内容です。

  1. まず先に記事入力部分にショートコードを編集画面に貼り付けます。
  2. タイトルを「お問い合わせ」と入力します。(このタイトルはメニューに表示されます)
  3. パーマリンクの情報を編集します。今回は「contact」だと迷惑メールが届く確率が上がるため「otoiawase」にしました。
    (他の言葉でもよいですがお問い合わせフォームとわかった方が良いと思います。)
  4. 右側にある「公開」または「更新」をクリックします。

 

旧クラシックエディタの画面の場合

旧クラシックエディタの画面の場合

 

ブロックエディタの画面の場合

※ブロックエディタのパーマリンクの変更は右側のURLの部分をクリックすると「パーマリンク」の入力欄が表示されますのでここに入力します。

ブロックエディタのパーマリンクの変更は右側のURLの部分をクリックすると「パーマリンク」の入力欄が表示されますのでここに入力します。

 

 

お問い合わせフォームの完成

あとはURLを確認すると「お問い合わせフォーム」が作成されてます!

とてもシンプルなお問い合わせフォームですが完成です!

ハナサク
お疲れさまでした!
とてもシンプルなお問い合わせフォームですが完成です!

お問い合わせフォームができたらメニューに追加しておきましょう。

メニューの追加方法はまた次回の記事でまとめたいと思います!

最新情報をチェックしよう!