超 簡単!Contact form 7 を 資料 ダウンロード フォームに!ワードプレス

企業 の ホームページ で、ホワイトペーパー マーケティング は、とても重要になってきています。リード(見込み顧客)獲得 につながるからです。

しかし、ホワイトペーパー を作っても ホームページ に ダウンロードフォーム がない!となると、本末転倒ですよね。また、ただ、資料だけ、DLできるようにしても、意味がないですよね。

そこで、今回は ワードプレス で 超 簡単 に作れる 資料 ダウンロードフォーム について解説していきます。

もちろん メールアドレス や 名前 会社名 電話番号 を登録していないと 資料 が DL できない フォーム になりますので リード を 獲得 して、その後の メールマーケティング や テレアポ に使えますよ!

ホームページに資料ダウンロードフォームを設置する方法

まずは、ホームページに資料ダウンロードフォームを作るフローを書いていきます。

ただ、ワードプレスでホームページが作られていることが前提になります。

手順は以下の通りです。

  1. プラグイン Contact form 7 をインストール
  2. Contact form 7を有効化
  3. Contact form 7 で 入力フォームを作成
  4. サンクスページ(資料DLページ)を作成
  5. Contact form 7でリダイレクトの設定
  6. Contact form 7 「入力ありがとう」メッセージ の 文言変更

流れとしては、上記の6ステップで完了します。

ちなみに、Contact form 7については、次で解説しますが、国産のメールフォーム作成が簡単にできるワードプレスのプラグインです。

Contact form 7 とは

Contact form 7とは、ワードプレスで、メールフォームを作るなら、これ!と言われるほど、日本では人気のプラグインです。

Contact form 7は無料で使えます。

Contact form 7は導入や設定がとっても簡単なので、多くのwebサイトで使われています。フォームの内容も、かなり柔軟に編集ができます。さらに、Contact form 7は、汎用性が高いため、ネットで検索すると、いろいろな情報が転がっています。

なので、メールフォームを作るなら、Contact form 7は、非常にメリットの高いツールになっています。

チェックボックス、ラジオボタン、クイズなど、ボタン1つで作れてしまうのも、非常に使いやすいとされている理由ですね。

ワードプレス初心者でもくじけることはないでしょう。

Contact form 7でサンクスページを設定する方法

Contact form 7には、サンクスページがついていないのですが、資料のDLができるようにするため、サンクスページを作りましょう。

これは固定ページで、thanksなどのページ名で作ればOKです。

このサンクスページに、資料をDLできるようにファイルを設置するなり、資料DLのできるURLを置くなり、資料をDLできるQRコードを掲載すればOK!

サンクスページを作れば、Google広告のCVタグや、facebook広告のCVタグ、Yahoo広告のCVタグと、さまざまな広告の効果測定ができるようになります!CVタグの設定ができないのは、webマーケティング上、自動化もできないので、もったいないですよ!

サンクスページを作るのは、こういったメリットがあって、便利ですよ。

Contact form 7での設定方法

Contact form 7で、この作成したサンクスページを読ませるためには、

Contact form 7で

「その他の設定」タブをクリックして、入力欄に以下を記載

1on_sent_ok: “window.location.href =’サンクスページのURL’;”

サンクスページのURLは、httpからのフルパスで記述してください。

これであとは、Contact form 7で

「メッセージ」タブから、

メッセージが正常に送信された の下の欄に、送信しています。と記載するだけ。

これで、資料のDLフォームが完成です!

もちろん、資料請求フォームを経由しないと、たどり着けないページになるので、名前や会社名、TELなど、リード情報を取得できます!

1つのサイトから 複数の資料をダウンロードできるようにする方法

ワードプレスのContact Form 7 を使って、1つのホームページから、複数の資料をダウンロードできるようにする方法についてもまとめておきます。

実際、ホワイトペーパーでマーケティングする場合、複数の資料をダウンロードできるようにしておきたいですよね。

複数のファイルをダウンロードできるようにするために行うことのロジックは以下になります。

  • Contact Form 7で作ったフォームの完了画面を2つ以上作る
  • それぞれDLフォームごとに、完了画面のリダイレクト先をわける
  • それぞれの完了画面に、資料ごとのダウンロードボタンをつける

というロジックです。

そのためには、Contact Form 7に加えて、もう1つ、ダウンロードモニターというプラグインを使います。ダウンロードモニターで、資料をダウンロードできる口を複数作ることで、上記が可能になります。

複数資料のダウンロードを可能にする手順 5STEP

さっそくですが、実装方法の解説です。

前提として、Contact Form 7のインストールや、ダウンロードフォームの設定をしていることを前提とします。

手順としては、5STEPです。

  1. Download Monitor の インストール
  2. Download Monitor 設定
  3. Download Monitor にて資料アップロード
  4. 固定ページで、申し込み完了画面を2つ作る
  5. functions.phpに下記コードを記載

これで完了です。

functions.phpにコードを入れる際、functions.phpに、バックアップは事前にとっておいてくださいね。壊れたら、直すのが大変ですからね。

