AmazonスマイルSALEでお得に買い物する方法まとめ
PR
WordPress

【WordPress】お問い合わせフォームを簡単設置!Contact form 7の使い方

【WordPress】お問い合わせフォームを簡単設置!Contact form 7の使い方 WordPress

WordPressサイトにお問い合わせフォームを簡単に設置できる方法をお探しの方向け。

 

WordPressにはお問い合わせフォームを簡単に設置できる「Contact form 7」という日本人の方が作成されたプラグインがあります。

この記事では、「Contact form 7」使って、WordPressサイトにお問い合わせフォームを設置する方法を解説します。

Contact form 7でお問い合わせフォームを設置する手順

WordPressサイトに「Contact form 7」というプラグインを使ってお問い合わせフォームを設置する手順を解説します。

  • 手順①:プラグインのインストール
  • 手順②:フォーム作成
  • 手順③:フォームの編集

上記のとおりです。

手順①:プラグインのインストール

まず最初に、WordPressサイトに「Contact form 7」をインストールしましょう。

ダッシュボード>プラグイン>新規追加 を選択します。

プラグイン検索窓に「Contact form 7」と入力するとプラグインが表示されますので、「今すぐインストール」をクリックします。インストール終了後「有効化」をクリックして、プラグインを有効化します。

「Contact form 7」をインストールして有効化すると、左側メニューに「お問い合わせ」というメニューが出現します。

以上で「Contact form 7」のインストールは完了です。

手順②:フォーム作成

プラグインをインストールしたら、フォームを作成します。

左側のメニューの「お問い合わせ」をクリックすると、コンタクトフォームの設定画面が表示され、①「新規作成」と②フォーム一覧が表示されます。

本記事では、サンプルフォームを編集して解説しますので、②「コンタクトフォーム1」をクリックします。

新規でフォームを作成したい方は「新規追加」から作成して下さい。

手順③:フォームの編集

「コンタクトフォーム1」をクリックすると、編集画面が表示されます。

各項目の設定方法は下記のとおりです。

  • :フォーム名を編集できます(フォーム名はユーザーに表示されないので管理しやすい名称にしておけばOKです)。
  • :フォームの項目を追加できます(本記事では初期設定のまま使用します)。
  • :自動返信メールを設定しますので、こちらをクリックします。
なお、本記事では項目を追加しませんので、このまま自動返信メールの設定に進めます。

 

【Contact form 7】フォームの自動返信メールの設定方法

次に、フォームの自動返信メールを設定方法を解説します。

なお、自動返信メールはサイト管理者宛てとユーザー宛ての2種類の設定が必要となりますので、下記の順に解説します。

  • サイト管理者宛ての自動返信メールの設定方法
  • ユーザー宛ての自動返信メール設定方法

上記のとおりです。

サイト管理者宛ての自動返信メールの設定方法

サイト管理者宛ての自動返信メールの設定方法を解説します。

フォーム編集画面の「メール」タブをクリックすると、下図設定項目が表示されますので、ここでサイト管理者宛ての自動返信メールを設定します。

各項目の設定方法は下記のとおりです。

  • ①送信先:初期設定では[_site_admin_email](WordPressの管理者のメールアドレス)が設定されています。送信先を変更したい方は編集します。
  • ②送信元:初期設定では[_site_title](サイトタイトル名)が送信者名となっており、アドレスはwordpress@ドメイン名となっています。
    • 送信者名の変更:[任意の名称]に変更すれば送信者名が変わります。
    • 送信元メール:初期設定では@の前が「wordpress」となっているので変更しましょう。
  • ③題名:自動返信メールのタイトルです。
    • [_site_title]:サイトタイトルが表示されますので、削除するか、分かりやすい名称に変更しましょう。
    • [your-subject]:ユーザーが「題名」に入力した題名が表示されます。
  • ④追加ヘッダー:このままでOKです。初期設定の意味は、送信されたメールに返信すると、宛先が[your-email](相手が「メールアドレス」に入力したアドレス)になるという意味です。
  • ⑤メッセージ本文:メール本文です。 [your-name] [your-email][your-subject][your-message]にはそれぞれユーザーが入力した項目が表示されます。
  • ⑥その他選択肢:どちらも使いません
  • ⑦ファイル添付使いません

ここで設定する自動返信メールはサイト管理者宛てに届くメールなので、①~③だけ編集すればOKです。

「③題名」を「〇〇サイトからのお問い合わせ」という件名に変更しておくと、お問い合わせフォーム経由でメールが届いたことをメールボックスで見つけやすくなります。

ユーザー宛ての自動返信メール設定方法

次に、ユーザー宛ての自動返信メールの設定方法を解説します。

ユーザー宛ての自動返信メールの設定は、「メール」タブの下にある「メール(2)を使用」にチェックを入れると設定画面が表示されます。

各項目の設定方法は下記のとおりです。

  • ①送信先:[your-email]は、ユーザーが入力したメールアドレスとなります。
  • ②送信元:初期設定では[_site_title](サイトタイトル名)が送信者名となっており、アドレスはwordpress@ドメイン名となっています。
    • 送信者名の変更:[任意の名称]に変更すれば送信者名が変わります。
    • 送信元メール:初期設定では@の前が「wordpress」となっているので変更しましょう。
  • ③題名:メールの件名です。一般的には「お問い合わせいただき、ありがとうございます」等と書く場合が多いです。
  • ④追加ヘッダー:初期設定では[_site_admin_email]となっており、WordPressの管理者のメールアドレスとなります。管理者のアドレスとフォームで使用するアドレスを変更したい方は、カッコ内のメールアドレスを変更します。
  • ⑤メッセージ本文:メール本文です。 [your-name] [your-email][your-subject][your-message]にはそれぞれユーザーが入力した項目が表示されます。ユーザーに送信されるメールなので、署名を追加しましょう。
  • ⑥その他選択肢:どちらも使いません
  • ⑦ファイル添付使いません

 

