homepage: google.com/analytics/tag-manager
docs: developers.google.com/tag-manager/devguide
import: import { Angulartics2GoogleTagManager } from 'angulartics2';
Add the full tracking code from Google Tag Manager to the beginning of your body tag.
Bootstrapping the application with Angulartics2
as provider and injecting both Angulartics2
and Angulartics2GoogleTagManager
(or any provider) into the root component will hook into the router and send every route change to your analytics provider.
// component
import { Angulartics2GoogleTagManager } from 'angulartics2';
@Component({ ... })
export class AppComponent {
// import Angulartics2GoogleTagManager in root component
constructor(angulartics2GoogleTagManager: Angulartics2GoogleTagManager) {
angulartics2GoogleTagManager.startTracking();
}
}
// bootstrap
import { Angulartics2Module } from 'angulartics2';
@NgModule({
imports: [
...
// import Angulartics2GoogleTagManager in root ngModule
Angulartics2Module.forRoot()
],
})
Now is the time to setup tracking for the tags in GTM. Here is a great post on how to actually perform this setup. In essence here is the TLDR:
- Create a new tag
- Add Universal Analytics + Tracking ID from GA
- Create a new "Fire On" trigger (Custom Event) that tracks the
Page View
(forpageTrack()
)
Make sure to debug it :D