アクセス解析（Google Analytics）の設定、確認 | マニュアル一覧 | CMSなら「ant2-ASP」でホームページ制作！

Manual

CMS操作マニュアル

CMSの操作方法を作業から探せるようにマニュアル一覧にしました。
「こんな時はどうするの？」と迷った場合は、こちらをご覧ください。

アクセス解析（Google Analytics）の設定、確認

Google Analyticsと連携して、サイトのアクセス状況を確認することができます。
Google Analyticsの機能を使用する場合は、Googleのアカウントを取得し、さらにGoogle Analyticsにアクセスしてプロファイルを作成して、トラッキングコードを取得する必要があります。

Googleアカウントの取得やAnalyticsの設定についてはGoogleの公式サイトをご確認ください。

⇒ Google Analyticsのホームページはこちら（外部リンク）

Google Analytics連携を設定する

1
下記の「OAuth クライアントIDの作成」の手順を参照して、OAuth クライアントIDを作成します。

2
コントロールパネルの[設定] → [SEO対策] → [アクセス解析の設定]をクリックすると、“Google Analyticsダイアログ”が表示されます。

3
【認証】タブをクリックし、OAuth クライアントIDの作成で控えておいた「クライアントID」と「クライアント シークレット」を、ダイアログの《クライアントID》と《クライアント シークレット》に入力して[保存]ボタンをクリックします。

OAuth クライアントID

OAuth クライアントIDを設定します。

  • 未設定の場合・・・入力ボックスに「OAuth クライアントIDの作成」で控えておいた「クライアントID」を入力します。
  • 設定済みの場合・・・クライアントIDと[削除]リンクが表示されます。《クライアント シークレット》は非表示となり、《Googleアカウント》が表示されます。別のクライアントIDに変更する場合は、[削除]リンクをクリックして再設定します。
  • OAuth クライアントIDの作成方法は、下記の「OAuth クライアントIDの作成」を参照してください。
  • OAuth クライアントIDの作成に必要な「承認済みドメイン」「承認済みのリダイレクト URI」の設定情報は、OAuth クライアントIDが未設定の場合に表示される、ダイアログ内の『OAuth クライアントID 設定情報』をご確認ください。
クライアント シークレット

「OAuth クライアントIDの作成」で控えておいた「クライアント シークレット」を入力します。

  • 《OAuth クライアントID》が未設定の場合に表示されます。設定済みの場合は表示されません。
Googleアカウント

Googleアカウントを認証します。

  • 未認証の場合・・・[認証]リンクをクリックし、Google Analyticsで有効なGoogleアカウントを選択して「Googleアナリティクスアクセスデータの表示」などのアクセスを許可します。
  • 認証済みの場合・・・「認証済み」と表示されます。[削除]リンクをクリックすると、認証済みのGoogleアカウントが削除され、未認証の状態になります。
  • 《OAuth クライアントID》が設定済みの場合に表示されます。未設定の場合は表示されません。

4
次に、《Googleアカウント》の[認証]リンクをクリックし、Google Analyticsを利用しているGoogleアカウントでログインして、許可します。

  • httpからはじまるURLでアクセスしている場合は、Googleアカウントの認証を行うことができません。httpsからはじまるURLでアクセス後、“Google Analyticsダイアログ”よりGoogleアカウントの認証を行ってください。
  • 《Googleアカウント》に「認証済み」と表示されている場合は、認証済みです。別のGoogleアカウントで認証をする場合は削除して再度認証してください。
Googleアカウント認証の流れ
  1. [認証]リンクをクリックします。
  2. Googleアカウントの「ログイン」画面またはGoogleの「アカウントの選択」画面が表示されます。
    「ログイン」画面が表示された場合は、サイトで使用するGoogle Analyticsを利用しているGoogleアカウントにてログインします。「アカウントの選択」画面が表示された場合は、Google Analyticsを利用しているGoogleアカウントを選択します。
    ※「Googleアナリティクスデータの表示」の権限の付与のメッセージが表示される場合は、[許可]をクリックします。
  3. 「このアプリは確認されていません」と警告メッセージが表示されます。左下の[詳細]をクリックし、さらに[承認済みドメイン＋（安全ではないページ）に移動]をクリックします。
    ※承認済みドメインは、OAuth クライアントIDの作成で設定した「承認済みドメイン」です。
  4. 「選択内容を確認してください」画面に表示されている許可内容を確認します。「Googleアナリティクスデータの表示」にチェックが入っていない場合はチェックを入れてください。最後に、[許可]ボタンをクリックして認証を行います。
