0
# Tracking and Analytics
1

2
Tracking and analytics provide comprehensive email engagement monitoring including open tracking, click tracking, subscription management, and Google Analytics integration. These features help measure email performance and user engagement.
3

4
## Capabilities
5

6
### Click Tracking
7

8
Monitor when recipients click links in your emails with detailed click analytics.
9

10
```javascript { .api }
11
// Click tracking settings
12
interface ClickTrackingSettings {
13
  enable?: boolean;      // Enable/disable click tracking
14
  enableText?: boolean;  // Enable click tracking in text emails
15
}
16

17
// Usage in tracking settings
18
const msg = {
19
  to: 'recipient@example.com',
20
  from: 'sender@example.com',
21
  subject: 'Email with Click Tracking',
22
  html: '<p>Visit our <a href="https://example.com">website</a>!</p>',
23
  trackingSettings: {
24
    clickTracking: {
25
      enable: true,
26
      enableText: true
27
    }
28
  }
29
};
30
```
31

32
**Usage Examples:**
33

34
```javascript
35
// Basic click tracking
36
const newsletterMsg = {
37
  to: 'subscriber@example.com',
38
  from: 'newsletter@example.com',
39
  subject: 'March Newsletter - Click to Read More',
40
  html: `
41
    <div>
42
      <h1>March Newsletter</h1>
43
      <p>Check out our latest features:</p>
44
      <ul>
45
        <li><a href="https://example.com/feature1">New Dashboard</a></li>
46
        <li><a href="https://example.com/feature2">API Improvements</a></li>
47
        <li><a href="https://example.com/feature3">Mobile App Updates</a></li>
48
      </ul>
49
      <p><a href="https://example.com/unsubscribe">Unsubscribe</a></p>
50
    </div>
51
  `,
52
  text: `
53
    March Newsletter
54
    
55
    Check out our latest features:
56
    - New Dashboard: https://example.com/feature1
57
    - API Improvements: https://example.com/feature2
58
    - Mobile App Updates: https://example.com/feature3
59
    
60
    Unsubscribe: https://example.com/unsubscribe
61
  `,
62
  trackingSettings: {
63
    clickTracking: {
64
      enable: true,
65
      enableText: true  // Track clicks in plain text version too
66
    }
67
  }
68
};
69

70
// Selective click tracking (HTML only)
71
const transactionalMsg = {
72
  to: 'customer@example.com',
73
  from: 'orders@example.com',
74
  subject: 'Order Confirmation #12345',
75
  html: `
76
    <div>
77
      <h2>Order Confirmed</h2>
78
      <p>Your order #12345 has been confirmed.</p>
79
      <p><a href="https://example.com/orders/12345">View Order Details</a></p>
80
      <p><a href="https://example.com/account">Manage Account</a></p>
81
    </div>
82
  `,
83
  trackingSettings: {
84
    clickTracking: {
85
      enable: true,
86
      enableText: false  // Only track HTML clicks for transactional emails
87
    }
88
  }
89
};
90
```
91

92
### Open Tracking
93

94
Track when recipients open your emails using invisible tracking pixels.
95

96
```javascript { .api }
97
// Open tracking settings
98
interface OpenTrackingSettings {
99
  enable?: boolean;           // Enable/disable open tracking
100
  substitutionTag?: string;   // Custom substitution tag for tracking pixel placement
101
}
102

103
// Usage in tracking settings
104
const msg = {
105
  to: 'recipient@example.com',
106
  from: 'sender@example.com',
107
  subject: 'Email with Open Tracking',
108
  html: '<p>This email tracks opens automatically.</p>',
109
  trackingSettings: {
110
    openTracking: {
111
      enable: true,
112
      substitutionTag: '%open-track%'
113
    }
114
  }
115
};
116
```
117

118
**Usage Examples:**
119

120
```javascript
121
// Basic open tracking
122
const welcomeMsg = {
123
  to: 'newuser@example.com',
124
  from: 'welcome@example.com',
125
  subject: 'Welcome to Our Platform!',
126
  html: `
127
    <div>
128
      <h1>Welcome!</h1>
129
      <p>We're excited to have you join our platform.</p>
130
      <p>Get started by exploring these features:</p>
