Analytics & Tracking
Complete step-by-step guide to set up Google Analytics 4, Facebook Pixel, and track all your conversion events.
Google Analytics 4
Facebook Pixel
Custom Events
Get your analytics up and running in 3 simple steps:
Copy your GA4 Measurement ID and Facebook Pixel ID from their dashboards
Replace placeholder IDs in your website's head section (4 places total)
Use browser console and platform debugging tools to confirm tracking works
Complete configuration guide
Your Measurement ID looks like: G-XXXXXXXXXX (starts with "G-")
You need to replace
GA_MEASUREMENT_ID
with your actual ID in 2 places:
// Find this in your website's <head> section:
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
<script>
gtag('config', 'GA_MEASUREMENT_ID', {
'send_page_view': true
});
</script>
→ Open your website editor
→ Go to the "Home" page settings
→
Find the
<head>
section (AI WEBSITE-HEAD area)
→
Replace both instances of
GA_MEASUREMENT_ID
with your G-XXXXXXXXXX
→ Also update on the Drop 1 page (AI PAGE-HEAD section)
→ Save and publish your changes
Success! If you see yourself in Realtime view, GA4 is working correctly. Data may take 24-48 hours to populate in standard reports.
Deep insights into user behavior
See which products grab attention even if not clicked
Track every click to understand navigation patterns
Identify where users abandon forms
Monitor clicks to social media and external sites
Track image and video interactions
Pre-built events for checkout, payment, purchase
All advanced tracking features have been implemented on your website! Check the browser console to see these events in real-time.
Product Hover Events - Active on Drop 1 page
Click Heatmap - Tracking all pages
Form Analytics - Newsletter forms tracked
Outbound Links - Social media clicks tracked
Your website automatically tracks all of these events. View them in
real-time by opening browser console (F12) and looking for
📊 Analytics:
messages.
Tracks when users hover over product cards for 500ms+
Data: product name, hover duration, price
Tracks "Shop Now" button clicks on product cards
Data: product ID, name, price, click location
Ready for when you implement cart functionality
Data: product details, quantity, cart value
Tracks when users reach 25%, 50%, 75%, 100% scroll
Data: percentage, page path, timestamp
Auto-tracked every 30 seconds and on page exit
Data: seconds, minutes, page path
Every click tracked for heatmap analysis
Data: element type, text, location, page
Tracks which FAQ questions users click
Data: question text, page path
Newsletter signups from exit popup or footer
Data: source (popup/footer), lead value (£5)
Tracks form field interactions (automatic)
Data: form name, field name, filled status
When popup shows due to exit intent
Data: time on page, trigger reason
These events are pre-configured and ready to use once you implement checkout functionality. They follow GA4 enhanced e-commerce standards.
User initiates checkout process
Usage: window.threadlightAnalytics.beginCheckout(items, totalValue)
Payment information entered
Usage: window.threadlightAnalytics.addPaymentInfo('card', totalValue)
Transaction completed successfully
Usage: window.threadlightAnalytics.purchase(transactionId, items, total, shipping, tax)
Tracks clicks on images (automatic)
Data: image alt text, source URL, page path
Clicks to external sites (Instagram, etc.)
Data: destination URL, link text, page path
Video engagement tracking (when you add videos)
Usage: Manual tracking via threadlightAnalytics
Open your website and press F12 to open developer tools. Navigate your site normally and you'll see:
📊 Analytics: select_item {item_name: "High-Waist Leggings", price: 45, ...}
📊 Analytics: scroll_depth {scroll_percentage: 50, ...}
📊 Analytics: product_hover {hover_duration_ms: 2341, ...}
📊 Analytics: element_click {element_type: "button", ...}
Your website now has enterprise-level analytics tracking every meaningful interaction. Just replace your tracking IDs and start collecting data!
Event Types Tracked
Automatic Tracking
Manual Code Needed
Or press F12 anywhere on your site to see events in real-time
Pre-built dashboard configurations for ThreadLight
Monitor product performance and conversion metrics
Product Click-Through Rate
select_item events ÷ page views
Hover-to-Click Ratio
product_hover ÷ select_item
Average Hover Duration
Mean hover_duration_ms by product
Newsletter Conversion Rate
generate_lead ÷ page views
Avg. Time on Drop 1 Page
time_on_page for /drop-1
Scroll Depth Completion
% reaching 75%+ scroll
Go to GA4 → Reports → Library
Click "Create new report" → "Detail report"
Add Dimension: "Page path"
Filter to only show /drop-1 page
Add Custom Metrics:
• Product CTR = select_item events / page_views * 100
• Hover Rate = product_hover events / page_views * 100
• Newsletter CVR = generate_lead events / page_views * 100
Add Comparison: Week over Week
Compare → Previous period (7 days)
Save as "Drop 1 Performance Dashboard"
Add to your favorites for quick access
Understand how users navigate and engage
Most clicked elements across your site
Dimension: element_text
Metric: element_click event count
Visualization: Table (top 20)
Where users stop reading
Dimension: scroll_percentage
Metric: scroll_depth event count
Visualization: Line chart by page
Which traffic sources engage longer
Dimension: source / medium
Metric: Avg time_seconds
Visualization: Bar chart
Social media & external engagement
Dimension: destination_url
Metric: outbound_click count
Visualization: Table with trend
Optimize form completion and lead generation
generate_lead (exit_intent_popup) / exit_intent_triggered
generate_lead (footer_newsletter) / page_views
form_field_blur (filled) / form_field_focus
time_on_page at generate_lead event
Track user journey from discovery to conversion
Track the complete customer journey from awareness to purchase
Page View: /drop-1
User lands on Drop 1 collection page
Event: page_view (page_path = /drop-1)
Product Engagement
User hovers over or clicks product
Event: product_hover OR select_item
Product Page Visit
User clicks "Shop Now" to product page
Event: select_item + page_view (product page)
Add to Cart (Future)
User adds product to cart
Event: add_to_cart
Begin Checkout
User proceeds to checkout
Event: begin_checkout
Purchase Complete! 🎉
Transaction successful
Event: purchase
Step 1: page_view (page_path = /drop-1)
Step 2: product_hover OR select_item
Step 3: select_item
Step 4: add_to_cart (when implemented)
Step 5: begin_checkout
Step 6: purchase
Goal: Increase email focus → submit to 60%+
Goal: A/B test copy to increase focus rate
Insight: Exit intent converts 4x better than footer! Consider adding exit intent to more pages.
Advanced retargeting strategies for maximum ROI
Why Custom Audiences? Retargeting is 3-10x more cost-effective than cold traffic. These audiences let you show ads to people who've already shown interest in ThreadLight.
Users who showed strong interest but didn't purchase
Viewed Drop 1 Collection
ViewContent event with content_name = "Drop 1 Collection"
Product Hover > 2 seconds
Custom event: product_hover with hover_duration_ms > 2000
Time on Page > 60 seconds
Custom event: time_on_page with time_seconds > 60
Exclude: Purchased
Exclude Purchase event (last 30 days)
• ViewContent (content_name contains "Drop 1")
• AND product_hover (hover_duration_ms > 2000)
• AND time_on_page (time_seconds > 60)
• EXCLUDE Purchase (last 30 days)
Ad Strategy: Show them customer testimonials + "Limited Stock" urgency. Budget: 40% of total ad spend.
Engaged readers who scrolled 75%+
Rule: scroll_depth (scroll_percentage ≥ 75)
Retention: 14 days
Use: Promote blog content, sustainability story
Users who needed more info before buying
Rule: faq_interaction (any question)
Retention: 30 days
Use: Address common objections in ads
Saw popup but didn't subscribe
Rule: exit_intent_triggered
Exclude: Lead event
Retention: 7 days
Use: Different offer, urgency messaging
Visited 3+ times, high intent
Rule: ViewContent (frequency ≥ 3)
Retention: 30 days
Use: Strong CTA, limited-time discount
Most similar to your best customers
Source: Hot Product Engagers
Broader reach, still targeted
Source: Newsletter Subscribers
Combine multiple source audiences
Source: Top 3 audiences combined
Pro Tip: Start with 1% lookalikes of purchasers (once you have 100+ purchases). These typically have 2-3x higher ROAS than interest-based targeting.
Automated alerts, cohort analysis, and predictive analytics to stay ahead of trends
Get notified when important metrics change
• Trigger: Daily pageviews drop > 30%
• Action: Email + SMS notification
• Check: Technical issues, SEO penalties
IF page_views_today < (page_views_last_7d_avg * 0.7)
• Trigger: CTR increases > 50%
• Action: Email notification
• Check: What's working? Scale it!
IF ctr_today > (ctr_last_7d_avg * 1.5)
• Trigger: Product clicks > expected sales
• Action: Inventory check reminder
• Check: Re-order before stockout
IF select_item_rate > historical_avg * 1.3
• Trigger: Hit daily signup goal (e.g. 50)
• Action: Celebration email 🎉
• Check: What drove the surge?
IF generate_lead_today ≥ 50
Alternatively, use Google Sheets + Apps Script to pull GA4 data daily and send custom email alerts
Track user behavior over time by acquisition date
Group users by when they first visited, then track their behavior over subsequent days/weeks. This reveals:
Do users come back week after week?
| Week | W0 | W1 | W2 | W3 |
|---|---|---|---|---|
| Jan 1 | 100% | 35% | 18% | 12% |
How fast do users purchase?
AI-powered forecasting for smarter decisions
GA4's built-in ML model predicts likelihood to purchase
Use: Target high-probability users with aggressive retargeting
Identify users likely to stop engaging
Use: Win-back campaigns before they're gone
Predicted revenue in next 28 days
Use: Budget planning and inventory decisions
GA4 uses machine learning to analyze:
The model improves over time as it collects more data.
Your ThreadLight website now has the same level of analytics sophistication as companies spending $50,000+/year on enterprise platforms.
Event Types
Custom Audiences
GA4 Dashboards
Automated Alerts
Track Every User Action
Hovers, clicks, scrolls, form interactions - all automatic
Build Conversion Funnels
See exactly where users drop off in the buying journey
Retarget High-Intent Users
Show ads to people who already love your products
Get Automated Alerts
Know immediately when metrics change significantly
Analyze Cohorts
Track user behavior over time by acquisition date
Predict Future Performance
AI-powered forecasting for smarter decisions
Press F12 anywhere on your site to see analytics in action
Look for
📊 Analytics:
messages in the console