GoogleAnalyticsのPV数を元にアクセスランキングを実装する方法

本チュートリアルでは、指定したコンテンツ定義の詳細ページのPV数を元に、過去1週間以内のアクセスランキングを表示する方法を説明します。

GoogleAnalytics(以下、GA)のPV数を元にアクセスランキングを作成するには以下の処理を実装する必要があります。

1. Kuroco管理画面からGAと連携する
2. カスタムディメンションを設定する
3. フロント側でGAの計測タグを埋め込む
4. コンテンツ定義にPV数を設定するための拡張項目を設定する
5. 取得したPV数をコンテンツのデータに設定する
6. アクセスランキング取得用にPV数の降順で10件取得する一覧APIを作成する

Kuroco管理画面からGAと連携する

GAとの連携はGoogle Analytics連携方法のページを参考に行って下さい。

カスタムディメンションを設定する

下記、いずれかのようにカスタムディメンションを設定してください。
閲覧されたコンテンツを特定するのに利用しますので送信する値はコンテンツID、もしくはslugとなります（どちらか一方で問題ありませんのでどちらを使用するかはフロントの構成に合わせて決めて下さい）。

slugを利用する場合のサンプル
ディメンション名は任意のわかりやすい名前を設定して下さい。

フロント側でGAの計測タグを埋め込む

フロント側の設定はGoogle Analytics連携方法のフロントエンドでgoogle-analyticsの設定をするの項目を参考に行って下さい。

このチュートリアルでは、ランキング取得したい詳細ページのPV数のみ取得するので、page_viewイベントの送信をmountedに埋め込む形で実装します。

if (process.browser) {
    const slug = this.$route.params.asset_name // ページのURLなどからslugを取得(実際の構成に合わせて変更して下さい)
    this.$gtag('event', 'page_view', {
        'detail_page_slug': slug
    })
}

この段階でフロントの表示を確認し、正しくpage_viewイベントの送信が行われていればGAコンソール上でカスタムディメンションを指定することで、下記のようにPV数が確認出来ます。
※データが蓄積されるまで半日程度かかります、すぐに確認したい場合はリアルタイム計測でpage_viewイベントのパラメータを確認することが出来ます

コンテンツ定義にPV数を設定するための拡張項目を設定する

※項目の種別はカウンターを指定する必要があります。
※PV数をコンテンツに設定する際、ここで設定したslugを利用します。

API経由でのPV数取得の確認

https://ga-dev-tools.google/ga4/query-explorer/ を利用することでAPI経由でPV数を取得出来るか確認出来ます。

1. 左上の「Demos & Tools」下のトグルスイッチで GA4 を選択
2. Select property で対象のプロパティを選択
3. dateRanges dimensions metrics limit orderBys をそれぞれ設定する dimensions には「customEvent:[設定したslugカスタムディメンション定義]」を指定する
4. [MAKE REQUEST] でGoogle Analytics Data APIを実行する

取得したPV数をコンテンツのデータに設定する

取得したPV数をコンテンツデータに設定するため、下記のようなSmartyPluginを実行させるバッチ処理を作成します。

{*GAからPV数を取得してカウンターに設定*}
{googleanalytics var=result
update_column_slug="pv"
update_target_dimension="customEvent:detail_page_slug"
updated_topics_ids='updated_topics_ids'
topics_group_id=1}{*topics_group_idは対象のコンテンツ定義IDを指定して下さい*}

{*カウンターデータの内容をコンテンツデータに反映*}
{assign_array var=ext_data values=''}
{assign var=ext_data.topics_ids value=$updated_topics_ids}
{batch module='topics' name='sync_counter' ext_data=$ext_data}

パラメータ詳細

googleanalyticsプラグインでは下記のパラメータが利用出来ます。

パラメータ名	説明
var	取得結果をアサインする変数名
viewId	GoogleAnalyticsのViewID
update_column_slug	アップデートするカラムのSlug
update_column_index	繰り返しカラムの場合、何番目をアップデートするか指定
update_target_metric	利用するメトリック（デフォルト：ga:pageviews）
update_target_dimension	利用するディメンション（デフォルト：ga:pagePath）
topics_group_id	コンテンツ定義ID
startDate	集計開始日（デフォルト：7日前）
endDate	集計終了日（デフォルト：今日）
queries	クエリの直接指定

アクセスランキング取得用にPV数の降順で10件取得する一覧APIを作成する

PV数の降順で10件取得する為のAPI設定は下記となります。

項目	内容
カテゴリー	コンテンツ
モデル	Topics
オペレーション	list
パラメータ	topics_group_id: (対象のコンテンツ定義ID) cnt: 10 order_query: pv:desc