📊 Google Analytics Events Documentation

Complete documentation for every Google Analytics 4 tracking event implemented on the site.

📋 Table of Contents

1. Overview
2. Naming Conventions
3. Standard Parameters
4. Events by Page
   • Landing Page
   • Blog
   • Insights
   • Store
   • Contact
   • Projects
   • Affiliate Events
5. How to Use
6. Debugging

🎯 Overview

All tracking events are centralized in:

src/app/lib/analytics-events.ts

This system guarantees:

• ✅ Consistent event naming
• ✅ Standardized parameters
• ✅ Easy maintenance and documentation
• ✅ Type-safe helpers with TypeScript
• ✅ End-to-end funnel tracking

📝 Naming Conventions

Event Format

[section]_[component]_[action]

Examples:

• hero_cta_click
• blog_post_card_click
• store_template_download
• contact_form_submit

Parameter Format

snake_case for every parameter

Examples:

• source_component
• funnel_stage
• cta_type
• template_id

🔑 Standard Parameters

All events include these required parameters:

📄 Events by Page

Landing Page

1. Hero Section

Event: hero_cta_click

Fires when the user clicks a hero CTA

Additional parameters:

Track when:

• ✅ Click the “View Projects” button (primary)
• ✅ Click the “Book Meeting” button (secondary)

2. Navigation / Header

Event: nav_item_click

Fires when the user clicks a menu item

Additional parameters:

Track when:

• ✅ Click any navigation menu item
• ✅ Click the “Contact” button in the header

3. Projects Section

Event: project_card_click

Fires when the user clicks a project card

Additional parameters:

Event: project_tab_change

Fires when the user changes a project tab

Additional parameters:

4. Footer

Event: footer_link_click

Fires when the user clicks a footer link

Additional parameters:

Event: footer_social_click

Fires when the user clicks a social icon

Additional parameters:

Blog

1. Blog List Page

Event: blog_post_card_click

Fires when the user clicks a blog post card

Additional parameters:

Event: blog_filter_change

Fires when the user changes a filter

Additional parameters:

Event: blog_search

Fires when the user performs a search

Additional parameters:

2. Blog Post Page

Event: blog_post_reaction

Fires when the user adds a reaction

Additional parameters:

Event: blog_post_share

Fires when the user shares a post

Additional parameters:

Event: blog_reading_progress

Fires at reading milestones (25%, 50%, 75%, 100%)

Additional parameters:

Insights

1. Insights List Page

Event: insight_card_click

Fires when the user clicks an insight card

Additional parameters:

2. Insight Detail Page

Event: insight_lead_magnet_view

Fires when a lead magnet is displayed

Additional parameters:

Event: insight_lead_magnet_download

Fires when the user downloads the material

Additional parameters:

Event: insight_newsletter_subscribe

Fires when the user subscribes to the newsletter

Additional parameters:

Store

1. Store List Page

Event: store_template_view

Fires when a template is displayed (impression)

Additional parameters:

Event: store_template_demo_click

Fires when the user clicks “View Demo”

Additional parameters:

2. Purchase Flow

Event: store_initiate_checkout

Fires when the user starts a checkout

Additional parameters:

Event: purchase (GA4 standard e-commerce)

Fires when a purchase is completed

Additional parameters:

Event: store_template_download

Fires when a free template is downloaded

Additional parameters:

Contact

Event: contact_form_start

Fires when the user starts filling out the form

Additional parameters:

Event: contact_form_submit

Fires when the form is submitted

Additional parameters:

Event: contact_form_error

Fires when the form has an error

Additional parameters:

Projects

Event: projects_card_click

Fires when the user clicks a project

Additional parameters:

Event: projects_github_cta_click

Fires when the user clicks “View on GitHub”

Additional parameters:

Event: projects_live_demo_click

Fires when the user clicks “View Demo”

Additional parameters:

Affiliate Events

All affiliate-specific tracking helpers live inside the affiliateEvents export of src/app/lib/analytics-events.ts. They power the landing page, referral tracker, dashboard, and checkout instrumentation.

Whenever you ship new affiliate UX, emit the corresponding helper instead of calling trackGAEvent directly so payloads stay aligned.

💻 How to Use

1. Import the events module

import { landingPageEvents, blogEvents, storeEvents } from "@/app/lib/analytics-events";
import { getCurrentPageMetadata } from "@/app/lib/analytics";

2. Track an event

// Inside a client component
"use client";
 
function MyComponent() {
  const handleClick = () => {
    const metadata = getCurrentPageMetadata();
 
    landingPageEvents.heroCTAClick({
      ...metadata,
      destination: "/pt#projects",
      cta_type: "primary",
    });
  };
 
  return <button onClick={handleClick}>Click here</button>;
}

3. Inspect events in the console

In development, all events are logged to the console:

[GA4] hero_cta_click {
  locale: "pt",
  page_path: "/pt",
  page_title: "ignitionstack.pro - Home",
  funnel_stage: "awareness",
  source_component: "hero_section",
  destination: "/pt#projects",
  cta_type: "primary",
  engagement_type: "click",
  environment: "development"
}

🐛 Debugging

View realtime events in GA4

1. Open Google Analytics 4
2. Go to Reports → Realtime
3. Click View realtime events
4. Interact with the site and watch events appear

Inspect event parameters

1. In GA4, go to Configure → DebugView
2. Enable debug mode on the site: gtag('set', 'debug_mode', true)
3. See the full payload for each event

Browser console

Em desenvolvimento, use o console para ver:

// Check if GA4 is loaded
window.gtag
 
// Inspect dataLayer
window.dataLayer
 
// Force a test event
landingPageEvents.heroCTAClick({
  locale: "pt",
  page_path: "/pt",
  page_title: "Test",
  funnel_stage: "awareness",
  destination: "/test",
  cta_type: "primary"
});

📊 Recommended GA4 Reports

1. Conversion funnel

Build a funnel with these events:

1. hero_cta_click (Awareness)
2. store_template_view (Consideration)
3. store_initiate_checkout (Conversion)
4. purchase (Conversion)

2. Content analysis

Track these events:

• blog_post_card_click
• blog_reading_progress
• blog_post_reaction
• blog_post_share

3. CTA performance

Compare:

• hero_cta_click (primary vs secondary)
• store_cta_click
• footer_link_click
• nav_item_click

📈 Calculated metrics

Post engagement rate

(blog_post_reaction + blog_post_share) / blog_post_view

Lead magnet conversion rate

insight_lead_magnet_download / insight_lead_magnet_view

Checkout conversion rate

purchase / store_initiate_checkout

Last updated: 2025-10-11 Version: 1.0.0 Maintained by: ignitionstack.pro Team