どのサイトを見ても問い合わせフォーム(CONTACT)はある。
ワードプレスを使ったブログ・サイト運営に必要なお問合せフォームの設置方法を学んだので公開。
まず大きくわけると3つの作業を行います。
1・プラグインのインストール
2・問い合わせフォームの作成
3・ページに問い合わせフォームを反映させる
プラグインのインストール
『 Contact Form 7 』というプラグインをインストール。
管理画面のメニューの中からプラグイン→新規追加を選択して、検索窓から『 Contact Form 7 』と検索すると出てくるので、今すぐインストールをクリック。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/1プラグインを追加-1024x662.jpg)
有効化するとWordPressの管理画面のメニューにメールのマークのような『 お問い合わせ 』が追加されてます。
問い合わせフォームの作成
次に管理画面のお問い合わせから『 コンタクトフォーム 1』をクリック。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/2コンタクトフォームがメニューに登場-1024x662.jpg)
問い合わせページの編集画面へと切り替わります。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/3フォームの設定-1024x662.jpg)
設定はとくにいじらずに保存しましたが、自分で文言など修正したい場合は内容を確認して修正しましょう。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/4ショートコードをコピーする-1024x662.jpg)
コンタクトフォームのコードは後で使うのでコピーしておきます。
問い合わせフォームを固定ページに反映する
問い合わせフォームができたので、管理メニューから固定ページ→新規追加を選んでクリック。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/5固定ページのタイトルをつける-1024x486.png)
タイトルはお問い合わせと入力して、先ほどコピーしたコードを貼り付け。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/6ショートコードを張り付ける-1-1024x483.png)
更新をクリックすると反映されます。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/お問い合わせフォームデフォルト-2-971x1024.jpg)
タブレットからだとデフォルトでこんな感じ。
内容を入力して、届くかどうかの確認をしてみましょう。
届くとなんだか嬉しくなりますね。
メニューに問い合わせページを追加する
さて、固定ページはできましたが、このままでは問い合わせフォームまでたどり着けないのでサイトのすべてのページに設置されるメニューリンク・グローバルナビゲーションに設置しましょう。
管理画面の外観→メニューをクリック。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/7メニューにコンタクトフォームを追加-1024x506.png)
最近作ったところにあるので、チェックを入れてメニューに追加をクリック。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/8メニューを保存する-1024x486.png)
メニュー内に反映されたのでメニューを保存をクリックして完了です。
トップメニューに反映されているので確認してみて下さい。
お問い合わせが日本語表記で気に入らなかったので、改めてカテゴリ名の修正・追加などを行いましたが、こんな感じ。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/9メニューに問い合わせ追加-1024x225.png)
最後にサイドバーに問い合わせフォームを追加する方法もご紹介。
管理画面の外観→ウィジェットをクリック、テキスト(PC用)をドラッグしてサイドバーの一覧までもっていきます。
![](https://www.jun-inoue.com/wp-content/uploads/2020/04/11サイドバーに追加する方法-1024x484.png)
テキストの内容にさきほども使ったコードを貼り付けて、タイトルをつけたら完了をクリックするだけで反映されます。
ちなみに個人的にはあまりしっくりこなかったので外しました笑
それでは問い合わせフォームの設置は以上です。
プライバシーポリシーの設置方法はコチラ↓↓↓
コメント