131
      <ul>
132
        <li>Create your first project</li>
133
        <li>Invite team members</li>
134
        <li>Customize your dashboard</li>
135
      </ul>
136
    </div>
137
  `,
138
  trackingSettings: {
139
    openTracking: {
140
      enable: true
141
    }
142
  }
143
};
144

145
// Custom tracking pixel placement
146
const customTrackingMsg = {
147
  to: 'recipient@example.com',
148
  from: 'sender@example.com',
149
  subject: 'Email with Custom Tracking',
150
  html: `
151
    <div>
152
      <h1>Newsletter</h1>
153
      <p>Here's our latest content...</p>
154
      %open-track%
155
      <footer>
156
        <p>© 2024 Example Corp</p>
157
      </footer>
158
    </div>
159
  `,
160
  trackingSettings: {
161
    openTracking: {
162
      enable: true,
163
      substitutionTag: '%open-track%'  // Pixel placed at specified location
164
    }
165
  }
166
};
167

168
// Disable open tracking for sensitive emails
169
const sensitiveMsg = {
170
  to: 'user@example.com',
171
  from: 'security@example.com',
172
  subject: 'Password Reset Request',
173
  html: '<p>Click the link below to reset your password...</p>',
174
  trackingSettings: {
175
    openTracking: {
176
      enable: false  // No open tracking for security emails
177
    }
178
  }
179
};
180
```
181

182
### Subscription Tracking
183

184
Provide automatic unsubscribe functionality with customizable unsubscribe content.
185

186
```javascript { .api }
187
// Subscription tracking settings
188
interface SubscriptionTrackingSettings {
189
  enable?: boolean;           // Enable/disable subscription tracking
190
  text?: string;             // Plain text unsubscribe content
191
  html?: string;             // HTML unsubscribe content
192
  substitutionTag?: string;   // Custom substitution tag for unsubscribe placement
193
}
194

195
// Usage in tracking settings
196
const msg = {
197
  to: 'subscriber@example.com',
198
  from: 'newsletter@example.com',
199
  subject: 'Monthly Newsletter',
200
  text: 'Newsletter content...',
201
  trackingSettings: {
202
    subscriptionTracking: {
203
      enable: true,
204
      text: 'Unsubscribe: https://example.com/unsubscribe',
205
      html: '<p><a href="https://example.com/unsubscribe">Unsubscribe</a></p>'
206
    }
207
  }
208
};
209
```
210

211
**Usage Examples:**
212

213
```javascript
214
// Basic subscription tracking
215
const marketingMsg = {
216
  to: 'customer@example.com',
217
  from: 'marketing@example.com',
218
  subject: 'Special Offers This Week',
219
  html: `
220
    <div>
221
      <h2>This Week's Special Offers</h2>
222
      <div>
223
        <h3>50% Off Premium Plans</h3>
224
        <p>Upgrade now and save big on our premium features.</p>
225
        <a href="https://example.com/upgrade">Upgrade Now</a>
226
      </div>
227
    </div>
228
  `,
229
  text: `
230
    This Week's Special Offers
231
    
232
    50% Off Premium Plans
233
    Upgrade now and save big on our premium features.
234
    Upgrade: https://example.com/upgrade
235
  `,
236
  trackingSettings: {
237
    subscriptionTracking: {
238
      enable: true,
239
      text: 'To unsubscribe from marketing emails: https://example.com/unsubscribe',
240
      html: '<p style="font-size: 12px; color: #666;"><a href="https://example.com/unsubscribe">Unsubscribe</a> from marketing emails</p>'
241
    }
242
  }
243
};
244

245
// Custom unsubscribe placement
246
const customUnsubscribeMsg = {
247
  to: 'subscriber@example.com',
248
  from: 'newsletter@example.com',
249
  subject: 'Weekly Newsletter #47',
250
  html: `
251
    <div>
252
      <header>
253
        <h1>Weekly Newsletter</h1>
254
        <p>Issue #47 - March 15, 2024</p>
255
      </header>
256
      
257
      <main>
258
        <article>
259
          <h2>Feature Article</h2>
260
          <p>This week we're covering...</p>
261
        </article>
262
      </main>
263
      
264
      <footer>
