How to Fix Tilda Tracking Events Not Firing | OpsBlu Docs

How to Fix Tilda Tracking Events Not Firing

Fix GA4, GTM, and pixel events not firing on Tilda — custom code block placement, republish requirements, and zero-block JavaScript event debugging

Common causes and solutions for tracking events that don't fire correctly on Tilda websites.

For general tracking troubleshooting, see the global tracking troubleshooting guide.

Quick Diagnosis Checklist

Before diving deep, check these common Tilda-specific issues:

  • Site republished after adding tracking code (critical!)
  • Testing on published site, not preview mode
  • Ad blocker disabled (for testing)
  • Browser cache cleared (incognito/private mode)
  • No JavaScript errors in console (F12)
  • Code in correct location (Site Settings → Analytics)
  • jQuery ready wrapper used for events
  • GTM container published (if using GTM)

Tilda-Specific Limitations & Issues

Publishing Requirements

THE #1 TILDA ISSUE: Site Not Republished

Problem: Changes to tracking code don't appear on live site.

Cause: Tilda requires manual republishing after code changes.

Fix:

  1. Click Publish button (top right)
  2. Select All pages or specific pages
  3. Wait for "Published successfully" message
  4. Clear browser cache
  5. Test on published URL

Verification:

  • Right-click page → View Source
  • Search for your tracking code
  • Should appear in source
  • If not, republish again

Preview Mode Limitations

Problem: Tracking works on published site but not in preview.

Cause: Preview mode has limited JavaScript execution for security.

Impact:

  • Custom scripts may not load
  • Event listeners may not attach
  • Tracking pixels may not fire
  • GTM may not initialize

Solution: Always test on published site, never rely on preview mode for tracking verification.

Preview mode is for:

  • Visual design review
  • Content editing
  • Layout testing

Published site is for:

  • Tracking testing
  • Performance testing
  • Full functionality testing

Google Analytics 4 (GA4) Issues

GA4 Not Loading

1. Verify Code Location

Check Site Settings:

  1. Go to Site Settings → Analytics
  2. Verify GA4 code is present
  3. Check Measurement ID is correct (starts with G-)

Verify on page:

// Open console (F12)
console.log(typeof gtag);
// Should return "function", not "undefined"

2. Check Measurement ID

Correct format: G-XXXXXXXXXX

NOT: UA-XXXXXXXXX (old Universal Analytics)

<!-- Correct: GA4 -->
gtag('config', 'G-XXXXXXXXXX');

<!-- Wrong: Universal Analytics (deprecated) -->
gtag('config', 'UA-XXXXXXXXX');

3. Verify Site Republished

After adding GA4 code:

  • Click Publish
  • Wait for completion
  • Clear browser cache
  • Test on published URL

GA4 Events Not Firing

1. Use GA4 DebugView

Enable debug mode:

gtag('config', 'G-XXXXXXXXXX', {
  'debug_mode': true
});

Check in GA4:

  • GA4 → Admin → DebugView
  • Perform actions on site
  • Events should appear within 30 seconds
  • If in DebugView but not Reports, wait 24-48 hours for processing

2. Form Submissions Not Tracked

Problem: tildaform:aftersuccess event not caught.

Common causes:

A. jQuery Not Ready

// Wrong: Runs before jQuery loads
$(document).on('tildaform:aftersuccess', function(e, data) {
  // May not attach
});

// Correct: Wait for jQuery
$(document).ready(function() {
  $(document).on('tildaform:aftersuccess', function(e, data) {
    gtag('event', 'form_submit', {
      'form_id': data.formId
    });
  });
});

B. Event Listener Syntax Error

// Check console for errors
$(document).ready(function() {
  $(document).on('tildaform:aftersuccess', function(e, data) {
    console.log('Form submitted:', data); // Debug log

    gtag('event', 'form_submit', {
      'form_id': data.formId,
      'form_name': data.formname
    });

    console.log('GA4 event sent'); // Confirmation log
  });
});

