【wordpress】Contact Form 7で、お問い合わせページを作る

今日はWordpressでブログ、ＨＰ作成の準備といたしまして

「お問い合わせページ」

をプラグインの定番「Contact Form 7」で作ってみました。

コンタクトをとる重要な設定なので初期の段階で設置しておきましょう。

インストール

WordPressダッシュボードから「プラグイン」→「新規追加」　「Contact Form 7」を検索します。

Contact Form 7が出てきたら「今すぐインストール」をクリックします

インストールが終わったら、プラグインを有効化しておきます。するとダッシュボード左側のメニューの中に「お問い合わせ」の項目が追加されます。

Contact Form 7　フォーム設定

プラグイン一覧の中にある「contact Form 7」の「設定」をクリックします。

「コンタクトフォーム１」にカーソルを合わせると「編集」が表示されるのでクリックすると、フォームが表示されるので「URL」のタグをクリックします。

フォームタグ生成:URL の下にある赤枠の部分 [url url_〇〇〇]をコピーしてフォームタグ生成:URLを閉じます。(〇〇〇の数字はフォーム作成ごとに違う数字が表示されます）

先程のフォーム画面の中にある「メールアドレス」「題名」の間に以下のコード（コピーしたものを貼りつけて）追加します。

プラグイン「Akismet」を使用している場合

WordPressに最初から入っているスパム対策のプラグイン「Akismet」を利用している方はContact Form7と連携ができます。

フォーム内の「お名前」「メールアドレス」「ＵＲＬ」に追加で以下のコード（赤文字）を追加してください。

入力が終わったら「保存」をクリックします。

Contact Form 7　メール設定

編集画面の「メール」をクリックして開きます。

問い合わせメールの宛先や、メッセージ内容などの変更ができます。

自分のメールアドレスに届くものです。特に変更がなければ、画面下にある「メール（２）を使う」をクリックします。

「メール（２）」はお問い合わせをくれた方への自動返信メールです。

メールを自分のメールアドレスに変更したり、件名や本文に追加でメッセージを付け加えることができます。

設定が全て終了したら最後に「保存」をクリックします。

お問い合わせページを作る

先程のコンタクトフォーム編集画面上、またはコンタクトフォーム一覧にショートコードが表示されているので、コピーしておきます。

WordPressダッシュボードから「固定ページ」→「新規追加」をクリックします。

本文に先程コピーしたコードを貼りつけるだけです.私は「お問い合わせ」と名付け、パーマリンクをcontactにしました。

入力が終わったら「公開」をクリックし、作ったページをメニューに追加しておきます。

プレビューで確認してみましょう。メニューバーに「お問い合わせ」の項目があり、それをクリックすると

こんな風にフォーム欄が完成しました！

まとめ

コンタクトフォームを作ると画面上に「コンタクトフォームの設定検証をする」という表示がでるので検証しておきましょう。またメール（２）自動返信メールの本文内容は、ネットショッピングなどで送られてくる文を参考にして、一言添えてみました。

一度、フォームから自分でメッセージを送ってみると、どのように届くのか、不備はないか確認出来るので確認することをオススメします。

お疲れ様でした！