[WordPress]お問い合わせフォームを設置しよう

ずいぶん時間が空いてしまいましたが、Wordpressにお問い合わせフォームを設置する手順を説明します。お問い合わせフォームはWordpressのメニューでは定番のコンテンツです。プロフィールページを作成したことのある方はご存知かもしれませんが、固定ページを使います。プラグインを使って簡単に設置しましょう。
Contact Form 7プラグインのインストール
ブログを閲覧している方がお問い合わせなどを行う場合に使うメールフォームを簡単に作成できるプラグインをインストールします。
管理画面左側にあるメニューのプラグイン>新規追加をクリックし、キーワードに「Contact Form 7」と入力して出てきた一番はじめのプラグインをインストールします。
インストールが終わると、「有効化」ボタンが現れますので、引き続きクリックして有効化します。
これでContact Form 7プラグインが使えるようになりました。
メールフォームを作成しよう
管理画面の左側にあるメニューに「お問い合わせ」が追加されたのに気付きましたでしょうか?
その中のコンタクトフォームをクリックします。
「コンタクトフォーム1」が既に用意されています。これをひな形として、新しく作ります。
コンタクトフォーム1にカーソルを当てると「複製」のリンクが現れますので、クリックします。
題名の「コンタクトフォーム 1_copy」を「お問い合わせフォーム」に変えておきましょうか。
フォームタグの中身は、記事や固定ページで表示されるフォーム部分、つまりよくお問い合わせで見かける構造を形作っています。このフォームでは既に「お名前」「メールアドレス」「題名」「メッセージ本文」の4つの欄と「送信」ボタンが表示されるようになっています。
もちろん、「お名前」を目的によっては「ご芳名」や「name」などに、「メッセージ本文」なども「お問い合わせ内容」や「ご依頼内容」に書き換えることができます。
次はお隣のタグ、メールタグに移動します。
ここでは「フォーム」に入力された内容をご自分が持つメールアドレスに送るための設定をします。
[your-name]や[your-message]などがありますが、これは後々カスタムすると考えてそのままにしておきましょう。
もちろん、ご自分のメールアドレスは変更可能です。確認したら一番下にある保存ボタンをクリックします。
これでメールフォームは作成できました。下の画像に赤線が引かれている部分、これはショートコードと言うのですが、次のためにコピーしておきます。
次は実際に表示させてみましょう。
メールフォームを使ってみよう
先ほど作成したメールフォームを使ってみましょう。ここでは新規の固定ページ作成画面を開いて、コピーしておいたコードを貼り付けます。
右メニューの公開ボタンをクリックして、ページを表示させてみましょう。
表示されました。
それでは実際にメールを送ってみましょう〜♪
動作確認しましょう
フォームの入力欄に適当に書いてみました。ささっと書いたので何かひっかかっても気にしないでください…
@マークを半角にするのを忘れないようにしてくださいね。
入力後、送信ボタンを押すと…
送れましたね。それでは自分のアドレスのメールボックスをみてみましょう。
上々ですね。
作成したフォームは投稿記事にも設置できます。
お時間がありましたら、試してみてくださいね。お疲れ様でした!
実際にやってみるとサクッと簡単に作成できるのですが、こうして記事にすると結構時間かかりますね…Contact Form 7の中身も見た目もカスタマイズ可能なので、その記事も近いうちに書けるといいなと思っています。ねこま(@necomacustom)でした。