スプレッドシートでアナリティクスの簡単レポートを作ってみよう!

powered by hm solution

お問い合わせ:0120-290-727
受付時間:10:00~18:00(土日祝は除く)

お問い合わせ

スプレッドシートでアナリティクスの簡単レポートを作ってみよう!

Spreadsheet
もうだいぶん寒くなってきましたね。寒いの苦手やわ〜
どもども、今回もひつこくGoogle アナリティクス + Google スプレッドシートについてです。
なんだか楽しくなってまいりました。

以前えいやんが【Googleアナリティクス】実はとっても便利!カスタムレポート機能の使い方で表示させてた項目をスプレッドシートに読み込めるんじゃねかな?と思ったので。
まったく必要はないんですが作ってみました。

アナリティクスをスプレッドシートに読み込む準備は前前回の記事を参考にしてみてください。

表示するデータは「直帰率」「訪問数」「ページビュー数」「訪問時の平均滞在時間」「ユーザー数」「目標の完了数」の過去一月分。
グラフ化までやっちゃいます。
それでは、はりきっていってみよう!

すること

  • スプレッドシートをちょっとだけ色付け
  • サンプルコードコピペ
  • サンプルコード実行
  • スプレッドシートへ表示された情報を見やすく変更
  • スプレッドシートでグラフを作成

スプレッドシートをちょっとだけ色付け

スプレッドシート

まずですね、見栄えを少し整えておきます。
スプレッドシートの2行目と35行目のA〜Gの列の背景色を黒へ、文字色を白にしときます。
ここはお好みで適当にカラー設定していただいて問題ないです。
それから2行目の左から表示するデータのタイトル「日付」「直帰率」「訪問数」「ページビュー数」「訪問時の平均滞在時間」「ユーザー数」「目標の完了数」を入力しておきます。

サンプルコードコピペ

function runDemo() {
  var profileId = ********;           //ビューID
  var tableId = 'ga:' + profileId;
  var startDate = getLastNdays(31);   //ひと月前から
  var endDate = getLastNdays(1);      //当日は含まず

  var optArgs = {
    'dimensions': 'ga:date'
    /*
      ディメンション
      ga:date  //日付
    */
  };
  
  var results = Analytics.Data.Ga.get(
    tableId,                  // Table id (format ga:xxxxxx).
    startDate,                // Start-date (format yyyy-MM-dd).
    endDate,                  // End-date (format yyyy-MM-dd).
    'ga:visitBounceRate, ga:visits, ga:pageviews,ga:avgTimeOnSite,ga:visitors, ga:goalCompletionsAll',
    /*
      メトリクス
      ga:visitBounceRate    //直帰率
      ga:visitors           //訪問数
      ga:pageviews          //ページビュー数
      ga:avgTimeOnSite      //訪問時の平均滞在時間
      ga:visitors           //ユーザー数
      ga:goalCompletionsAll //目標の完了数
    */
    optArgs);
  
  outputToSpreadsheet(results);
}

function getLastNdays(nDaysAgo) {
  var today = new Date();
  var before = new Date();
  before.setDate(today.getDate() - nDaysAgo);
  return Utilities.formatDate(before, 'GMT', 'yyyy-MM-dd');
}

function outputToSpreadsheet(results) {
  var sheet = SpreadsheetApp.getActiveSpreadsheet();//アクティブなスプレッドシートを取得
  sheet = sheet.getActiveSheet();//アクティブなシートを取得
  var headerNames = [];
  for (var i = 0, header; header = results.getColumnHeaders()[i]; ++i) {
    headerNames.push(header.getName());
  }
  Logger.log(headerNames);
  Logger.log(results.getRows().length);
  for (var i = 0; i < results.getRows().length; ++i) {
    results.getRows()[i][0] = getDays(results.getRows()[i][0]);
  }
  sheet.getRange(3, 1, results.getRows().length, headerNames.length)
      .setValues(results.getRows());
}

function getDays(eightDate) {//日付データ加工
    var yyyy;
    var mm;
    var dd;
    yyyy = Math.floor(eightDate/10000);
    mm = Math.floor(eightDate/100) % 100;
    dd = eightDate % 100;
    results = new Date(yyyy, mm - 1, dd);
    return results;
}

上記のスクリプトをスクリプトエディタを表示させてコピペします。
またまた、松葉お手製です。

サンプルコードの修正

var profileId = ********;           //ビューID

「********」の箇所を取得したいAnalyticsのビューIDに変更します。
ビューIDってなんなん?という人は前回の記事を参考にしておくれ。

サンプルコード内にディメンションとメトリクスってありますが、これをどうにかこうにかすると希望したデータが取得できるので工夫してみると良いと思います。
ちゃんとリフェレンスもあるよ!英語やけれど、、、だれか解読お願いします。。。

Dimensions & Metrics Reference – Google Analytics — Google Developers

サンプルコード実行

スプレッドシート

実行すると、データがこんな感じで表示されるんじゃないかと。。。

スプレッドシートへ表示された情報を見やすく変更

このままだと、ちょっと読みにくいので表示設定を変更してきます。

スプレッドシート

日付の項3行目から33行目までを選択して、メニューの 表示形式- >数字- >表示形式の詳細設定- >2008-09-26 日付をクリック。
これで日付が年から始まる形式になります。

スプレッドシート

続きまして、小数点以下が多いとなんのこっちゃわからないので、小数点以下は2位までとします。
直帰率と訪問時の平均滞在時間の項それぞれの3行目から33行目までを選択して、メニューの 表示形式- >数字- >1,000.12 小数点以下2位をクリック。

スプレッドシート

それぞれの合計値とかも表示したいので、各項目の36行目をそれぞれ設定していきます。
合計値を表示させたい各項の36行目を選択して、メニューの中のM左へ回転させたようなボタン(関数)を選択して、SUMをクリック!!
平均値を表示させたい場合は、AVERAGEをクリック!!(えいやんに教わりました。ありがとうえいやん!)

スプレッドシート

そらから該当項の2行目から33行目を選択します。
これで合計値や平均値が表示されます。
平均値を表示させた場合は、小数点以下2位までの表示にしといてください。

スプレッドシート

そうするとこんな感じになるかな。

スプレッドシートでグラフを作成

スプレッドシートのグラフを利用するとさらに分かりやすく、見栄えが良くなるのでやってみよう!

スプレッドシート

こんな感じでグラフ化したい数値のエリアを選択しておきます。

スプレッドシート

メニューの中のグラフのボタン(グラフを挿入…)をクリック。
グラフエディタが表示されるので、利用したいグラフを選択します。

スプレッドシート

こんな感じで表示できたら成功!
グラフの位置や大きさはドラッグで簡単に調整できるので適宜調整してください。

フォーマットを1つ用意しておけば、シートをコピーして流用できるので、定期的に提出する資料なんかにすっごく便利です。

もまいらも色々ためしてみればぁ〜
|Д´)ノ~~ アディオス アミーゴ!

ホームページを新規制作・リニューアルしたい方 弊社が手がけた制作実績 充実の運用サポート 失敗する業者選びの典型例