ホームページにお問い合わせフォームを付ける方法

先生

ワードプレスをホームページとして使う場合、お問い合わせやお申込みをしてもらうことが一つのゴールとなります。

そのためのフォームの設置方法をご案内します。

古川さん

今回はContact Form 7の使い方をご説明します。フォームプラグインの中で一番有名です。

初歩的な使い方

先生

「プラグイン > 新規追加」でContact Form 7と検索し、「今すぐインストール」、ボタンが切り替わったら「有効化」をクリックします。

先生

「お問い合わせ > コンタクトフォーム」をクリックすると、すでにフォームが一つできています。

赤枠で囲んである部分のコードをコピーしてください。

先生

次に、「固定ページ > 新規追加」でフォームを表示させるためのページを作ります。

先生

タイトルを付けて、本文に、先ほどコピーしたコードを貼り付けます。

「公開」ボタンを押したら、パーマリンクをクリックして、表示を確認してください。

先生

このように表示されます。

項目を追加する方法

先生

「お問い合わせ > コンタクトフォーム」を開き、フォームの見出しをクリックします。

先生

赤枠で囲ったボタンを押すと、項目が追加できます。

先生

まずは、追加したい場所に項目のタイトルを書きます。

古川さん

選択式の項目を追加する場合、<label></label>はつけないでください。

もし、選択式の項目を追加して保存ができない場合は、この記述が入っていないかご確認ください。

先生

「ラジオボタン」を押すと、このような画面が立ち上がります。赤枠の部分は自分が管理しやすい半角英数の文字を入れます。

他の項目とかぶらない、オリジナルの文字列にします。最初に入っていた文字を使ってしまって構いません。

先生

項目を一つずつ改行して入れていきます。

最後に「タグを挿入」ボタンを押します。

先生

赤枠の部分のように、項目が入ります。

項目を確認したら、一度「保存」ボタンを押してください。

ただし、これで終わりではありません。

先生

「メール」タブを開きます。先ほど追加した項目の名前が太文字で表示されています。太文字の部分をコピーしてください。

先生

メッセージ本文にわかりやすいように項目を入れます。

これは自分が受け取るメールなので、自分がわかればOKです。

古川さん

ここをきちんと設定しないと、お客様がフォームに入力した情報を受け取ることができません。

先生

このままだと、上手くメールが受け取れなかったときの救済措置がありません。

それでは困るので、次に、管理画面でお問い合わせ内容を管理するプラグインを入れます。

お問い合わせの内容を管理するプラグインを入れる

先生

「プラグイン > 新規追加」で、Flamingoと検索し、「今すぐインストール」、ボタンが切り替わったら「有効化」をクリックします。

これで設定は終わりです。

このプラグインを入れた状態で、まずは、先程作ったお問い合わせから送信テストをしてください。

先生

「Flamingo > 新しいメッセージ」を開くと、送信されたデータを一覧で確認することができます。

先生

次に、タイトルをクリックしてください。

先生

お問い合わせフォームから送られた詳細な内容を確認することができます。