アフィーロード

アフィリエイトがあるじゃないか!

*

WordPressで定番のメールフォーム用プラグイン「Contact Form 7」を導入する

    2016/05/21

contactform7-thum

ブログには、お問い合わせ用のメールフォームが必須ですよね。

記事の内容に関する問い合わせや、相互リンクの申し込み、広告の依頼などもメールでやり取りするのが一般的ですからね。

当ブログも設置しないといけなかったのですが、あまりにもアクセスがないので必要なさげで放置していましたw。

WordPressには、定番の便利なプラグインがあるので導入しましょう。何事も定番からです。

Contact Form 7を導入する

Contact Form 7は製作者が日本人のプラグインです。

プラグインを追加する

  1. 管理画面メニューの「プラグイン」から新規追加をクリック。
  2. 検索窓にプラグイン名「Contact Form 7」を入力してクリック。

    Contact Form以降の部分は、半角スペースと半角の7以外だと本家とは違うものが出てくるの注意してください。

  3. 見つかったら、いますぐインストールをクリック。

    ※浮世絵風の富士山がサムネイルで、作者は「Takayuki Miyoshi」です。

  4. プラグインを有効化をクリック。

設定方法

  1. 管理画面メニューの「お問い合わせ」から新規追加をクリックします。
  2. 「コンタクトフォームを追加の画面」で新規追加をクリックします。contactform71
  3. 初期状態では、お名前・メールアドレス・題名・メッセージ本文・送信ボタンが設定されています。取り合えず保存します。contactform72
  4. ショートコードが出現するので、コピーしてメールフォームを表示したい箇所に貼り付けます。貼り付け方は後述します。contactform73

お問い合わせフォーム用のページを作成する

お問い合わせ用の固定ページを用意するのが一般的でしょう。

  1. 管理画面メニューの「固定ページ」から新規追加をクリックします。
  2. 先ほどのショートコードをエディタ内に貼り付けます。contactform74
  3. 取り合えず、お問い合わせフォームが完成しました。contactform75

正しくメールが送られるか、念のためにメールを送信してみましょう。

メールは管理画面メニューの「設定」のメールアドレスに記入したメルアドに送られてくるはずです。

contactform78

お問い合わせフォームへのリンクをメニューに追加する

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

  1. 管理画面メニューの「外観」からメニューをクリックします。
  2. 固定ページにお問い合わせが追加されています。チェックを入れて、メニューに追加をクリックして、メニューを保存をで保存します。contactform76

メニューに追加されました。

contactform77

カスタマイズする

管理画面メニューの「お問い合わせ」から下図の編集をクリックします。

contactform712

フォームの編集

contactform713

チェックボックスを付ける

色々と設定できますが、チェックボックスについて説明します。

デフォルトのままだと、メッセージ本文以外の項目でEnterを押すと送信されてしまいます。

スパムメール防止や送信前に確認をしてもらうためにチェックボックスを付けます。チェックを入れないと送信できないようにするわけです。

チェックボックスをクリックすると下図のポップアップ画面が出ます。

contactform79

送信の手前にコードを貼り付けます。

contactform710

チェックボックスが追加されました。

contactform711

まとめ

Contact Form 7を使うと、簡単にお問い合わせ用のフォームを追加できます。カスタマイズも色々できるので、サイトに必要な設定を考えてみるといいでしょう。

広告依頼とか友好的なお問い合わせが、たくさん来るといいですね。

 - WordPress, プラグイン

Message

メールアドレスが公開されることはありません。

  関連記事

STINGER5
STINGER5をWordPressのテーマに選んでみた

WordPressをインストールして、まずやるべきは記事を書くことではなく、ブロ …

Google Analytics by Yoastを使えばトラッキングコードを貼るのも簡単です!

解析ツールの定番Google Analytics(アナリティクス)を導入するとき …

WordPressのテーマをカスタマイズするなら、まず子テーマを作ろう!

そろそろブログのデザインをどうにかしたいなと思うわけですが、どうやらいきなりテー …

WordPressをインストールした後やっておきたい事のまとめ

新しいサイトを作って、WordPressをインストールした後に毎回しておくべき事 …

挿入画像のデフォルト値を変更して無駄な手間を省こう

WordPressで画像を挿入する時の話しですが、気が付いたら毎度ブログに表示す …

ビジュアルエディタのレイアウトをブログと同じにする

記事を書いてはプレビュー、また書いてはプレビュー・・・・・ 少々几帳面なのか、文 …

AddQuicktagプラグインでタグ打ちをとことん手抜きしよう

TinyMCE Advancedで基本的な機能は揃える事が出来たのですが、他にも …

STINGER5の子テーマでCSSが上手く反映されない原因を解決!

子テーマを作ったので、取り合えず文字サイズでも変更してみようと思ったのですが、な …

アイキャッチ画像を記事の先頭に自動で表示させる簡単な方法!

記事の先頭に画像があると、見栄えが良さそうだなと思います。 しかし、アイキャッチ …

目次
「Table of Contents Plus」プラグインで目次を簡単に作成!

雑誌を読む時は、まず目次から見るという人は多いと思います。 目次を見ると、記事の …