【2022年】Contact Form 7の設定方法・使い方を初心者向けに解説【WordPressプラグイン／ブログお問い合わせフォームの作り方】

専業ブロガー５年目のあずきです🐥

WordPressをやるなら欠かせない定番プラグインの１つ…

について、導入手順から設定方法＆使い方までブログ初心者さん向けに１から解説していきます

「Contact Form 7」は、WordPressのブログで…

を作成するためのプラグインです

もちろん無料のプラグインで、使い方も超簡単！

具体的には…

↑ このような「お問い合わせフォーム」をサクッと作ることができ、一般的には…

↑ こういった「フッター」メニューなどに設置しておくのが定石です

フッターは、ブログの「最下部エリア」のことだね！

そんな「Contact Form 7」について、３つのステップで丁寧に解説していきます

ということで、さっそく見ていきましょー🐥

【2022年】Contact Form 7の設定方法・使い方を初心者向けに解説【WordPressプラグイン／ブログお問い合わせフォームの作り方】

ステップ１：WordPressプラグイン「Contact Form 7」の導入手順【インストールと有効化】

はじめに…

について

WordPress管理画面の左側にある一覧メニューから…

↑「プラグイン」という項目にカーソルを合わせ、開いたメニュー内にある「新規追加」をクリックしましょう

つづいて、画面の右上にある…

↑ こちらの検索フォームに　Contact Form 7　と入力し、その下の検索結果から…

↑ このアイコンが目印のプラグイン「Contact Form 7」を探し、右上の「今すぐインストール」ボタンをクリックします

上の画像例はすでに「有効化」済みの状態だから、「今すぐインストール」ボタンは表示されてないよ！

「今すぐインストール」ボタンが「有効化」という表示に切り替わったら、つづいて「有効化」ボタンもクリックしましょう

↑「プラグインを有効化しました。」と表示されたら、プラグインの「インストール＆有効化」は完了です

お次は肝心の「お問い合わせフォーム作成方法」について見ていこう！

ステップ２：WordPressプラグイン「Contact Form 7」の設定方法＆使い方【お問い合わせフォームの作り方】

つづいて２つ目のステップは、プラグイン「Contact Form 7」を使って…

について

まずは、WordPress管理画面の左側一覧から…

↑　お問い合わせ　＞　コンタクトフォーム　をクリックしましょう

すると…

↑ このような画面になるので、画面中央に表示されている…

↑ こちらの「ショートコード」を、両端の　[　]　という記号まで含めて、丸々コピーしておきます

コピーは Ctrl ＋ C！

「ショートコード」をコピーできたら、今度はWordPress管理画面の…

↑　固定ページ　＞　新規追加　をクリックしましょう

ここから、この「ショートコード」を使って…

を作成していきます

「固定ページ」の編集画面が開いたら、まずは一番上側に表示されている…

↑「タイトル」欄に、お問い合わせフォームの「ページタイトル」となる任意の名称を入力しましょう

このタイトル名は、特にこだわりがなければ…

↑ このように、　お問い合わせ　といったシンプルな名称が無難です

このタイトルはあとからいつでも変更できるよ！

タイトル名を入力すると、その下に…

↑ このように「パーマリンク」という設定欄が表示されるので、「編集」というボタンをクリックします

「編集」ボタンをクリックしたら…

↑「パーマリンク」欄が開くので、このフォーム内を任意の文字列に入力し直したうえで、「OK」ボタンをクリックしましょう

ここは特にこだわりがなければ、上画像のように「お問い合わせ」を意味する　contact　といった文字列がシンプルでわかりやすいと思います

日本語のパーマリンクは ”文字化け” しちゃうから、「英数字」に直すのが基本だよ！

ちなみにこの「パーマリンク」は、さきほどのページタイトルと違って…

一度そのページを「公開」したら、基本的にはあとから変更しない

のが鉄則です

ということで、「パーマリンク」の設定もできたら、その下側に表示されている…

↑ こちらの本文エリアを見ていきます

