CODEWITHSUNDEEP
vue.jsgoogle-analytics
Pasha Aksyonenko
Pasha Aksyonenko

Reputation: 86

How can I track google analytics campaign using Vue.js

I am using vue, vue-analytics

trying to track google analytics campaign with parameters from the url in the component:

export default {
  components: {
    Onboarding,
    Content,
  },
  name: 'Main',
  mounted() {
    this.$ga.page({
      page: '/?utm_source=linkedin&utm_medium=personal_message&utm_campaign=innerworks_linkedin_002',
      title: 'Main page',
    });
  },
};

But I can's see any updates in the campaign tab. Do I use ga tracking in the correct way to track the campaign using UTM parameters?

enter image description here

Upvotes: 1

Views: 3786

Answers (1)

Roland
Roland

Reputation: 27729

I don't know about vue-analytics but I am using vue-gtag.

If you want to use that here is how I am configuring it:

  • Create a js file. (I create it in src/plugins/google-analytics.js)
import Vue from 'vue'
import VueGtag from 'vue-gtag'

if (['staging', 'production'].includes(process.env.VUE_APP_MODE)) {
  Vue.use(VueGtag, {
    config: {
      id: process.env.VUE_GOOGLE_ANALYTICS_KEY,
      params: { anonymize_ip: true }
    }
  })
}

And then I import it in main.js

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import '@/plugins/google-analytics' // <= HERE

Make sure to take a look to vue-gtag docs.

Take a look at Auto tracking to allow the plugin to track all your pages automatically.

Upvotes: 3

Related Questions