Googleアカウントの認証エラー
  • クライアントIDが間違っている場合
    《OAuth クライアントID》に設定されているクライアントIDが間違っている場合は、Googleアカウントの認証の際に、Googleで「承認エラー（エラー401）」となって認証を行うことができません。《OAuth クライアントID》を削除し、クライアントIDの値に間違いがないように再度設定してください。
  • クライアント シークレットが間違っている場合
    《OAuth クライアントID》に設定されているクライアント シークレットが間違っている場合は、Googleアカウントの認証の際に、エラーは表示されませんが、《Googleアカウント》が未認証のまま認証することができない状態となります。このような現象のときは、《OAuth クライアントID》を削除し、クライアント シークレットの値に間違いがないように再度設定してください。
  • クライアントIDに設定した承認済みのリダイレクトURIが間違っている場合
    クライアントIDに設定した承認済みのリダイレクトURIが間違っている場合は、Googleアカウントの認証の際に、Googleで「承認エラー（エラー400）」となって認証を行うことができません。
    Google Cloud Platform（https://console.cloud.google.com/apis/）にアクセスし、クライアントIDの承認済みのリダイレクトURIを修正してください。
    ※設定する承認済みのリダイレクトURIは、【認証】タブの《OAuth クライアントID》を削除し、ダイアログに表示される『OAuth クライアントID 設定情報』をご確認ください。
  • 公開ステータスが本番環境になっていない場合
    Google Cloud Platformのプロジェクトの「OAuth同意画面」の公開ステータスが「テスト」となっている場合は、Googleアカウントの認証の際に、Googleで「承認エラー（エラー403）」となって認証を行うことができません。
    Google Cloud Platform（https://console.cloud.google.com/apis/）にアクセスし、OAuth同意画面の公開ステータスを「本番環境」となるよう切り替えてください。

5
《Googleアカウント》が認証済みになっていること確認します。

6
次に、【全般設定】タブをクリックし、《ビューIDまたはビュー名》を入力します。

Google Analytics連携を認証

Google Analyticsの連携のための設定（OAuth クライアントIDの設定、Googleアカウントの認証）が認証済みかどうか表示されます。

  • 未認証の場合・・・「認証タブより認証を行ってください。」と表示されます。上記の手順1～5の手順に沿って設定を行ってください。
  • 認証済みの場合・・・「認証済み」と表示されます。
ビューIDまたはビュー名

Google Analyticsの[管理]に設定した「ユニバーサル アナリティクス プロパティ」のビュー名またはビューIDを入力してください。ビュー名に漢字を使用している場合、うまく接続ができない場合があるため、その場合は漢字の使用は避けるかビューIDを入力してください。

ビューが表示されない場合

Google Analyticsの[管理]の[アカウント]内のプロパティが「Googleアナリティクス4プロパティ」の場合はビューは表示されないため、旧タイプの「ユニバーサル アナリティクス プロパティ」のプロパティを作成する必要があります。新規プロパティの作成時に「詳細オプションを表示」を押して、「ユニバーサル アナリティクス プロパティの作成」をオンに変更後、ユニバーサル アナリティクス プロパティを作成してください。
[接続テスト]ボタン クリックすると、アカウントやパスワード、ビュー名に間違いがないかを確認します。「正しく接続できました。」とメッセージが表示されれば[OK]ボタンを押してください。

6
下記の「Google Analytics連携の接続をテストする」の手順で接続テストを行い、「正しく接続できました。」とメッセージが表示されれば[OK]ボタンを押して完了です。

Google Analytics連携の接続をテストする

1
コントロールパネルの[設定] → [SEO対策] → [アクセス解析の設定]をクリックすると、“Google Analyticsダイアログ”が表示されます。