まず、本文エリアの「右上」に並んでいる…

↑ この…

という２つのタブについては、「ビジュアル」モードのままでOKです

最初から「テキスト」が選択されている場合は、「ビジュアル」タブに切りかえよう！

「ビジュアル」タブが選択されていることを確認したら、さきほどコピーした「ショートコード」を…

↑ このように両端の　[　]　という記号まで含めて、本文欄にそのまま貼りつけましょう

貼りつけは Ctrl ＋ V！

「ショートコード」を本文エリアに貼りつけたら、画面の右側にある…

↑ こちらの「公開」ボタンをクリックして、「お問い合わせフォーム」ページの作成は完了です

あとは、この作成した「固定ページ」をブログの…

など、任意のエリアに設置すればOK🐥

参考までに…

当ブログでも使用中の「ACTION AFFINGER6」における、「ヘッダー＆フッターメニュー」への固定ページ設置手順についてはこちらをどうぞ ↓

最後に、メッセージが実際に送られたときの ”送信先アドレス” の設定について見ていくよ！

ステップ３：「Contact Form 7」から送信されたお問い合わせメッセージの ”送信先メールアドレス” を設定する方法

最後のステップは、「Contact Form 7」で作ったお問い合わせフォームからメッセージがいざ送信されたときの…

について

つまり、読者さんからのメッセージを受け取る「自分のメアド」のこと！

というのも…

「Contact Form 7」のお問い合わせフォームから送信されたメッセージというのは、「WordPress管理画面」のなかで確認や返信ができるわけではなく…

というドメインごとで用意されているメールアドレスから、「Contact Form 7」側で設定してある任意の…

に、自動で届くようになっているんですね

で！

「Contact Form 7」のデフォルト設定では、WordPressをインストール（開設）したときに自分で登録した…

というのが、そのまま ”送信先メールアドレス” として設定されています

ちなみにこの「管理者メールアドレス」は、WordPress管理画面の…

↑　設定　＞　一般　をクリックしたなかにある…

↑ こちらの「管理者メールアドレス」という項目で設定してあるメールアドレスのこと

とはいえ…

というのは、正直あまりおすすめしません

なぜなら、読者からのメッセージを受け取ったアドレスで「そのままメールのやり取りを始めてしまった」場合…

管理者メールアドレスが、相手方に知れ渡ってしまう

ためですね

「管理者メアド」と「お問い合わせ用メアド」は、ちゃんと分けておきたいよね

なので結論！

この ”送信先メールアドレス設定” については、最初に変更しておくのが無難です

手順は簡単で、まずはWordPress管理画面から…

↑　お問い合わせ　＞　コンタクトフォーム　をクリックし、さらに…

↑ こちらの「コンタクトフォーム 1」という場所をクリックします

つづいて、画面上部の…

↑「メール」というタブをクリックして開きましょう

すると…

↑ このような設定画面が開くので、一番上側にある…

↑ こちらの「送信先」というフォームを見てみます

この「送信先」つまり運営者自身から見たときの ”受信アドレス” に、デフォルトの状態では…

というタグが設定されていて、このタグによって「WordPressの管理者メールアドレス」がそのまま適用されるようになっています

「admin」は管理者という意味！

この最初から入っているタグを削除して…

↑ このように、メッセージを受信したい「任意のメールアドレス」を直接入れ直しましょう

第三者に知られても問題ない、「お問い合わせ専用」のメアドがおすすめ！

ということで…

「送信先」のフォームを変更できたら、画面の右側もしくは下側にある「保存」ボタンをクリックして、設定は完了です🐥

ちなみに！

お問い合わせを送信された ”読者さん側” のお名前とメールアドレスについては、その下の「メッセージ本文」というフォームに最初から入っている…

↑ こちらの…

というタグによって、それぞれ自動で適用されるようになっています🐥

つまりこの【your】は、運営者自身ではなく読者さんのこと！

あずきのワードプレスブログ「完全初心者」ガイド

※2021年発表Infotop Affidemy