今回は、Googleアナリティクスを使って、サイトに設置したYouTubeの再生状況を計測する方法についてご紹介です。
目次（ページ内リンク）
概要
YouTubeとGoogleアナリティクスの連携についてご紹介します。
この計測により「動画再生回数はわかるが、サイトに設置した動画の再生ボタンを押している”人”は何人なのか？」「YouTube動画を見てくれた人が、購入にいたっているのか？」といった点を分析することが可能です。
実装にあたり、DanWilkerson氏の「YouTube Google Analytics Embed Tracking」を使用しています。
計測結果
最終的にこんな感じに計測できます。
イベントアクション：Play, Pause, Watch to End, 10%（再生状況）が計測
イベントラベル：YouTube動画のURL
それぞれ、イベント発生回数、ユーザー数、目標到達数を集計できます。
一点、注意事項として、YouTube動画の再表示（一瞬のちらつき）が発生する可能性があります。実装後、ちらつき度合や、他のjsとの干渉を確認することオススメすます。
ポイント・注意点
- YouTube動画自体の再生回数は、別途YouTubeアナリティクスで集計できます。
- YouTubeの再生ボタンに直接イベントトラッキングを実装するのは、ほぼ不可能です。
- YouTube APIを使うと、Googleアナリティクスのイベントとして再生／停止を計測できます。
- ただその場合、YouTubeの設置をiFrameではなく、Scriptタグで設置する必要があります。
- ここでは、通常の埋め込みタグiframeでYoutubeの再生などをGAのイベントで計測します。
- 単体のGoogleアナリティクスでも可能ですが、今回はGoogleタグマネージャーを使った実装方法をご紹介します。
設定手順
では、早速、実装手順です。
javascriptファイルをサーバーに格納
こちらのページの画面右側の「Download ZIP」からzipファイルをダウンロードします。
lunametrics/youtube-google-analytics · GitHub
github.com/lunametrics/youtube-google-analytics#google-tag-manager-installation
解凍したファイルから「lunametrics-youtube.gtm.js」のみ後のカスタムHTMLタグで使用します。
変数（旧：マクロ）
続いて、Googleタグマネージャの変数、トリガー、タグを設定します。
まずは、変数から。
cjs_YouTube動画存在判定
[js]
function() {
var iframes = document.getElementsByTagName(‘iframe’);
var embeds = document.getElementsByTagName(‘embed’);
var i;
function isYouTubeVideo(potentialYouTubeVideo) {
var potentialYouTubeVideoSrc = potentialYouTubeVideo.src || ”;
if( potentialYouTubeVideoSrc.indexOf( ‘youtube.com/embed/' ) > -1 ||
potentialYouTubeVideoSrc.indexOf( ‘youtube.com/v/' ) > -1 ) {
return true;
}
}
for(i = iframes.length – 1; i > -1; i–) {
var _iframe = iframes[i];
var test = isYouTubeVideo(_iframe);
if(test) {
return true;
}
}
for(i = embeds.length – 1; i > -1; i–) {
var _embed = embeds[i];
var test = isYouTubeVideo(_embed);
if(test) {
return true;
}
}
return false;
}
[/js]
videoAction
attributes.videoAction
videoUrl
attributes.videoUrl
トリガー（旧：ルール）
続いて、トリガー。
ページにYouTube動画を見つけた時
イベント発動：youTubeTrack
タグ
最後にタグ。
C1_gtm_youtube
カスタムHTMLは、Scpriptタグと、「lunametrics-youtube.gtm.js」の内容をコピペしてください。
[html] <script type="text/javascript" id="gtm-youtube-tracking">※この部分に「lunametrics-youtube.gtm.js」の内容をコピペしてください。
</script>
[/html]
画像のトリガーは、すべてのページにしています。
YouTube動画を検出した場合のみタグを発火したい場合には、トリガーに「ページにYouTube動画を見つけた時」を設定します。
E4_YoutubeEvent
GTMプレビューモード動作確認
GTMのプレビューモードで設定が問題ないか確認します。
Youtubeを設置したページを開きます。
C1_gtm_youtubeタグが発火していることを確認できます。
ページ上のYouTube再生ボタンをクリックすると、E4_YoutubeEventタグが発火しました。
イベントカテゴリ、アクション、ラベルが設定されています。
YouTube動画の再生が50％（半分）に達すると同イベントが発火し、50%のイベントアクションが計測されます。
Googleアナリティクスで計測確認
Googleアナリティクスのリアルタイムイベントにて、今のタグ発火が計測されているか確認します。
例えば以下のように計測されていればOKです。
イベントアクション：10%
以上で完了です。
最後に
この計測によって、Youtube動画の再生回数だけなく、再生した人の人数や再生した人が購入に至っているかなどをGoogleアナリティクスを使って分析することが可能です。ぜひお試しください。
ご要望ありましたら、Googleタグマネージャ版だけなく、Googleアナリティクス版も作成します。
GoogleアナリティクスやGoogleタグマネージャの知識が足りないと感じたか方は、まず書籍等で勉強されることをオススメします。
インプレス
売り上げランキング: 24,422
インプレスジャパン
売り上げランキング: 37,410
インプレス
売り上げランキング: 1,169