2
【全般設定】タブをクリックし、《Google Analytics連携を認証》に「認証済み」と表示され、《ビューIDまたはビュー名》が入力されていることを確認し、[接続テスト]ボタンをクリックします。

3
「正しく接続できました。」とメッセージが表示されれば[OK]ボタンを押して完了です。

設定がエラーになる、アクセス情報が取得できない場合

正しく接続できました。 Google Analyticsに正常に接続されています。
ビューIDまたはビュー名が違います。

ビューIDまたはビュー名が間違っています。
Google Analyticsで設定したビュー名もしくはビューIDを入力してください。
Google Analytics連携の認証を行ってください。 《OAuth クライアントID》が未設定、もしくは《Googleアカウント》が未認証です。
【認証】タブより設定を確認してください。
Google Analytics APIが無効です。 Google Analytics APIが無効です。
Google Cloud Platform（https://console.cloud.google.com/apis/）にアクセスし、プロジェクトの『Google Analytics API』を有効に設定してください。
Google Analytics Reporting APIが無効です。 Google Analytics Reporting APIが無効です。
Google Cloud Platform（https://console.cloud.google.com/apis/）にアクセスし、プロジェクトの『Google Analytics Reporting API』を有効に設定してください。
Googleアカウントの認証に失敗しました。

Googleアカウントが拒否されている可能性があります。
【認証】タブの《Googleアカウント》を削除して、再度認証を行ってください。その際には、Google Analyticsで有効になっていないGoogleアカウントで認証を行っていないか、必要な権限を許可しているかなど、「Google Analytics連携を設定する」の手順4の「Googleアカウントの認証の流れ」を再度確認しながら認証してください。

再度認証を行っても改善しない場合は、Googleのセキュリティ強化により接続が拒否されている可能性もありますので、下記をご確認ください。

⇒ Googleのセキュリティ設定について
その他のエラーがあります。運営元へお問い合わせください。

設定済みの《OAuth クライアントID》の情報が間違っている可能性があります。
【認証】タブより、《OAuth クライアントID》を削除し、再度正しい値を設定してください。
※不要な文字やスペースなどが入っていると、エラーとなる場合があります。

《OAuth クライアントID》を再設定しても改善しない場合は、運営元へお問い合わせください。

編集サイトで作成したページにトラッキングコードを設定する

1
コントロールパネルの[設定] → [SEO対策] → [アクセス解析の設定]をクリックすると、“Google Analyticsダイアログ”が表示されます。

2
【全般設定】タブをクリックし、トラッキングコードを入力します。

トラッキングコード

設定したビューのGoogle Anaryticsで配布されているトラッキングコードをそのままコピー＆ペーストしてください。

■トラッキングコード例

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXX-X"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-XXXXXXXX-X');
</script>
その他のトラッキングコード Yahoo!アクセス解析など、Google Analytics以外のトラッキングを使用する場合にご利用ください。トラッキングコードの記述場所（</HEAD>タグの直 前、<BODY>タグ直後、</BODY>タグ直前）に合わせて必要な箇所に入力してください。
※上記Googleアカウントの設定を行わない場合でもこのトラッキングコードは反映されます。

3
[ＯＫ]ボタンをクリックして保存します。

４
サイト公開を行って、公開サイトにトラッキングコードを反映させて完了です。

ご注意ください

《トラッキングコード》にトラッキングコードではないテキストが入っている場合があります。
Google Analyticsで配布されているトラッキングコードにお間違いがないかどうかご確認ください。

アクセス解析を確認する

サイトのアクセス情報についてはGoogle Analyticsのサイトにアクセスしてログインすると、様々なデータが表示されますが、モジュールを使用して連携を行うとCMSのコントロールパネルからもこのGoogleAnalyticsの一部情報を確認することができるようになります。

1
コントロールパネルの[設定] → [SEO対策] → [アクセス解析を確認]をクリックします。

2
“アクセス解析ダイアログ”が表示されます。
各項目のグラフのアイコンをクリックすることにより上部のグラフ表示項目を切り替えることができます。

