Nuxt.jsのGoogle Analyticsモジュールを使ってEventのトラッキングをする
ここ最近、Netlify + Nuxt.jsの組み合わせでサイトやフォームを作っています。
サイトを訪れたユーザのアクションを計測したいのですが、Nuxt.jsのGoogle Analyticsモジュールを使うとかなり簡単にできるます。以下その忘備録です。
nuxt.config.js
modules: [ '@nuxtjs/axios', '@nuxtjs/bulma', ['@nuxtjs/google-analytics', {id: 'UA-YOUR_GA_TRACKING_ID'} ] ],
任意のコンポーネントからは this.$ga
でアクセスできます。
this.$ga.event('Videos', 'play', 'Fall Campaign', 1)
例えばあるボタンを押した
というユーザのアクションをGoogle Analytics側でイベントとして計測したい場合、@clickで呼ばれるfunction内にthis.$gaを記述してあげるといいはずです。
GA側ではこんな風に表示されます。
Nuxt.jsビギナーズガイド―Vue.js ベースのフレームワークによるシングルページアプリケーション開発
- 作者: 花谷拓磨
- 出版社/メーカー: シーアンドアール研究所
- 発売日: 2018/10/17
- メディア: 単行本(ソフトカバー)
- この商品を含むブログを見る
- 作者: 掌田津耶乃
- 出版社/メーカー: 秀和システム
- 発売日: 2019/02/05
- メディア: 単行本
- この商品を含むブログを見る
「やりたいこと」からパッと引ける Google アナリティクス 分析・改善のすべてがわかる本
- 作者: 小川卓
- 出版社/メーカー: ソーテック社
- 発売日: 2017/08/10
- メディア: 単行本
- この商品を含むブログを見る