home / skills / ominou5 / funnel-architect-plugin / analytics-setup

analytics-setup skill

safe

This skill helps you set up analytics and tracking for funnel pages, covering GA4, Meta Pixel, GTM, UTMs, and conversion events.

npx playbooks add skill ominou5/funnel-architect-plugin --skill analytics-setup

Review the files below or copy the command above to add this skill to your agents.

Files (1)

SKILL.md

3.9 KB

---
name: analytics-setup
description: >
  Sets up analytics and tracking for funnel pages. Covers GA4, Meta Pixel,
  Google Tag Manager, conversion tracking, and UTM parameter handling.
---

# Analytics Setup

Track everything. If you can't measure it, you can't improve it.

## GA4 (Google Analytics 4)

### Basic Installation
```html
<!-- Place in <head> of every page -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXXXXX');
</script>
```

### Custom Events for Funnels
```javascript
// Track CTA clicks
document.querySelectorAll('.cta-primary').forEach(btn => {
  btn.addEventListener('click', () => {
    gtag('event', 'cta_click', {
      event_category: 'funnel',
      event_label: btn.textContent.trim(),
      page_title: document.title
    });
  });
});

// Track form submissions
document.querySelectorAll('form').forEach(form => {
  form.addEventListener('submit', () => {
    gtag('event', 'form_submit', {
      event_category: 'funnel',
      event_label: form.getAttribute('name') || 'unnamed',
      page_title: document.title
    });
  });
});

// Track scroll depth
let scrollMarks = [25, 50, 75, 100];
window.addEventListener('scroll', () => {
  const percent = Math.round((window.scrollY / (document.body.scrollHeight - window.innerHeight)) * 100);
  scrollMarks = scrollMarks.filter(mark => {
    if (percent >= mark) {
      gtag('event', 'scroll_depth', { event_category: 'engagement', event_label: mark + '%' });
      return false;
    }
    return true;
  });
});
```

## Meta Pixel (Facebook)

```html
<!-- Place in <head> -->
<script>
  !function(f,b,e,v,n,t,s)
  {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
  n.callMethod.apply(n,arguments):n.queue.push(arguments)};
  if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
  n.queue=[];t=b.createElement(e);t.async=!0;
  t.src=v;s=b.getElementsByTagName(e)[0];
  s.parentNode.insertBefore(t,s)}(window, document,'script',
  'https://connect.facebook.net/en_US/fbevents.js');
  fbq('init', 'YOUR_PIXEL_ID');
  fbq('track', 'PageView');
</script>
```

### Key Events to Track
```javascript
// Lead captured
fbq('track', 'Lead', { content_name: 'Free Guide Opt-In' });

// Registration
fbq('track', 'CompleteRegistration', { content_name: 'Webinar' });

// Purchase
fbq('track', 'Purchase', { value: 297, currency: 'USD' });

// Add to cart
fbq('track', 'AddToCart', { value: 47, currency: 'USD' });
```

## UTM Parameter Handling

### Standard UTM Parameters
```
?utm_source=facebook
&utm_medium=cpc
&utm_campaign=webinar-launch
&utm_content=headline-a
&utm_term=marketing-course
```

### Capture and Store UTMs
```javascript
// Save UTMs to localStorage for attribution
const params = new URLSearchParams(window.location.search);
const utmKeys = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_content', 'utm_term'];
const utms = {};
utmKeys.forEach(key => {
  const val = params.get(key);
  if (val) utms[key] = val;
});
if (Object.keys(utms).length > 0) {
  localStorage.setItem('funnel_utms', JSON.stringify(utms));
}

// Append UTMs to form submission as hidden fields
document.querySelectorAll('form').forEach(form => {
  const stored = JSON.parse(localStorage.getItem('funnel_utms') || '{}');
  Object.entries(stored).forEach(([key, val]) => {
    const input = document.createElement('input');
    input.type = 'hidden';
    input.name = key;
    input.value = val;
    form.appendChild(input);
  });
});
```

## Tracking Checklist
- [ ] GA4 installed on all pages
- [ ] Meta Pixel installed (if running Facebook ads)
- [ ] Custom events for CTA clicks, form submissions, scroll depth
- [ ] UTM parameters captured and stored
- [ ] Conversion goals set up in GA4
- [ ] Form submissions tracked as conversions
- [ ] Thank-you page tracked as destination goal

Overview

This skill sets up analytics and tracking for sales funnel pages, covering GA4, Meta Pixel, Google Tag Manager, conversion tracking, and UTM handling. It provides ready-to-use snippets, event patterns, and a practical checklist to ensure accurate attribution and measurable funnels. Use it to capture CTA clicks, form submissions, scroll depth, purchases, and persistent UTM data across visits.

How this skill works

The skill installs GA4 and Meta Pixel code in the page head and adds custom event handlers for funnel interactions (CTAs, forms, scroll depth). It captures UTM parameters from the URL, stores them in localStorage, and appends them to form submissions as hidden fields for attribution. Standard events and examples for tracking conversions (leads, registrations, purchases) are included so you can map them to goals in analytics and ad platforms.

When to use it

Building or auditing a lead-generation funnel that needs conversion attribution.
Running paid traffic (Facebook, Google) and requiring accurate ROI reporting.
Implementing persistent UTM capture so multi-step forms keep original source data.
Configuring conversion events before launching A/B tests or paid campaigns.
Ensuring consistent tracking across landing pages, thank-you pages, and checkout.

Best practices

Install GA4 and Meta Pixel in the <head> on every page to avoid missing PageView hits.
Use consistent event names and categories (e.g., cta_click, form_submit) for clean reports.
Persist UTM values in localStorage and append them to every form to preserve attribution.
Track a thank-you or confirmation page as a destination goal and mark form submits as conversions.
Test events with GA4 DebugView and Facebook Pixel Helper before going live.

Example use cases

Capture utm_campaign and utm_source on an ad landing page and attach them to the CRM via hidden form fields.
Track CTA clicks and scroll depth to identify which hero messages drive engagement and conversions.
Set up Meta Pixel purchase and AddToCart events for e-commerce funnels to optimize Facebook campaigns.
Configure GA4 custom events for multi-step checkout to measure drop-off between steps.
Use GTM to deploy tags and centralize event wiring for faster updates and A/B testing.

FAQ

Do I need both GA4 and Meta Pixel?

Use GA4 for site analytics and Meta Pixel for Facebook ad optimization; having both ensures attribution across channels.

How long should I store UTMs?

Persist UTMs in localStorage for the typical sales cycle length (30–90 days) or until a conversion occurs, then clear if necessary.