ページビュー ページビュー数は閲覧された合計ページ数です。同じページが繰り返し表示された場合も集計されます。
このページのページビュー 現在開いているページの閲覧された回数です。
ユーザー数 設定期間内にサイトを訪問したユーザーの数です。重複しているユーザーはカウントされません。
このページのユーザー数 現在開いているページをある期間内に訪問したユーザーの数です。重複しているユーザーはカウントされません。
訪問数 サイトを訪問したユーザーの数です。30分を区切りとしてカウントされるため、重複しているユーザーでも30分以上サイトを離れて再びアクセスした場合は数が追加されます。
直帰率 1 ページのみを閲覧してサイトを離脱した訪問の割合です。
検索キーワードTop20 設定した期間内で検索サイトからサイトを訪れた人の検索キーワード上位20位を表示します。
ページランキングTop20 設定した期間内でサイト内のアクセスされたページから上位20位を表示します。

 Hint

「ページビュー」、「このページのページビュー」、「ユーザー数」、「このページのユーザー数」、「訪問数」のグラフアイコンをクリックすると、上部のグラフ表示に該当項目のグラフを追加／削除を切り替えることができます。
「直帰率」のグラフアイコンをクリックすると、上部のグラフ表示が直帰率のグラフのみ表示されます。

  • 表示単位が異なるため、《直帰率》を他のグラフと同時に表示することはできません。

3
[閉じる]ボタンををクリックして終了です。

OAuth クライアントIDの作成

Google Analyticsと連携したアクセス解析に必要なOAuth 2.0のクライアントIDの認証情報を作成します。

【重要】OAuth クライアントIDの制限について

GoogleのOAuth 2.0の規格（プロトコル）でGoogle APIを使用するアプリケーションでは、OAuth 2.0のクライアントIDを作成するために「OAuth同意画面」の設定を行います。
クライアントIDを制限なく使用する場合は、GoogleによるOAuth同意画面の確認の手続きが必要ですが、本機能では下記の制限内での機能提供となりますのでご注意ください。

OAuth 2.0 のクライアントIDの制限
  • 対象クライアントIDを使用したアプリケーションを利用するGoogleアカウントは100アカウントまで
  • 対象クライアントIDを使用したアプリケーションの1日の表示上限は10,000回まで
  • Googleアカウントのアプリケーション認証の際に「このアプリは確認されていません」と警告メッセージを表示
  • 1つのクライアントIDを複数のサイトでご利用いただく場合は、Google側の制限がありますので、ご注意ください。

1
コントロールパネルの[設定] → [SEO対策] → [アクセス解析の設定]を選択します。

2
“Google Analyticsダイアログ”が表示されますので、表示されているGoogle Cloud PlatformのAPIダッシュボードのURL（https://console.cloud.google.com/apis/）にアクセスし、OAuth クライアントIDを作成するGoogleアカウントでログインします。

 Hint

Google Cloud PlatformにログインするGoogleアカウントは、OAuth クライアントIDを作成・管理するアカウントになります。Google Analyticsを利用するGoogleアカウントとは別のGoogleアカウントで管理することも可能です。
その際は、前述の「【重要】OAuth クライアントIDの制限について」に記載の制限内容にご注意の上、ご利用ください。

3
Google Cloud PlatformのAPIダッシュボードが表示されますので、[プロジェクトの選択]をクリックします。

4
プロジェクトの選択画面の[新しいプロジェクト]をクリックします。

  • 作成済みの既存のプロジェクトで管理する場合は、既存のプロジェクトを選択し、手順6へ進みます。

5
任意のプロジェクト名を入力し、[作成]をクリックします。

6
作成したプロジェクトを選択し、サイドナビゲーションの[APIとサービス] → [ダッシュボード]を選択します。ダッシュボード画面が表示されたら[+APIとサービスの有効化]をクリックします。

7
APIライブラリ画面より、下記の「有効にするAPI」について、有効にする設定を行います。
検索フォームに「Google Analytics」を入力し、『Google Analytics API』をクリック後、次のページで[有効にする]をクリックします。

有効にするAPI
  • Google Analytics API
  • Google Analytics Reporting API
検索結果より「Google Analytics API」選択後

8
続いて、サイドナビゲーションから[APIとサービス] → [ライブラリ]を選択し、再度APIライブラリ画面を表示します。検索フォームに「Google Analytics」を入力し、『Google Analytics Reporting API』をクリック後、次のページで[有効にする]をクリックします。

