Menu

クラウドサービスのフォームを使う時に見落としがちなGoogle Analyticsの設定

問い合わせやアンケートなどのWebフォームに、外部のクラウドサービス(ASP)を利用している企業は多いと思いますが、その際に意外と面倒なのがGoogle Analyticsの設定です。

よく聞くのは下記のような課題です。

  • トラッキングコードの埋め込み方が分からない
  • サイトとフォームのドメインが変わっても同じように計測したい
  • 目標設定をどう設定すればいいか分からない

フォームはサイトの効果を図るための大切なコンバージョンポイント。曖昧なままにせず、きちんと設定しておきたいものです。

今回は、弊社のクラウドサービス「Synergy!」も例に挙げながら、設定例をご紹介します。

<注意>

  • 個々のサービスによって仕様はさまざまなので、実際に設定する際はお使いのクラウドサービスの仕様をご確認ください。
  • 設定例はユニバーサルアナリティクスのものとなります。従来のGoogleアナリティクスとは設定方法が異なる場合がありますのでご注意ください。

1.フォームにトラッキングコードを埋め込む

サイト運営を制作会社に外注している場合は、Google Analyticsのコードを渡すだけでよかったかもしれませんが、クラウドサービスを自社で運用している場合は自分たちで埋め込む必要があります。
サービスによってはそもそも独自のコードを設定できないというものもあるので、事前に確認しておきましょう。

トラッキングコードの代表的な設定方法
(1)テンプレートのHTMLを編集し、直接コードを埋め込む
(2)アクセス解析用のトラッキングコード設定機能がデフォルトで備わっており、そこにコードを設定する

(1)の場合は、テンプレートのHTMLに直接コードを貼り付けることになります。フォームのソースを確認し、 タグの直前にコードを追加します。

(2)の場合は指定されたエリアにコードを記入します。こちらの場合はHTMLを直接触る必要がありません。「タグを全て入力する」「UA-XXXXX-XXといったトラッキング IDだけを入力する」など、サービスによって設定方法は異なります。

◆Synergy!の場合

「外部連携設定」という機能で、Google Analyticsなどのトラッキングコードをフォームの各ページに設定することが可能です。

198_masumi_02

コードを追加したら、実際のページ(フォーム)のソースを見て、コードが記述されているか確認しておきましょう。IEの場合は、ソースを見たいページの上で右クリック→「ソースの表示」で確認できます。

198_masumi_07

2. 複数ドメインを計測するための設定(クロスドメイントラッキング)

クラウドサービスのフォームを使う場合、URLはそのサービスが所有するドメインが使われることが多いと思います。その場合、自社サイトとはドメインが異なるので、複数のドメインを1つのプロパティでまとめて計測するためには、クロスドメイントラッキングと呼ばれる設定が必要になります。

—————————————————————————————————-  
例:フォームのドメインが違う
自社サイト:http://example.com
フォーム  :https://f.msgs.jp
—————————————————————————————————-  

この設定をしないと、「自社サイト→フォーム」に遷移したユーザーは、異なるセッションを開始した 2人のユーザーとしてカウントされてしまい、正確な計測ができません。

クロスドメイントラッキングの設定

クロスドメイントラッキングを行うにはコードのカスタマイズが必要です。詳しくは下記を参照してください。
参考)クロスドメイン トラッキングを設定する

クロスドメインの設定がきちんとできていると、「自社サイト→フォーム」へ移動した時にURLに「_ga=XXXXXX」というパラメータが自動で付与されるようになります。

—————————————————————————————————-  
例:自社サイトからフォームへ飛んだ時のURL
https://form.bbb.com/input.html?_ga=X. XXXXXX. XXXXXX. XXXXXX
—————————————————————————————————-  

◆Synergy!の場合
Synergy!でフォームを作成すると、基本的には下記のようなURLになります。
https://f.msgs.jp/webapp/form/*****
この場合、トラッキングコードを下記のようにカスタマイズ(赤文字部分)する必要があります。

▼自社サイト(例:example.com)側の記述例

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXXXXX-Y‘, ‘auto’, {‘allowLinker’: true});
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘f.msgs.jp’] );
ga(‘send’, ‘pageview’);

▼Synergy!のフォーム側の記述例

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
 (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXXXXX-Y‘, ‘auto’, {‘allowLinker’: true});
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘example.com‘] );
ga(‘send’, ‘pageview’);

太字の部分(トラッキング ID(UA-XXXXXX-Y)と自社ドメイン(example.com))は自社に合わせて書き換えてください。

参照元除外リストの設定

クロスドメイントラッキングを設定した時に忘れてならないのが、「参照元除外リスト」の設定です。これを設定しないと、ユーザーが「Google→自社サイト(example.com)→フォーム」でページを遷移すると、参照元が「example.com」になってしまいます。参照元除外リストを設定することで、参照元が「Google」となり、正確な計測が可能になります。

設定は、 [アナリティクス設定]→[トラッキング情報]→[参照元除外リスト]→[参照の除外を追加]でドメインと登録します。

◆Synergy!のフォームを除外する場合
参照元除外リスト例
example.com(自社サイト)
f.msgs.jp

フィルタ設定

さらにレポートを正確に分析するために必要なのが「フィルタの設定」です。これについては必須ではなく、必要に応じて設定するのがよいでしょう。