265
        <p>Thanks for reading!</p>
266
        %unsubscribe%
267
        <p>© 2024 Example Corp</p>
268
      </footer>
269
    </div>
270
  `,
271
  trackingSettings: {
272
    subscriptionTracking: {
273
      enable: true,
274
      substitutionTag: '%unsubscribe%',
275
      html: '<p><a href="https://example.com/unsubscribe">Click here to unsubscribe</a></p>'
276
    }
277
  }
278
};
279

280
// Different unsubscribe text for different content types
281
const dualContentMsg = {
282
  to: 'user@example.com',
283
  from: 'updates@example.com',
284
  subject: 'Product Updates',
285
  html: `
286
    <div>
287
      <h2>Latest Product Updates</h2>
288
      <p>Here's what's new in our latest release...</p>
289
    </div>
290
  `,
291
  text: `
292
    Latest Product Updates
293
    
294
    Here's what's new in our latest release...
295
  `,
296
  trackingSettings: {
297
    subscriptionTracking: {
298
      enable: true,
299
      text: 'Unsubscribe: https://example.com/unsubscribe?type=text',
300
      html: '<div style="text-align: center; margin-top: 20px;"><a href="https://example.com/unsubscribe?type=html" style="color: #666; font-size: 12px;">Unsubscribe from these emails</a></div>'
301
    }
302
  }
303
};
304
```
305

306
### Google Analytics Integration
307

308
Integrate email campaigns with Google Analytics for comprehensive tracking across your website.
309

310
```javascript { .api }
311
// Google Analytics tracking settings
312
interface GoogleAnalyticsSettings {
313
  enable?: boolean;      // Enable/disable Google Analytics tracking
314
  utmSource?: string;    // UTM source parameter
315
  utmMedium?: string;    // UTM medium parameter  
316
  utmTerm?: string;      // UTM term parameter
317
  utmContent?: string;   // UTM content parameter
318
  utmCampaign?: string;  // UTM campaign parameter
319
}
320

321
// Usage in tracking settings
322
const msg = {
323
  to: 'recipient@example.com',
324
  from: 'marketing@example.com',
325
  subject: 'Spring Campaign Launch',
326
  html: '<p>Visit our <a href="https://example.com">website</a>!</p>',
327
  trackingSettings: {
328
    ganalytics: {
329
      enable: true,
330
      utmSource: 'sendgrid',
331
      utmMedium: 'email',
332
      utmCampaign: 'spring-2024',
333
      utmContent: 'launch-announcement'
334
    }
335
  }
336
};
337
```
338

339
**Usage Examples:**
340

341
```javascript
342
// Campaign tracking with Google Analytics
343
const campaignMsg = {
344
  to: 'customer@example.com',
345
  from: 'campaigns@example.com',
346
  subject: 'Summer Sale - Up to 70% Off',
347
  html: `
348
    <div>
349
      <h1>Summer Sale is Here!</h1>
350
      <p>Save up to 70% on selected items.</p>
351
      <div>
352
        <a href="https://example.com/sale/clothing">Shop Clothing</a> |
353
        <a href="https://example.com/sale/electronics">Shop Electronics</a> |
354
        <a href="https://example.com/sale/home">Shop Home & Garden</a>
355
      </div>
356
      <p><a href="https://example.com/sale">View All Sale Items</a></p>
357
    </div>
358
  `,
359
  trackingSettings: {
360
    ganalytics: {
361
      enable: true,
362
      utmSource: 'newsletter',
363
      utmMedium: 'email',
364
      utmCampaign: 'summer-sale-2024',
365
      utmContent: 'main-announcement',
366
      utmTerm: 'summer-sale'
367
    }
368
  }
369
};
370

371
// Product-specific tracking
372
const productMsg = {
373
  to: 'subscriber@example.com',
374
  from: 'products@example.com',
375
  subject: 'New Product Launch - Smart Home Hub',
376
  html: `
377
    <div>
378
      <h2>Introducing the Smart Home Hub</h2>
379
      <img src="https://example.com/images/smart-hub.jpg" alt="Smart Home Hub">
380
      <p>Control all your smart devices from one place.</p>
381
      <a href="https://example.com/products/smart-hub">Learn More</a>
