お問い合わせフォーム(Contact Form 7)

ハワイの鳥

申し込みフォーム・コンタクトフォーム・メールフォームの作り方は超簡単!

「WordPressで、お問い合わせフォームを超簡単に作りたい」「Contact Form 7ってどう?」というかたへ。

WordPressブログを運営する私が、1番簡単なお問い合わせフォームの作り方を図解! プラグイン「Contact Form 7」で、メールフォームを簡単に作成できますよ。


この記事を書いた人

・ウェブの初級資格を保有、PCインストラクター経験が少しあり
・ブログに本気で取り組む、A8アフィリエイトBASE(2020年)を1年間受講し学んだ
・賢威8 WordPress版を選び、挫折しないでブログを作成できた

WordPressでお問い合わせフォームを作るには

お問い合わせフォーム(完成例)

ハワイの鳥

ブログにお問い合わせフォームがあると、SEO的にもメリットがあるよ! 作成必須! 信頼性にもつながるよ。

WordPressでお問い合わせフォームを作る方法は、次の2種類です。プラグイン「Contact Form 7」を使うか、エックスサーバーの機能を利用します。

Contact Form 7は、初期設定そのままでも使える、1番簡単なおすすめのプラグインです。お問い合わせフォームの作り方を、初心者向けに図解します。

  1. プラグインを使って作成する(Contact Form 7)
  2. エックスサーバーの「問い合わせフォーム機能」を使って作成する

お問い合わせフォームの作り方(Contact Form 7)

お問い合わせフォーム(Contact Form 7)

プラグイン「Contact Form 7」で、お問い合わせフォームを簡単に作りましょう。チェックボックス、ドロップダウンメニュー、ファイルアップロードなど、項目の追加もボタンクリックですぐ。

自動返信メールや完了ページも設定できます。Contact Form 7でお問い合わせフォームを作る手順は下記です。

まずは、プラグイン「Contact Form 7」をWordPressにインストールしましょう。「プラグイン」をクリックし、「新規追加」ボタンをクリックします。

検索してContact Form 7が出たら、「今すぐインストール」ボタンをクリックします。

  1. プラグイン「Contact Form 7」を設定する
  2. お問い合わせフォームの固定ページを作る
  3. お問い合わせフォームのリンクを、メニューに設定する

1. プラグイン「Contact Form 7」を設定する

お問い合わせフォーム(有効化)

有効化」ボタンをクリックします。

Contact Form 7(設定)

Contact Form 7の「設定」をクリックします。

Contact Form 7(編集)

お問い合わせ」からも、フォームを設定できますよ。「コンタクトフォーム1」の「編集」をクリックします。

Contact Form 7は、初期設定のままでも、氏名・メール・題名・本文・送信ボタンの、シンプルなお問い合わせフォームを使えます。

オリジナルのフォームを作りたい場合は、ボタンクリックで項目を追加できるので、超簡単! 項目の種類は次のとおりです。

  • テキスト
  • メールアドレス
  • URL
  • 電話番号
  • 数値
  • 日付
  • テキストエリア
  • ドロップダウンメニュー
  • チェックボックス
  • ラジオボタン
  • 承認確認
  • クイズ
  • ファイル
  • 送信ボタン

Contact Form 7(お問い合わせフォーム編集)

フォームを作成後、上のコードをコピーします。当ブログは、初期設定のままのお問い合わせフォームを使っています。

Contact Form 7(お問い合わせフォーム編集2)

下の「保存」ボタンをクリックします。

2. お問い合わせフォームの固定ページを作る

お問い合わせフォーム(固定ページ作成)

つづいて、お問い合わせフォームのページを作りましょう。WordPressの固定ページ機能を使用します。「固定ページ」をクリックします。

お問い合わせフォーム(固定ページ作成2)

新規追加」ボタンをクリックします。

お問い合わせフォーム(固定ページ作成3)

記事と同じようにして、お問い合わせフォームのページを、下記の手順で作ります。

※図は旧エディタ(クラシックエディタ)使用の場合です。旧エディタの設定方法については、下記の記事を参考にしてみてください。

  1. タイトルに「お問い合わせフォーム」と入力する
  2. 作成欄にコピーしたコードを貼り付けする
  3. 「公開」ボタンをクリックし、公開する

3. お問い合わせフォームのリンクを、メニューに設定する

お問い合わせフォーム(フッターメニュー作成)

お問い合わせフォームのページを公開したら、ブログのメニューに、ページへのリンクを作成しましょう。

フッターメニュー(ブログの下)に、お問い合わせフォームのリンクを入れる方法をご紹介します。WordPressの「外観」、「メニュー」をクリックします。

お問い合わせフォーム(メニュー作成2)

「編集するメニューを選択」で、「フッダーメニュー(下)(フッターナビゲーション )」を選び、「選択」ボタンをクリックします。

「メニュー項目を追加」で、「すべて表示」タブをクリックし、「お問い合わせ」にチェックを入れ、「メニューに追加」ボタンをクリックします。

右の「メニュー構造」の「メニューを保存」ボタンをクリッックすると完成です。

※先にメニューを作成してから設定します。メニューの作り方は、下記の記事内「賢威8でフッターメニューを作る方法」で図解しました。

お問い合わせフォーム(リンク作成)

ブログの下(フッター)に、お問い合わせフォームのページへのリンクが表示されます。

お問い合わせフォーム(完成例)

お問い合わせ」をクリックすると、作成したお問い合わせフォームが表示されますよ! 当ブログのお問い合わせフォームはこちら。

お問い合わせフォーム(完成例2)

1番シンプルな初期設定のままの、お問い合わせフォーム(Contact Form 7)です。

お問い合わせフォームの作り方(エックスサーバーを利用)

問い合わせフォームのプレビュー

ハワイの鳥

色も選べる、デザイン・お問い合わせフォームを、エックスサーバーの機能で作る方法もあるよ!

エックスサーバーの機能を使って、WordPressにお問い合わせフォームを設置することもできます。

図のように、ブログのイメージに合わせた、デザイン・お問い合わせフォームの作成も簡単です。作り方については、下記の記事で図解しました。

まとめ

お問い合わせフォーム(Contact Form 7)

ハワイの鳥

申し込みフォーム・コンタクトフォーム・メールフォーム・注文フォームのWordPress設置は、超簡単!

WordPressブログに、お問い合わせフォームの設定方法と使い方をご紹介しました。

プラグイン「Contact Form 7」を使うと、初心者も簡単にお問い合わせフォームを設置できます。



あわせて読みたい記事

初心者も簡単すぐにWordPressブログを始められる! 1番簡単なWordPressの始め方を図解しました。

当WordPressブログの作り方を大公開! 初心者向けにわかりやすく図解しました。


WordPressにおすすめのプラグイン! 必須のプラグインも要チェック!