Contact Form7の使い方ーWordPressプラグイン【初心者向け】

WordPressのプラグインの使い方を初心者向けに紹介する記事です。

今回は、WordPressに問い合わせフォームを設置できるプラグイン、Contact Form7の使い方を紹介します。

 

なお本記事は、TechAcademyのWordPressオンラインブートキャンプの内容をもとに紹介しています。

 

 

Custom Field Templateとは

問い合わせフォームを簡単にWordPressに追加できるプラグインです。

項目も全てカスタマイズできるので、初心者でも簡単にオリジナルのフォームを作成することが可能です。

 

 

プラグインをインストールする

このプラグインは、管理画面から「プラグインを検索」してインストールもできますし、プラグイン公式サイトからダウンロードすることも可能です。

インストールがわからない場合はWordPressのプラグインをインストールする方法をご覧ください。

 

プラグインを有効化すると、ダッシュボードに「問い合わせ」というリンクが増えています。

それでは、プラグインを設定していきましょう。

最低限必要な3つのステップを紹介します。

• 1:問い合わせフォームの内容を設定する
• 2:メールを設定する
• 3:問い合わせフォームを表示するページを作る

 

 

[PR] WordPressで挫折しない学習方法を動画で公開中

1:問い合わせフォームの内容を設定する

コンタクトフォームの設定画面を見てみましょう。

 

左側の設定エリアに書かれた内容が、コンタクトフォームに表示される内容です。

これを、好きな項目にアレンジしていきます。htmlで装飾することも可能です。

このコンタクトフォームは、下記のようなルールで記載されています。

お名前 (必須)<br />…フォーム上で表示される文字（<br />は改行記号）
[text* your-name]…入力フォームの形式ショートコードと、タグの識別ID

 

入力フォームの形式は、たくさんあります。追加する場合は、まず右のプルダウンをクリックします。

すると、入力フォームの設定項目が表示されるので、必要に応じてカスタマイズします。
（選択項目などの場合は、ここで入力）

 

必須項目にしたい場合は、チェックボックスにチェックを入れましょう。

この時、ショートコードが生成されます。入力フォームで表示される用と、入力フォームの内容を知らせるメールで使用する用の2パターンがあります。

 

 

コードの設定ができたら、フォーム入力エリアに記入しましょう。

これを繰り返し、カスタマイズしていきます。

 

 

 

2:メールを設定する

引き続き、手順1と同じ画面からメールの設定をします。この設定をしないと、せっかく送信された問い合わせフォームが行方不明になってしまうので要注意です。

このメールは、問い合わせフォームが送信されたら、その内容を送信するためのものです。問い合わせフォーム設定エリアの下に、メール設定エリアがあります。

 

まずは、問い合わせフォームの送信を知らせるメールの内容を決めます。HTML方式にチェックが入っていないので、普通に文章を書く感覚で記述できます。

フォーム内容を引用したい箇所に、タグを記入しましょう。

 

 

ここまで設定ができたら、ページ右上にある保存ボタンを押しましょう。

そこに表示されるショートコードを控えておいてください。

 

 

3:問い合わせフォームを表示するページを作る

問い合わせフォームを設置するページを準備しましょう。

フォームを表示したい場所に、先ほどコピーしたショートコードを貼り付けるだけでOKです。

 

好きな場所に表示できるので、ブログ投稿の末尾に記入したり、テキストウィジェットを利用してサイドバーに表示したりとアレンジ可能です。

実際に設置するとこうなります。

今回の記事は以上です。

 

WordPressの他のプラグインを使ってみたい場合は、Quick Cacheの使い方も合わせてご覧ください。

 

 

[お知らせ]TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressオンラインブートキャンプを開催しています。期間中の8週間は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。