9
サイドナビゲーションから[APIとサービス] → [認証情報]を選択します。認証情報画面が表示されたら[＋認証情報を作成]をクリックし、プルダウンメニューから「OAuth クライアントID」を選択します。

10
OAuth クライアントIDの作成画面で下記の同意画面に関する内容と[同意画面を設定]が表示されている場合は、[同意画面を設定]をクリックし、下記の「OAuth同意画面の設定」を行います。表示がない場合は、手順11に進みます。

OAuth同意画面の設定

  1. OAuth同意画面で《User Type》の「外部」を選択し、[作成]をクリックします。
  2. 「OAuth 同意画面」の下記の項目を入力し、[保存して次へ]をクリックします。
    3. アプリ名 任意のアプリケーション名を入力します。
    ※同意画面に表示されます。
    ユーザーサポートメール メールアドレスを選択します。
    ※ユーザーの同意に関して問い合わせるために使用されます。
    アプリのロゴ （設定不要）
    アプリケーションのホームページ （設定不要）
    [アプリケーション プライバシーポリシー]リンク （設定不要）
    [アプリケーション利用規約]リンク （設定不要）
    承認済みドメイン

    [＋ドメインの追加]をクリックし、“Google Analytics ダイアログ”にある『OAuth クライアントID 設定情報』の「承認済みドメイン」の内容を入力します。
    デベロッパーの連絡先情報

    メールアドレスを入力します。
    ※プロジェクトの変更について Googleからのお知らせに使用されます。
  3. 「スコープ」画面の内容を確認し、[保存して次へ]をクリックします。
    ※スコープの設定は必要ありません。
  4. 「テストユーザー」画面の内容を確認し、[保存して次へ]をクリックします。
    ※テストユーザーの設定は必要ありません。
    （OAuth同意画面の公開ステータスが「テスト」の間はテストユーザーが必要ですが、この後の手順で公開ステータスを「本番環境」に変更するため設定は必要ありません。）
  5. OAuth同意画面の「概要」が表示されます。[ダッシュボードに戻る]をクリックします。
  6. OAuth同意画面のダッシュボードで「公開ステータス」の[アプリを公開]をクリックし「テスト」から「本番環境」に切り替わったら設定は完了です。
    【テスト中】

    【本番環境へ変更後】

    ・本番環境:アプリのステータスを「本番環境」に設定すると、Google アカウントを持つすべてのユーザーがアプリを利用できるようになります。OAuth 画面の構成方法に応じて、検証を受けるためにアプリの送信が求められることがあります。
    ・テスト:アプリがまだテスト中やビルド中である場合は、ステータスを「テスト」に設定できます。この状態では、アプリをテストできますが、ユーザー数に上限があります。
  7. 手順9と同様にサイドナビゲーションから[APIとサービス] → [認証情報]を選択し、認証情報画面が表示されたら[＋認証情報を作成]をクリックし、プルダウンメニューから「OAuth クライアントID」を選択します。
  8. 次の手順11に進みます。

11
OAuth クライアント ID の作成画面で「ウェブアプリケーション」を選択後、下記の項目を選択・入力し、[作成]をクリックします。

↓

アプリケーションの種類 “ウェブアプリケーション”を選択します。
名前 OAuth クライアントID の任意の名前を入力します。
※アプリケーション名ではありません。
承認済みのリダイレクト URI

[＋URIを追加]をクリックし、“Google Analytics ダイアログ”にある『OAuth クライアントID 設定情報』の「承認済みのリダイレクト URI」の内容を入力します。
  • 制限事項の設定は必要ありません。

12
「OAuthクライアントを作成しました」と表示されます。

13
サイドナビゲーションから[APIとサービス] → [認証情報]を選択します。認証情報画面が表示されたら[OAuth 2.0 クライアントID]から作成したクライアントIDの名前、もしくは鉛筆マーク（編集）をクリックします。

14
ウェブアプリケーションのクライアントID画面の「クライアント ID」「クライアント シークレット」の値を控えます。

15
OAuth クライアントIDの作成は完了です。

Copyright (C) ant2.net All Rights Reserved.