382
      <a href="https://example.com/products/smart-hub/buy">Buy Now</a>
383
    </div>
384
  `,
385
  trackingSettings: {
386
    ganalytics: {
387
      enable: true,
388
      utmSource: 'product-launch',
389
      utmMedium: 'email',
390
      utmCampaign: 'smart-hub-launch',
391
      utmContent: 'hero-announcement',
392
      utmTerm: 'smart-home'
393
    }
394
  }
395
};
396

397
// A/B testing with different UTM content
398
const abTestMsgA = {
399
  to: 'group-a@example.com',
400
  from: 'test@example.com',
401
  subject: 'Try Our New Feature - Version A',
402
  html: '<div><h2>New Feature Available</h2><p>Basic description...</p><a href="https://example.com/feature">Try Now</a></div>',
403
  trackingSettings: {
404
    ganalytics: {
405
      enable: true,
406
      utmSource: 'email-test',
407
      utmMedium: 'email',
408
      utmCampaign: 'feature-launch',
409
      utmContent: 'version-a-basic',
410
      utmTerm: 'new-feature'
411
    }
412
  }
413
};
414

415
const abTestMsgB = {
416
  to: 'group-b@example.com',
417
  from: 'test@example.com',
418
  subject: 'Try Our New Feature - Version B',
419
  html: '<div><h2>Revolutionary New Feature!</h2><p>Detailed benefits...</p><a href="https://example.com/feature">Get Started Today</a></div>',
420
  trackingSettings: {
421
    ganalytics: {
422
      enable: true,
423
      utmSource: 'email-test',
424
      utmMedium: 'email',
425
      utmCampaign: 'feature-launch',
426
      utmContent: 'version-b-detailed',
427
      utmTerm: 'new-feature'
428
    }
429
  }
430
};
431
```
432

433
### Complete Tracking Configuration
434

435
Combine all tracking features for comprehensive email analytics.
436

437
```javascript { .api }
438
// Complete tracking settings interface
439
interface TrackingSettings {
440
  clickTracking?: ClickTrackingSettings;
441
  openTracking?: OpenTrackingSettings;
442
  subscriptionTracking?: SubscriptionTrackingSettings;
443
  ganalytics?: GoogleAnalyticsSettings;
444
}
445

446
// Usage with all tracking features enabled
447
const msg = {
448
  to: 'recipient@example.com',
449
  from: 'sender@example.com',
450
  subject: 'Fully Tracked Email',
451
  html: 'Email content with tracking...',
452
  trackingSettings: {
453
    clickTracking: { enable: true, enableText: true },
454
    openTracking: { enable: true },
455
    subscriptionTracking: { enable: true },
456
    ganalytics: { enable: true, utmCampaign: 'campaign-name' }
457
  }
458
};
459
```
460

461
**Usage Examples:**
462

463
```javascript
464
// Complete newsletter with all tracking
465
const comprehensiveNewsletter = {
466
  to: 'subscriber@example.com',
467
  from: 'newsletter@example.com',
468
  subject: 'Monthly Newsletter - March 2024',
469
  html: `
470
    <div>
471
      <header>
472
        <h1>March Newsletter</h1>
473
        <p>Your monthly dose of updates and insights</p>
474
      </header>
475
      
476
      <main>
477
        <section>
478
          <h2>Feature Spotlight</h2>
479
          <p>This month we're highlighting our new dashboard...</p>
480
          <a href="https://example.com/features/dashboard">Explore Dashboard</a>
481
        </section>
482
        
483
        <section>
484
          <h2>Customer Success Story</h2>
485
          <p>See how Company XYZ increased their productivity by 300%...</p>
486
          <a href="https://example.com/case-studies/xyz">Read Full Story</a>
487
        </section>
488
        
489
        <section>
490
          <h2>Upcoming Events</h2>
491
          <ul>
492
            <li><a href="https://example.com/events/webinar1">Product Demo Webinar - March 20</a></li>
493
            <li><a href="https://example.com/events/conference">Annual Conference - April 15</a></li>
494
          </ul>
495
        </section>
496
      </main>
497
      
498
      <footer>
499
        <p>Follow us on social media:</p>