この設定をしていないと、[行動]→[サイトコンテンツ]→[すべてのページ]でレポートを見た場合、例えば「/index.html」というページがサイト本体、フォームのどちらにもあった場合、どのドメインのページなのか判別が難しくなってしまいます。

—————————————————————————————————-  
例:下記のような場合、どちらの「index.html」なのか分かりづらい
http://example.com/index.html
http://f.msgs.jp.com/index.html
—————————————————————————————————-  

フィルタの設定についてはGoogle Analyticsのヘルプページに記載があります。
参考)レポートビューを設定してフィルタを追加する

ただし、この設定をすると「ページ解析」の機能が利用できなくなるなどの弊害もあるので、そこを踏まえて設定する必要があります。
またさきほど必須ではないと言ったように、自社サイトとフォームのページが並んでも明らかに区別がつく場合は、必ずしも設定する必要はないでしょう。

◆Synergy!の場合

Synergy!のフォームURL(入力画面)は下記のようになります。
https://f.msgs.jp/webapp/form/*****/index.do

そのため、[行動]→[サイトコンテンツ]→[すべてのページ]のレポートを見た場合、「/webapp/」で始まるものがフォームのページであることが分かります。よってフィルタをあえて設定しなくても、ページの判別が可能です。
198_masumi_08

3. 目標の設定

フォームには、「入力画面」「確認画面」「完了画面」があるのが一般的ですが、それぞれのURLが固定の場合と可変の場合に分けて、それぞれの設定例をご紹介します。
使っているサービスがどちらのタイプになるのか事前に確認しておきましょう。

①URLが固定の場合

入力画面:https://form.example.com/form.cgi
確認画面:https://form.example.com/form.cgi
完了画面:https://form.example.com/form.cgi

・目標タイプを「目標(URLへのアクセス)」にする場合

「仮想ページビュー」を利用します。確認画面、完了画面が表示されたときに、仮想のページビューを発生させ、そのページを目標に設定します。
参考)リンクのクリックやダウンロードをページビューとして計測する! 仮想ページビューの使い方と注意点[第64回]

・目標タイプを「イベント」にする場合

「イベントトラッキング」を利用します。一例として、フォームの「送信」ボタンにイベントトラッキングのコードを設定し、ボタンがクリックされたときにイベントが発生するようにします。そしてそのイベントの発生を目標に設定します。

②URLが可変の場合

入力画面:https://form.example.com/input.html
確認画面:https://form.example.com /confirm.html
完了画面:https://form.example.com /thanks.html

・目標タイプを「目標(URLへのアクセス)」にする場合

Google Analyticsの画面から設定するだけなので比較的簡単です。
参考)Googleアナリティクスの目標設定していますか?

・目標タイプを「イベント」にする場合

これは固定の場合と同じです。

仮想ページビュー、イベントトラッキングを使う場合、コードやHTMLのカスタマイズが必要なので、ご利用のサービスによっては利用できない可能性もあります。また、カスタマイズにはある程度の知識が必要なので、Webディレクターなどの有識者やサービスの提供会社に確認しながら進めるのがよいと思います。

それぞれの特徴をまとめてみました。

 

URLが固定

URLが可変

目標タイプ

目標(URL へのアクセス)

イベント

目標(URL へのアクセス)

イベント

使う機能

仮想ページビュー

イベントトラッキング

特になし

イベントトラッキング

トラッキングコードのカスタマイズ

必要

不要

不要

不要

HTMLのカスタマイズ

不要

必要

不要

必要

PVへの影響

仮想ページ分増える

影響なし

影響なし

影響なし

目標到達プロセス

利用できる

利用できない

利用できる

利用できない

◆Synergy!の場合
Synergy!のフォームURLは下記のようにページごとに異なりますので、目標タイプを「目標(URLへのアクセス)」にする場合の設定例をご紹介します。
入力画面:https://f.msgs.jp/webapp/form/*****/index.do
確認画面:https://f.msgs.jp/webapp/form/*****/setParameters.do
完了画面:https://f.msgs.jp/webapp/form/*****/executeRegister.do

※「確認画面」を使わない場合や「仮登録画面」を使う場合は、URLは上記とは変わりますので別途ご確認ください。

[アナリティクス設定]→[目標]→[新しい目標]をクリック。タイプは「目標」を選択し、「先頭が一致」を選んで完了画面のURLを入力します。さらに「目標到達プロセス」を「オン」にし、ステップで「入力画面」と「確認画面」を追加し、それぞれのURLを入力します。この時、「https://」を含めないように注意しましょう。
198_masumi_05

まとめ

トラッキングコードの埋め込み、クロスドメイントラッキング、目標設定とGoogle Analyticsの設定の基本についてご紹介しましたが、設定した後は「きちんと計測できているか?」をしっかり確認しておきましょう。設定するだけで満足して、数日後に見てみたらデータがとれていなかった、データに不備があった、というのはよくある話です。

正確な分析は正確な設定から!
押さえるところをきちんと押さえ、アクセス解析を意義あるものにしましょう。

※この記事は2015年2月16日公開時点の情報です。掲載情報と最新情報が異なる可能性がありますのでご注意ください。

PageTop
PageTop