「カラーミーショップ」Google Analyticsで「カートに入れた商品名と金額」を計測する

 in Google Analytics / Webサイト制作 / アクセス解析 / カラーミーショップ by



shoppro_ga_35
「カラーミーショップをGoogle Analyticsでコンバージョンを測定してみる」で紹介した
買い物があったときのコンバージョンの設定は カート内の各ステップのデータが取れないので
途中の離脱率などは計測できません

なので 「カートに入れる」ボタンをクリックしたときに 「商品名」と「金額(販売価格×個数)」のデータをとれるようにしてみました

カラーミーショップの管理画面で編集すること

編集するページを表示する

step1

shoppro_ga_01

管理画面の「お店をつくる > デザインを設定する > デザイン設定」から

step2

shoppro_ga_03

現在使っているテンプレートの「デザイン設定」をクリック

step3

shoppro_ga_36

「商品詳細」の「HTMLcss編集」をクリック

step4

shoppro_ga_11

このページの「HTML編集」を編集していきます

htmlを編集する

step1 javascript関数を追加する

shoppro_ga_12


<script type="text/javascript">
function getprice(){
  var product_price = <{$product.sales|replace:',':''|regex_replace:"/円((.+?))/":""}>;
  var product_num = document.product_form.product_num.value;
  var product_total = product_num * product_price;
  _gaq.push(['_trackEvent', 'Shopping', 'Addcart', '<{$product_name|strip_tags:false}>' ,product_total]);
}
</script>

Google Analyticsのイベントトラッキングに「商品名」と「金額」を設定するJavaScriptの関数です

step2 カートボタンにjavascriptを追加する

  onclick="getprice();"

「カートに入れる」ボタンをクリックしたときに 先ほど追加した関数を呼び出します
これで 「カートに入れる」ボタンをクリックするたびにデータをGoogle Analyticsに送ることができるようになります

step3 更新する

最後に「更新」ボタンをクリックして 編集を内容を保存してください

Google Analyticsの設定と確認

イベントトラッキングのデータを確認する

shoppro_ga_20
上記の設定ができると Google Analyticsのレポート画面
「コンテンツ > イベントのトラッキング」からデータを確認できます

shoppro_ga_23

「コンテンツ > イベントのトラッキング > ラベル」では
商品名と金額を確認することが出来ます

さらに細かく分析したい方へ イベントコンバージョン設定の紹介

shoppro_ga_37
「カートに入れる」ボタンを押すまでのユーザーの動きなども分析したいときは
イベントトラッキングをコンバージョン設定する必要があります

※以前はイベントトラッキングをコンバージョン設定することは出来ませんでしたが Google Analyticsの新しい管理画面からイベントのコンバージョン設定が可能になりました

トラッキングコード設置の注意点

複数トップレベルドメイン対応にするといい

  _gaq.push(['_setDomainName', 'none']);
  _gaq.push(['_setAllowLinker', true]);

トラッキングコードに上記の記述がないと Google Analyticsのレポートで
「コンバージョン > 目標への遷移」や「コンバージョン > 目標達成プロセス」のデータが計測できないので注意が必要です

Google Analyticsのイベントコンバージョンの設定

step1 目標設定画面を表示する

shoppro_ga_38

Google Analyticsの新しい管理画面から操作します
画面右の「歯車のアイコン」をクリックします

shoppro_ga_14

目標タブから「+目標」をクリックします

step2 目標を設定する

shoppro_ga_15

目標の設定画面が表示されたら

  • 目標名
  • 目標タイプ
  • カテゴリ
  • アクション
  • 目標値

などを設定し 「保存」をクリックします

イベントをコンバージョン(目標)設定するには 新しい管理画面からしか設定できません
shoppro_ga_21
以前の管理画面には「イベント」の項目が表示されていないことがわかります
shoppro_ga_19また 新しい管理画面でコンバージョン設定した後でも 以前の管理画面からは編集することはできないようです

Google Analyticsのイベントコンバージョンのデータを確認

以前の管理画面で確認する

shoppro_ga_24

「コンバージョン > サマリー」では
コンバージョン率や合計目標値が表示されます

shoppro_ga_40

「コンバージョン > 目標値」では

  • 時間
  • 日
  • 週
  • 月

単位で目標値(ここでは商品の金額)が確認できます

新しい管理画面で確認する

shoppro_ga_39

「サイト分析 > 分析レポート > コンバージョン > 目標サマリー」では
合計目標値やコンバージョン率が確認できます

shoppro_ga_41

「サイト分析 > 分析レポート > コンバージョン > 目標への遷移」では
「カートに入れる」をクリックしたページURLと
その前のユーザーのページ遷移が3ステップまで確認できます