詳細を解説していきます。

ワードプレス で 複数資料 ダウンロード 可能にする方法 詳細

複数 資料 の ダウンロード を 可能 にする 方法 の詳細を、こまごま解説していきます。手順やロジックを理解していると、速いかもですね。

  • Download Monitor というプラグインをインストール
  • 有効化をして、Download Monitor 設定画面へ
  • デフォルトテンプレートで「ボタン」を選択
  • ホットリンクの防止を有効にチェック
  • Download Monitor の 新規作成画面へ
  • タイトルと、ダウンロードしてもらう資料をアップロード
  • Download Monitorのショートコードをメモっておく
  • 固定ページで、サンクス画面を作成
  • Download Monitor で メモったショートコードを設置
  • ワードプレスの外観メニューにあるテーマエディターから、functions.phpを選択。

以下のコードを設置。

////////////////////////////////////////////////////////
//コンタクト7 完了画面切り分け
////////////////////////////////////////////////////////
add_action( ‘wp_footer’, ‘wpcf7_mailsent_1’ );
function wpcf7_mailsent_1() {
?>
<script type=”text/javascript”>
document.addEventListener(‘wpcf7mailsent’,function(event) {
if (‘対象のコンタクトフォーム7-ID’ == event.detail.contactFormId) {
location.replace(“サンクスページ1″)
}
},false);
</script>
<?php
}

add_action( ‘wp_footer’, ‘wpcf7_mailsent_2’ );
function wpcf7_mailsent_2() {
?>
<script type=”text/javascript”>
document.addEventListener(‘wpcf7mailsent’,function(event) {
if( ‘対象のコンタクトフォーム7-ID’ == event.detail.contactFormId) {
location.replace(“サンクスページ2”);
}
},false);
</script>
<?php
}

Download Monitorのボタンのデザインが気に入らなければ、CSSで編集

Download Monitorのボタンのデザインの編集例は以下にあります。

参考)
【WordPress】Download MonitorプラグインのボタンをCSSでカスタマイズする方法
https://howcang.com/2020/08/05/dlm/

プラグインDownload Monitorのダウンロードボタンをカスタマイズ
https://zbnr-hp.com/download-button-css

ぜひ活用してみてください。

Contact Form 7 使い方 解説 動画

Contact Form 7の設定方法が、イマイチわからないという方向けにおすすめな方法は、動画をみて、イメージを高める方法です。

そこで、おすすめのContact Form 7 使い方 解説 動画をご紹介します。

3つの動画を紹介しますね。

動画で、画面の動きも見ていくと、イメージはつきやすいと思います。

Youtubeは、こういう使い方ができるのでいいですよね。

解説動画も活用してみてください。

要注意!ワードプレスのフォーム スパム対策 重要

要注意です!スパムが、最近、多いのです。特に、ワードプレスのお問い合わせフォームにのみ、がんがん、メールを送り続ける スパムメール。

それゆえ、スパムメール対策 重要 なんですよね。

そんなときこそ、

reCAPTCHA。

Google reCAPTCHA を 導入すれば、、

大量に届く、お問い合わせフォーム経由のスパムメールを、撲滅可能です!!

Google reCAPTCHA
https://www.google.com/recaptcha/about/

見たことあると思います。Google reCAPTCHA。

導入しているホームページも増えていますし。

設定は、Contact form 7 なら、とっても簡単です。

プラグイン Contact form 7の中にあるインテグレーションの中に、Google reCAPTCHA の登録時にもらったサイトコードとシークレットコードを登録するだけ!

簡単にGoogle reCAPTCHA をContact form 7 に導入できますよ。

【新 プラットフォーム】 Yahoo広告 ディスプレイ広告(運用型)とは YDN ⇒ YDA

Contact Form 7 スパム 対策

Contact Form 7 は、スパムメール 迷惑メールが来やすいのです。

そこで、Contact Form 7 スパム 対策 として、以下のプラグインを活用しましょう。

スパム 対策 プラグイン Akismet

Akismetをインストール、設定すれば、スパムメール 迷惑メールを、かなりの確率でブロックしてくれます。

WordPressに標準装備のプラグインで、登録すれば、設定は簡単です。

WordPressの標準プラグインだから、バグも起きにくいです。公式プラグインですしね。

まとめ Contact form 7 でも ホワイトペーパーDL施策は簡単にできる!

デジタルマーケティングをしていく過程で、重要視されるホワイトペーパー。

その資料請求フォームは、Wordpressを活用することで、こんなに簡単にできます。

web制作会社に依頼して、30万円!って言われるよりも、

自分で、さくさくできるので、1時間くらいで、制作可能ですよ。

また、Contact form 7のサンクスページがあれば、広告の効果計測にも使えます。ちょっとしたContact form 7の設定で、マーケティングの効果がわかるなら、いいですよね!

WordPressで、企業ホームページをより便利にしていくTIPS。

こういう記事も、少しずつ書いていきますね!

Zoho CRM ゾーホー なら AI で 営業先 レコメンド!中小企業 に おすすめ CRM