500
        <a href="https://twitter.com/example">Twitter</a> |
501
        <a href="https://linkedin.com/company/example">LinkedIn</a>
502
      </footer>
503
    </div>
504
  `,
505
  text: `
506
    March Newsletter
507
    Your monthly dose of updates and insights
508
    
509
    Feature Spotlight
510
    This month we're highlighting our new dashboard...
511
    Explore Dashboard: https://example.com/features/dashboard
512
    
513
    Customer Success Story  
514
    See how Company XYZ increased their productivity by 300%...
515
    Read Full Story: https://example.com/case-studies/xyz
516
    
517
    Upcoming Events
518
    - Product Demo Webinar - March 20: https://example.com/events/webinar1
519
    - Annual Conference - April 15: https://example.com/events/conference
520
    
521
    Follow us:
522
    Twitter: https://twitter.com/example
523
    LinkedIn: https://linkedin.com/company/example
524
  `,
525
  trackingSettings: {
526
    clickTracking: {
527
      enable: true,
528
      enableText: true
529
    },
530
    openTracking: {
531
      enable: true
532
    },
533
    subscriptionTracking: {
534
      enable: true,
535
      text: 'Unsubscribe from newsletters: https://example.com/unsubscribe',
536
      html: '<p style="text-align: center; font-size: 12px; color: #888;"><a href="https://example.com/unsubscribe">Unsubscribe</a> | <a href="https://example.com/preferences">Update Preferences</a></p>'
537
    },
538
    ganalytics: {
539
      enable: true,
540
      utmSource: 'newsletter',
541
      utmMedium: 'email',
542
      utmCampaign: 'monthly-newsletter',
543
      utmContent: 'march-2024',
544
      utmTerm: 'subscriber'
545
    }
546
  }
547
};
548

549
// Transactional email with selective tracking
550
const orderConfirmation = {
551
  to: 'customer@example.com',
552
  from: 'orders@example.com',
553
  subject: 'Order Confirmation #ORDER-2024-001234',
554
  html: `
555
    <div>
556
      <h2>Order Confirmed!</h2>
557
      <p>Thank you for your order. Here are the details:</p>
558
      
559
      <div>
560
        <h3>Order #ORDER-2024-001234</h3>
561
        <p>Total: $129.99</p>
562
        <p>Estimated delivery: March 18, 2024</p>
563
      </div>
564
      
565
      <p><a href="https://example.com/orders/ORDER-2024-001234">View Order Details</a></p>
566
      <p><a href="https://example.com/account">Manage Account</a></p>
567
    </div>
568
  `,
569
  trackingSettings: {
570
    clickTracking: {
571
      enable: true,
572
      enableText: false  // Only HTML tracking for transactional
573
    },
574
    openTracking: {
575
      enable: true
576
    },
577
    subscriptionTracking: {
578
      enable: false  // No unsubscribe for transactional emails
579
    },
580
    ganalytics: {
581
      enable: true,
582
      utmSource: 'transactional',
583
      utmMedium: 'email',
584
      utmCampaign: 'order-confirmation',
585
      utmContent: 'order-details'
586
    }
587
  }
588
};
589
```
590

591
## Analytics Best Practices
592

593
### Tracking Strategy
594

595
1. **Segment tracking by email type**: Use different UTM parameters for transactional vs. marketing emails
596
2. **Consistent naming conventions**: Establish clear patterns for campaign names and content identifiers
597
3. **A/B test tracking parameters**: Use UTM content to differentiate test variations
598
4. **Privacy considerations**: Be transparent about tracking in your privacy policy
599

600
### Performance Monitoring
601

602
1. **Monitor open rates**: Track engagement trends over time
603
2. **Analyze click patterns**: Identify most popular content and links
604
3. **Conversion tracking**: Connect email clicks to website conversions
605
4. **Unsubscribe analysis**: Monitor subscription health and content performance
606

607
### Compliance and Privacy
608

609
1. **Honor unsubscribe requests**: Process unsubscribes promptly and completely
610
2. **Provide clear opt-out**: Make unsubscribe links easy to find and use
611
3. **GDPR compliance**: Consider tracking implications for EU recipients
612
4. **Data retention**: Define policies for how long to retain tracking data