Contact form 7で作成したフォームをWebページに表示させる手順

「Contact form 7」で作成したフォームをWebページに表示させる方法を3つの手順で解説します。

  • 手順①:ショートコードの取得
  • 手順②:お問い合わせページを作成する
  • 手順③:お問い合わせページをメニューに追加する

上記のとおりです。

手順①:ショートコードの取得

まずはショートコードを取得します。

ショートコードをWebページに貼り付けるとフォームが表示されます。

 

ショートコードの取得場所は下記2つあります。

  • コンタンクとフォーム一覧画面
  • フォーム編集画面

上記のとおりです。

コンタンクとフォーム一覧画面

コンタクトフォーム一覧画面にショートコードが表示されますので、ここで取得できます。

フォーム編集画面

フォーム編集画面でもショートコードを取得できます。

タイトルの下にショートコードが表示されていますので、ここでも取得できます。

手順②:お問い合わせページを作成する

フォームを表示させるページを作るため、固定ページを新規作成します。

①ページタイトルを入力し、②ブロックメニューを開き、③ショートコードを選択します。

④取得したショートコードを貼付け、⑤URLスラッグを編集します。

URLスラッグは日本語のままにせず、必ず半角英字で編集しましょう。
理由は「【SEO】URLは日本語表記と英語表記(半角英字)どちらがSEOで有利?」をどうぞ。

 

公開ボタンを押せば、フォームが表示されます。

説明文の記載も可能

フォームの説明文が必要な方は、下図のようにお問い合わせに関する注意事項を記載しましょう。

手順③:お問い合わせページをメニューに追加する

お問い合わせページをメニューに追加します。

メニューに追加しないとユーザーはお問い合わせページに辿り着きませので、メニューに追加します。

なお、メニューの作り方は「【WordPress】ナビゲーションメニューの作り方【メニュー追加・階層】」をどうぞ。

 

ダッシュボード>外観>メニュー を選択します。

「メニュー項目を追加」の固定ページに「手順②:お問い合わせページを作成する」で作成したお問い合わせぺージが表示されますので、チェックを入れて「メニューに追加」をクリックします。

下図のように「お問い合わせぺージ」が追加されます。

「メニューを保存」をクリックすると、メニューに反映されます。

メニュー名の説明を追加

メニュー名の説明を追加します(メニュー名の下に表示される英字)。

表示されないテーマもあります。

①メニュー右側にある矢印(▼)をクリックし、②説明項目に半角英字を入力します。

入力後、「メニューを保存」をクリックして設定終了です。

説明項目が表示されない場合

①画面右上にある「表示オプション」という項目をクリックすると、下図のようにメニューが開きますので、②「説明」にチェック入れると表示されるようになります。

プレビューで確認

プレビューで確認すると、メニュー名の下に半角英字が表示されていることが確認できます。

以上でフォームの設置は完了です。

 

お問い合わせフォームContact form 7の機能を強化する方法

最後に、「Contact form 7」の機能を強化する方法を2つ紹介します。興味のある方は設定してみて下さい。

  • 自動返信メールをSMTPメールで送信する方法:迷惑メール回避
  • フォームのスパム登録をブロックする方法

上記のとおりです。

自動返信メールをSMTPメールで送信する方法:迷惑メール回避

サーバーの環境にもよりますが、Contact Form7の自動返信メールが迷惑メールフォルダに入ってしまう場合があります。

 

このような時、SMTPサーバーを経由してを自動返信メールを送信すると、一般のメール送信と同じ仕組みでユーザーに自動返信メールを送信できるため、迷惑メールボックスに入りにくくなります。

設定方法は以下の記事をどうぞ。

フォームのスパム登録をブロックする方法

お問い合わせフォームを公開すると、海外からスパム登録をされる事があります。

公開して数か月は大丈夫だと思いますが、長い期間フォームを公開していると徐々にスパム登録が増えるようになります。

 

もし、スパム登録をブロックしたいという方は、以下の記事で設定方法を解説していますので、是非どうぞ。

 

まとめ

以上、WordPressサイトにお問い合わせフォームプラグイン「Contact form 7」を使ってフォームを設置する方法を解説しました。

「Contact Form7」を使えばショートコードを貼るだけ簡単にフォームを設置できます。

自動返信メールの設定も手軽にできますので、外部ツールを使わずにプラグインを使って設置したい方は、是非お試しください。

 

なお、「Contact Form7」でフォームを作るのが難しい・ハードルが高いと感じたら、以下の記事で紹介している外部サービスやメール配信システムも選択肢の1つとして入れておくと良いかと思います。

 

ひとまず「Contact Form7」でフォームを設置してみて、顧客管理機能や、一斉配信などの機能が必要と感じたら、他ツールも一通り試してみましょう。

 

 

人気記事簡単にネットショップを開業できるおすすめツール6選【無料あり】

人気記事デジタルコンテンツのダウンロード販売可能なツール6選【無料あり】

タイトルとURLをコピーしました