C. Multiple Event Listeners

// May be attaching multiple times
// Ensure code only runs once
var formTrackingInitialized = false;

$(document).ready(function() {
  if (!formTrackingInitialized) {
    formTrackingInitialized = true;

    $(document).on('tildaform:aftersuccess', function(e, data) {
      gtag('event', 'form_submit', {
        'form_id': data.formId
      });
    });
  }
});

3. Test Form Submission

Manual test:

  1. Open browser console
  2. Add test listener:
$(document).on('tildaform:aftersuccess', function(e, data) {
  console.log('Tilda form event fired:', data);
});
  1. Submit a form
  2. Check if event logs
  3. If yes: Tilda works, check GA4 code
  4. If no: Form submission issue (check Tilda form settings)

Duplicate GA4 Events

Cause: GA4 code in multiple locations.

Check:

  • Site Settings → Analytics
  • HTML blocks on pages
  • GTM container (if using GTM)

Fix: Keep GA4 in ONE location only:

  • Recommended: Site Settings → Analytics
  • OR: GTM (remove from Site Settings)
  • NOT: Both

Meta Pixel Issues

Meta Pixel Not Loading

1. Verify Pixel ID

Format: 16-digit number (e.g., 1234567890123456)

NOT: Business Manager ID or Page ID

Verify in console:

console.log(typeof fbq);
// Should return "function"

// Check pixel loaded
console.log(window._fbq);
// Should show pixel info

2. Check for Ad Blockers

Meta Pixel is commonly blocked:

  • Disable ad blocker for testing
  • Use incognito mode
  • Test on mobile device
  • Use Meta Pixel Helper extension

Install: Meta Pixel Helper

Indicators:

  • Green icon = Working
  • Yellow = Warnings
  • Red = Error
  • No icon = Not detected

3. Verify Code Placement

Check Site Settings → Analytics:

  • Meta Pixel base code should be present
  • Should be BEFORE event tracking code
  • Check closing tags are correct

Meta Pixel Events Not Firing

1. Form Lead Events

Problem: Lead event not firing on form submission.

Fix:

$(document).ready(function() {
  $(document).on('tildaform:aftersuccess', function(e, data) {
    console.log('Tilda form event:', data); // Debug

    fbq('track', 'Lead', {
      'content_name': data.formname || 'Contact Form',
      'content_category': 'Form Submission'
    });

    console.log('Meta Pixel: Lead sent'); // Confirmation
  });
});

2. Check Events Manager

Real-time testing:

  1. Go to Meta Events Manager
  2. Select your Pixel
  3. Click Test Events
  4. Enter your Tilda site URL
  5. Perform actions
  6. Events should appear within seconds

3. Missing Event Parameters

Correct format:

fbq('track', 'Lead', {
  'content_name': 'Contact Form',  // String
  'value': 0,                       // Number (no $)
  'currency': 'USD'                 // ISO code
});

Wrong format:

fbq('track', 'Lead', {
  'content_name': undefined,        // Missing
  'value': '$10',                   // Should be: 10
  'currency': 'dollars'             // Should be: 'USD'
});

Google Tag Manager (GTM) Issues

GTM Container Not Loading

1. Verify Installation

Check Site Settings → Analytics:

Should have both snippets:

<!-- Head snippet -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});...

