@gdlc/angular-gtm-universal-analytics
v0.0.3
Published
A collection of services, and directives to easily integrate universal analytics features such as: Virtual page views, Custom Events, and Ecommerce Events
Downloads
1
Readme
imports: [
...
GtmUniversalAnalyticsModule.forRoot({
id: YOUR_GTM_ID,
}),
],
constructor(
...
private gtmUaVirtualPageViewsService: GtmUaVirtualPageViewsService,
) {
this.gtmUaVirtualPageViewsService.sendVirtualPageViews();
};
interface GtmUaCustomEvent {
category: string;
action: string;
label?: string;
value?: number;
nonInteraction?: boolean;
}
<a (click)="redirectToFacebookPage()">Facebook</a>
public redirectToFacebookPage(): void {
const gtmCustomEvent = {
category: 'social media',
action: 'click',
label: 'facebook icon',
value: 100,
nonInteraction: false
};
this.gtmUaCustomEventsService.sendCustomEvent(gtmCustomEvent);
location.href = 'https://facebook.com/xyz-company';
};
interface UaEcommerceProduct {
name: string;
id: string;
price?: string;
brand?: string;
category?: string;
variant?: string;
list?: string;
position?: number;
quantity?: number;
coupon?: string;
}
const ecommerceProducts: UaEcommerceProduct = [
{
name: 'Triblend Android T-Shirt',
id: '12345',
price: '15.25',
brand: 'Google',
category: 'Apparel',
variant: 'Gray',
list: 'Search Results',
position: 1,
},
{
name: 'Donut Friday Scented T-Shirt',
id: '67890',
price: '33.75',
brand: 'Google',
category: 'Apparel',
variant: 'Black',
list: 'Search Results',
position: 2,
},
];
const currencyCode = 'EUR';
this.gtmUaEcommerceEventsService.sendProductImpressionsEvent(
ecommerceProducts,
currencyCode,
);
interface UaEcommerceProduct {
name: string;
id: string;
price?: string;
brand?: string;
category?: string;
variant?: string;
list?: string;
position?: number;
quantity?: number;
coupon?: string;
}
const ecommerceProducts: UaEcommerceProduct = [
{
name: 'Triblend Android T-Shirt',
id: '12345',
price: '15.25',
brand: 'Google',
category: 'Apparel',
variant: 'Gray',
list: 'Search Results',
position: 1,
},
{
name: 'Donut Friday Scented T-Shirt',
id: '67890',
price: '33.75',
brand: 'Google',
category: 'Apparel',
variant: 'Black',
list: 'Search Results',
position: 2,
},
];
const searchList = 'T-shirts clearance';
this.gtmUaEcommerceEventsService.sendProductClickEvent(
ecommerceProducts,
searchList,
);
interface UaEcommerceProduct {
name: string;
id: string;
price?: string;
brand?: string;
category?: string;
variant?: string;
list?: string;
position?: number;
quantity?: number;
coupon?: string;
}
const ecommerceProducts: UaEcommerceProduct = [
{
name: 'Triblend Android T-Shirt',
id: '12345',
price: '15.25',
brand: 'Google',
category: 'Apparel',
variant: 'Gray',
list: 'Search Results',
position: 1,
},
{
name: 'Donut Friday Scented T-Shirt',
id: '67890',
price: '33.75',
brand: 'Google',
category: 'Apparel',
variant: 'Black',
list: 'Search Results',
position: 2,
},
];
const searchList = 'T-shirts clearance';
this.gtmUaEcommerceEventsService.sendViewProductDetailsEvent(
ecommerceProducts,
searchList,
);
interface UaEcommerceProduct {
name: string;
id: string;
price?: string;
brand?: string;
category?: string;
variant?: string;
list?: string;
position?: number;
quantity?: number;
coupon?: string;
}
const ecommerceProduct: UaEcommerceProduct = [
{
name: 'Triblend Android T-Shirt',
id: '12345',
price: '15.25',
brand: 'Google',
category: 'Apparel',
variant: 'Gray',
list: 'Search Results',
position: 4,
},
];
const currencyCode = 'EUR';
this.gtmUaEcommerceEventsService.sendAddToCartEvent(
ecommerceProducts,
currencyCode,
);
interface UaEcommerceProduct {
name: string;
id: string;
price?: string;
brand?: string;
category?: string;
variant?: string;
list?: string;
position?: number;
quantity?: number;
coupon?: string;
}
const ecommerceProduct: UaEcommerceProduct = [
{
name: 'Triblend Android T-Shirt',
id: '12345',
price: '15.25',
brand: 'Google',
category: 'Apparel',
variant: 'Gray',
list: 'Search Results',
position: 4,
},
];
this.gtmUaEcommerceEventsService.sendRemoveProductFromCartEvent(
ecommerceProducts,
);
interface UaEcommercePromotion {
id: string;
name: string;
creative?: string;
position?: string;
}
const ecommercePromotions = [
{
id: 'JUNE_PROMO13',
name: 'June Sale',
creative: 'banner1',
position: 'slot1',
},
{
id: 'FREE_SHIP13',
name: 'Free Shipping Promo',
creative: 'skyscraper1',
position: 'slot2',
},
];
this.gtmUaEcommerceEventsService.sendPromotionImpressionsEvent(
ecommercePromotions,
);