コンバージョンページが無いときの成果の取り方 ―イベントトラッキング編―

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

どうも。
久々にデスノートを読んで感涙している私はLです。冗談です、粟飯原です。

さて、先日社内製品のホームページをリニューアルしました。
http://admage.jp
です。ぜひ見てみてください。

今回は、
コンバージョンを取りたいけれど、ページとしては成果ページが存在しないので成果が取れない!!
駄目だこいつ…早くなんとかしないと…状態の場合の対処について書きたいと思います。

【前提】

ADMAGEのサイトでは、問い合わせ頂くことをネットプロモーションにおけるコンバージョンと設定しております。
えるしってるか、ADMAGEの新サイトには問い合わせ完了ページが無い。
くそっやられた!

ちなみに、問い合わせに対してのレスポンスは、javascriptでDOMにメッセージを追加しています。
下図のように、ボタンをクリックすると、テキストがレスポンスされます。

問い合わせ送信の見た目

ちなみにこれは以下のようにしています。
(1)問い合わせボタンクリック
(2)javascript呼び出し
 javascriptで下記のようにしてます。(処理の一部を記載しています)


$.ajax({
	type: 'post',
	//メール送信の処理が書いてあるphp
	url: 'mail.php',
	//phpに渡してあげたいデータ
	data: 'company=' + company + '&name=' + name + '&email=' email,
	
	//phpへの通信が成功したら…(通信が成功したらsuccessなので、メール送信が成功したかとは別)
	success: function(results) {
		//responseというidの要素(divなど。htmlに記載しておく必要があります)
		$('#response').html(results);
	}
}); // end ajax

(3)メール送信が成功した場合、失敗した場合、いずれも<div id=’response’>に応答を書き出します。

書き出す内容は、下記phpで場合分けして出します。


<?php
	//postで渡されたデータ取得
	$company = trim($_POST['company']);
	//中略

	$error = "";
	
	//エラーチェック	
	if (strlen($company) < 2) {
		$error['company'] = 御社名をご入力ください。;	
	}
	//中略
	
	if (!$error) { 
		//エラーなければメール送信
		//送信の処理は中略
		
		//送信成功したか判断して下記出力
		 echo "<div class='alert alert-success'><i class='icon-flag'></i> メールの送信が完了しました。 折り返しご連絡致しますので、お待ちください。</div>";
		}
	}else {
		//エラーの場合はメールは送らず、エラー文をレスポンス
		$response = (isset($error['company'])) ? "<div class='alert alert-error'><i class='icon-warning-sign'></i>  " . $error['company'] . "</div> \n" : null;
		
		echo $response;
	}
?>

【問題点】

さて、今回のメインの話です。
上記の通り、成果ページはありません。(成果として遷移するhtmlが無い、という意味です。)
どのようにコンバージョンを取れば良いでしょうか。

ひとくちにコンバージョントラッキングといっても、色々あると思いますので、何種類かに分けてお話します。

【Analytics】

Analyticsで目標を設定し、どういうフローで目標達成したいのか測りたい!!という場合。
まずはこれです。
まぁ、最悪メールが来たら、問い合わせされたことはわかるのですが、それではあまりに芸が無さそうです。

というわけで、イベントトラッキングで、問い合わせ完了のイベントを送り、それを目標とします。

[イベントのコードの書き方]

既知のことかもしれませんが、ユニバーサルアナリティクスであるか、そうでないかでイベントトラッキングのコードが違うので注意してください。

「うちのアナリティクスはユニバーサルかどうかわからないぞ??」
という方のためのちょっとしたtips

管理画面を見たらもちろんわかると思いますが、他にもこのような方法があります、という方法を紹介します。
※普通のPV取得のタグは入っている前提です。
(画像はChromeで見た場合です。Firefoxなどでも同じことができますので、適宜ブラウザでのやり方はしらべてください。)

デベロッパーツールで見る

(1)イベントトラッキングを組み込んだりしたいページをブラウザで開く
(2)F12を押す(デベロッパツールを開く)
(3)Sourcesタグを開く(図中の1)
(4)Sourcesの中から、「www.google-analytics.com」を探して開く(図中の2)
(5)読み込んでいるファイル名をチェック(図中の3)

読み込んでいるのが、ga.jsなのか、analytics.jsなのかで見分けることができます。
ga.js → 普通のアナリティクス
analytics.js → ユニバーサルアナリティクス

この読み込んでるライブラリが違うから、イベントトラッキングで記載するコードも違う訳です。

実際のコードは簡単です。

普通のアナリティクスの場合

_gaq.push(['_trackEvent','カテゴリ','アクション','ラベル']);

ユニバーサルアナリティクスの場合

ga('send','event','カテゴリ','アクション','ラベル');

※アルファベットで書いている部分は、固定文字列なので、大文字にしたり違う文字だと反応してくれないので気をつけましょう

[イベントのコード呼び出し]

さて、今回のキモです。
要は上記のスクリプトを実行させれば良いんです!やりたいことはそれだけです。
どうやってイベントのコードを呼び出せば良いでしょう?

今回の場合、ボタンのonclickに指定したくありません。
問い合わせボタンを押した際に、入力内容に不足やエラーがあった場合、問い合わせは完了しておらず、完了としてのアクションにはボタンクリックはふさわしくないからです。

というわけで、メール送信後のjavascriptで呼び出すことにしました。
今回の場合下記のようにしてみました。


$.ajax({
	type: 'post',
	//メール送信の処理が書いてあるphp
	url: 'mail.php',
	//phpに渡してあげたいデータ
	data: 'company=' + company + '&name=' + name + '&email=',
	
	//phpへの通信が成功したら…
	success: function(results) {
		//responseというidの要素(divなど。htmlに記載しておく必要があります)
		$('#response').html(results);
		if(results.indexOf("success") != -1){ //resultsの中に「success」という文字列が含まれているかチェック
			ga('send', 'event', 'Form', 'Send', 'Complete'); //実際のイベント送信
		}
	}
}); // end ajax

phpを見るとわかるかもしれませんが、メール送信成功とエラーで、書き出すものが違います。
<div class=’alert alert-success’>なのか、<div class=’alert alert-error’>なのかという違いです。(もちろん文章も違いますが、可変ですので)
というわけで、phpからのresultsとして、「success」という文字列が入っている場合のみ、メール送信が成功したとみなし、イベント送信をしています。

イベント送信確認analytics
ちゃんとイベント送信されています。
計画どおり。

これで、アナリティクス経由での成果計測はできそうです。

次回は、引き続き、AdWordsのコンバージョントラッキングの手法についてお話します。




広告システムについてのお問い合わせやご相談、パッケージ製品の詳細はこちらからどうぞ。
http://admage.jp/
アプリ計測SDK admage for Appのお問い合わせ・詳細はこちら。
http://apptizer.jp/

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

コメント

コメントを残す

*