<!-- Body snippet (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"...

Verify Container ID: Replace GTM-XXXXXXX with actual ID.

Check in console:

console.log(window.google_tag_manager);
// Should show object with container ID

2. Container Not Published

THE #1 GTM ISSUE: Container changes saved but not published.

Fix:

  1. Go to GTM
  2. Look for "Workspace Changes" notification
  3. Click Submit
  4. Add version name/description
  5. Click Publish
  6. Wait for "Published" confirmation

Verify:

  • Refresh Tilda site
  • Check GTM Preview mode
  • Should show published version

3. Site Not Republished After Adding GTM

Fix:

  1. In Tilda, click Publish
  2. Publish all pages
  3. Clear browser cache
  4. Test on published URL

GTM Events Not Firing

1. Data Layer Not Receiving Events

Problem: Tilda events not reaching GTM.

Cause: Tilda doesn't automatically push to GTM data layer.

Fix: Add data layer push in Site Settings → Analytics:

$(document).ready(function() {
  // Push Tilda form submissions to GTM
  $(document).on('tildaform:aftersuccess', function(e, data) {
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({
      'event': 'tildaform:aftersuccess',
      'formId': data.formId,
      'formName': data.formname,
      'transactionId': data.tranid
    });

    console.log('Pushed to dataLayer:', window.dataLayer);
  });
});

2. Triggers Not Configured

Check in GTM:

  1. Go to Triggers
  2. Find trigger for your event
  3. Verify:
    • Trigger Type: Custom Event
    • Event name: Matches exactly (case-sensitive)
    • Example: tildaform:aftersuccess

3. Variables Not Populating

Problem: GTM variables show undefined.

Fix: Ensure data layer pushes include variable data:

// Push with correct variable names
window.dataLayer.push({
  'event': 'form_submit',
  'formId': data.formId,        // Variable: formId
  'formName': data.formname     // Variable: formName
});

Create variables in GTM:

  • Variable Type: Data Layer Variable
  • Data Layer Variable Name: formId
  • Name: DLV - Form ID

4. Use GTM Preview Mode

Essential for debugging:

  1. In GTM, click Preview
  2. Enter your Tilda URL (published site)
  3. Click Connect
  4. Tag Assistant opens
  5. Perform actions on Tilda site
  6. Watch events in Tag Assistant:
    • Tags: Which tags fired
    • Variables: Variable values
    • Data Layer: Events pushed
    • Errors: Any issues

Common Error Messages

"jQuery is not defined"

Cause: Code runs before jQuery loads.

Fix:

// Always use
$(document).ready(function() {
  // Your code here
});

// OR
jQuery(document).ready(function($) {
  // Use $ here
});

"gtag is not defined"

Cause: GA4 script not loaded.

Fix:

  • Check code in Site Settings → Analytics
  • Verify site republished
  • Check browser Network tab for gtag/js script
  • Disable ad blockers

"fbq is not defined"

Cause: Meta Pixel script not loaded.

Fix:

  • Check Pixel code in Site Settings
  • Verify Pixel ID correct
  • Verify site republished
  • Disable ad blockers
  • Check Meta Pixel Helper

"Uncaught TypeError: Cannot read property"

Cause: Trying to access element/property that doesn't exist.

Fix:

// Check if data exists first
$(document).on('tildaform:aftersuccess', function(e, data) {
  if (data && data.formId) {
    gtag('event', 'form_submit', {
      'form_id': data.formId
    });
  }
});

"dataLayer is not defined"

Cause: GTM not loaded or data layer accessed too early.

Fix:

// Always initialize first
window.dataLayer = window.dataLayer || [];
dataLayer.push({
  'event': 'custom_event'
});

Debugging Tools & Techniques

Browser Console Debugging

1. Check for JavaScript Errors

// Open console (F12)
// Look for red errors
// Fix errors blocking tracking

2. Monitor Tilda Events

// Log all Tilda form submissions
$(document).on('tildaform:aftersuccess', function(e, data) {
  console.log('Tilda form event:', data);
});

3. Check Tracking Pixels Loaded

// GA4
console.log(typeof gtag);
// Should be "function"

// Meta Pixel
console.log(typeof fbq);
// Should be "function"

// GTM
console.log(typeof google_tag_manager);
// Should be "object"

4. Monitor Data Layer

// View data layer
console.table(window.dataLayer);

// Monitor pushes
var originalPush = window.dataLayer.push;
window.dataLayer.push = function() {
  console.log('Data Layer Push:', arguments[0]);
  originalPush.apply(window.dataLayer, arguments);
};

Platform-Specific Testing

GA4 DebugView:

  1. Enable debug mode in code
  2. GA4 → Admin → DebugView
  3. See real-time events with parameters

Meta Events Manager:

  1. Events Manager → Test Events
  2. Enter Tilda URL
  3. Perform actions
  4. See events immediately

GTM Preview Mode:

  1. GTM → Preview
  2. Enter Tilda URL
  3. See tags, triggers, variables
  4. Debug in real-time

Browser Extensions

For GA4:

For Meta Pixel:

For All:

Testing Workflow

Step-by-Step Debugging Process

  1. Verify Basic Setup

    • Code in Site Settings → Analytics
    • Site republished after adding code
    • Testing on published site (not preview)
    • No JavaScript errors in console

  2. Test Page Load Tracking

    • Clear cache and reload
    • Check if PageView fires
    • Verify in platform (GA4/Meta/GTM)
    • Check browser console for errors

  3. Test Form Submissions

    • Add console logging to event listener
    • Submit test form
    • Check console for event log
    • Verify event in platform real-time

  4. Test Other Interactions

    • Button clicks
    • Link clicks
    • Popup opens
    • Video plays

  5. Verify Data Quality

    • Event parameters present
    • Values correct format (numbers, not strings with $)
    • IDs and names populated
    • Currency codes valid (USD, EUR, etc.)

  6. Fix Issues

    • Fix JavaScript errors first
    • Ensure jQuery ready wrapper
    • Add data layer pushes (if using GTM)
    • Remove duplicate implementations
    • Republish site after changes

  7. Final Verification

    • Test in incognito mode
    • Test on mobile device
    • Test multiple page types
    • Monitor for 24-48 hours

Common Tilda-Specific Patterns

Working Form Tracking Template

// Add to Site Settings → Analytics
// Below your GA4/Meta Pixel base code

$(document).ready(function() {
  // Track all Tilda form submissions
  $(document).on('tildaform:aftersuccess', function(e, data) {
    // Debug logging
    console.log('Form submitted:', data);

    // GA4 tracking
    if (typeof gtag !== 'undefined') {
      gtag('event', 'form_submit', {
        'form_id': data.formId,
        'form_name': data.formname || 'Contact Form'
      });
      console.log('GA4 event sent');
    }

    // Meta Pixel tracking
    if (typeof fbq !== 'undefined') {
      fbq('track', 'Lead', {
        'content_name': data.formname || 'Contact Form'
      });
      console.log('Meta Pixel event sent');
    }

    // GTM data layer push
    if (typeof dataLayer !== 'undefined') {
      dataLayer.push({
        'event': 'tildaform:aftersuccess',
        'formId': data.formId,
        'formName': data.formname
      });
      console.log('GTM dataLayer event sent');
    }
  });
});

Testing Code Snippet

Add temporarily for debugging:

// Add to Site Settings → Analytics for testing
$(document).ready(function() {
  console.log('=== Tilda Tracking Debug ===');
  console.log('jQuery loaded:', typeof jQuery !== 'undefined');
  console.log('gtag loaded:', typeof gtag !== 'undefined');
  console.log('fbq loaded:', typeof fbq !== 'undefined');
  console.log('GTM loaded:', typeof google_tag_manager !== 'undefined');
  console.log('dataLayer:', window.dataLayer);

  // Test form event listener
  $(document).on('tildaform:aftersuccess', function(e, data) {
    console.log('✓ Form event captured!', data);
  });
});

When to Get Help

Tilda Support

Contact for:

  • Form submission issues (forms not working)
  • Publishing problems
  • Platform bugs
  • Account issues

Not for:

  • Custom code debugging
  • Third-party integration issues
  • Analytics configuration

Developer/Consultant

Consider hiring when:

  • Events still not firing after troubleshooting
  • Complex tracking requirements
  • Multiple integrations needed
  • Custom implementation required
  • Time-sensitive launch

Find help:

Next Steps

For general troubleshooting strategies, see Tracking Troubleshooting Guide.

Nach oben