Skip to main content

​
Overview

When Planpoint is embedded via iframe, the parent page cannot directly access what happens inside. PostMessage Tracking solves this by broadcasting events from the iframe to your page, allowing you to capture and forward them to any analytics tool.

​
Setup

​
1. Enable in Dashboard

  1. Go to Sales & Marketing → Event Tracking
  2. Toggle PostMessage Analytics on
  3. Select the events you want to track
  4. Click Select All for comprehensive tracking

​
2. Copy Embed Code

Go to Settings → Embed Code and click “Copy”. The generated code automatically includes the analytics listener script when PostMessage Analytics is enabled.

​
3. Uncomment Your Analytics Platform

The embed code includes commented-out lines for common platforms. Uncomment the one you use: 
// Send to Google Analytics 4 (uncomment if using gtag)
// if (typeof gtag !== 'undefined') gtag('event', event.data.event, event.data.data);

// Send to GTM dataLayer (uncomment if using GTM)
// if (typeof dataLayer !== 'undefined') dataLayer.push({ event: event.data.event, ...event.data.data });
  • Using GA4 with gtag.js? → Uncomment the gtag line
  • Using Google Tag Manager? → Uncomment the dataLayer line
  • Using something else? → Add your own handler (see examples below)

​
Available Events

EventDescription
project-viewedUser views a project
floor-viewedUser selects a floor
unit-viewedUser views a unit detail
commerce-viewedUser views a commercial space
favorite-addedUser adds item to favorites
favorite-removedUser removes item from favorites
filters-appliedUser applies search filters
contact-form-submittedUser submits contact form
share-initiatedUser shares via email
download-initiatedUser downloads floorplan/brochure
gallery-openedUser opens image gallery
3d-model-viewedUser opens 3D virtual tour
portal-signupUser signs up for portal
portal-signinUser signs in to portal
payment-completedUser completes a payment

​
Integration Examples

​
Google Analytics 4 (gtag.js)

window.addEventListener('message', function(event) {
  if (event.data.type !== 'planpoint-event') return;
  
  gtag('event', event.data.event, event.data.data);
});

​
Google Tag Manager

window.addEventListener('message', function(event) {
  if (event.data.type !== 'planpoint-event') return;
  
  dataLayer.push({
    event: event.data.event,
    ...event.data.data
  });
});

​
Custom Handler

window.addEventListener('message', function(event) {
  if (event.data.type !== 'planpoint-event') return;
  
  console.log('Event:', event.data.event);
  console.log('Data:', event.data.data);
  
  // Send to your analytics platform
  myAnalytics.track(event.data.event, event.data.data);
});

​
Event Data Structure

All events follow this format: 
{
  type: 'planpoint-event',
  event: 'unit-viewed',        // Event name
  data: {                      // Event-specific data
    projectId: '...',
    projectName: '...',
    unitId: '...',
    unitName: '...',
    // Additional fields vary by event
  }
}

​
Sample Event Payloads

Unit Viewed: 
{
  projectId: "abc123",
  projectName: "Sunrise Towers",
  unitId: "unit456",
  unitName: "Unit 302",
  floorId: "floor789",
  floorName: "3rd Floor"
}
Contact Form Submitted: 
{
  projectId: "abc123",
  projectName: "Sunrise Towers",
  unitId: "unit456",
  formType: "contact"
}
Favorite Added: 
{
  projectId: "abc123",
  projectName: "Sunrise Towers",
  unitId: "unit456",
  unitName: "Unit 302"
}

​
Best Practices

  1. Select only needed events — Reduces noise in your analytics
  2. Test in browser console first — Events log to console by default
  3. Use GTM for flexibility — Easier to modify tracking without code changes
  4. Set up GA4 custom dimensions — Map projectName, unitName for better reporting

​
Troubleshooting

​
Events not firing?

  • Verify PostMessage Analytics is enabled in dashboard
  • Check that specific events are selected
  • Regenerate and update your embed code after changing settings

​
Events firing but not in GA4?

  • Confirm gtag is loaded before the listener
  • Check GA4 DebugView for incoming events
  • Verify your GA4 measurement ID is correct

​
Migration from GTM Code Injection

If you were using the legacy GTM Code Injection feature:
Legacy (GTM Injection)New (PostMessage Analytics)
Injects GTM into Planpoint pageBroadcasts events to parent page
Works for direct page visitsWorks for embedded iframes
Limited to GTMWorks with any analytics tool
For embedded usage, PostMessage Analytics is recommended.