Advanced Configuration #

GStatus is designed to be flexible and adaptable to your specific needs. This guide covers advanced configuration options, allowing you to take full control of how analytics are collected and managed.

1. Tracking Specific Pages or Sections #

By default, GStatus tracks all pages where the script is installed. However, you can customize tracking to target specific pages or sections of your website.

Example: Enable Tracking on Specific Pages #

if (window.location.pathname === '/specific-page') {
  GStatus.trackPageView();
}

Example: Exclude Pages from Tracking

To exclude certain pages (e.g., admin or login pages), use the following logic:

const excludedPages = ['/admin', '/login'];
if (!excludedPages.includes(window.location.pathname)) {
  GStatus.trackPageView();
}

2. Custom Event Tracking #

GStatus allows you to track user interactions beyond standard page views, such as button clicks, form submissions, or video plays. Track a Button Click

document.getElementById('cta-button').addEventListener('click', () => {
  GStatus.trackEvent('button_click', {
    buttonId: 'cta-button',
    label: 'Call to Action',
  });
});

Track Form Submissions

document.querySelector('form').addEventListener('submit', (event) => {
  GStatus.trackEvent('form_submission', {
    formId: event.target.id,
    page: window.location.pathname,
  });
});

Track Video Plays

document.getElementById('video').addEventListener('play', () => {
  GStatus.trackEvent('video_play', {
    videoId: 'intro-video',
    title: 'Introduction Video',
  });
});

3. Custom Data Storage Options #

GStatus provides flexibility in how and where your analytics data is stored. You can specify a custom storage solution, such as your local database or a third-party system.

Example: Using a Custom API Endpoint

GStatus.init({
  siteId: 'YOUR_SITE_ID',
  apiEndpoint: 'https://your-custom-domain/api',
});

Example: Self-Hosted Analytics

Host your own GStatus backend to maintain complete control over data:

Set up a server to handle GStatus requests.
Configure the apiEndpoint to point to your server.
Monitor and process incoming data securely.

4. Real-Time Data Streaming #

Enable real-time data streaming for immediate insights into user behavior. Configuration Example:

GStatus.init({
  siteId: 'YOUR_SITE_ID',
  enableRealtime: true,
  realtimeFrequency: 5000, // Data sync every 5 seconds
});

This option is ideal for applications like live dashboards or interactive analytics tools. 5. Advanced Heatmap Configuration

Heatmaps are a powerful way to visualize user engagement. Customize them further to suit your needs.

Example: Track Specific Elements

To focus heatmaps on specific elements, such as a call-to-action section:

GStatus.init({
  enableHeatmaps: true,
  heatmapTarget: '#cta-section', // CSS selector for the target element
});

Example: Customize Heatmap Sampling Rate

Control the frequency of heatmap data collection to optimize performance:

GStatus.init({
  enableHeatmaps: true,
  heatmapSamplingRate: 0.5, // 50% of users will be sampled
});

6. User Consent Management #

For GDPR or CCPA compliance, you can implement user consent before enabling tracking. Example: Consent-Based Initialization

if (userHasConsented) {
  GStatus.init({
    siteId: 'YOUR_SITE_ID',
    anonymizeIp: true,
  });
}

Example: Custom Consent Banner

Use a third-party consent management tool or create your own banner to collect consent before enabling GStatus.

7. Debugging and Monitoring #

GStatus includes debugging options to help troubleshoot issues during development. Enable Debug Mode

GStatus.init({
  siteId: 'YOUR_SITE_ID',
  debug: true, // Logs all tracking actions in the browser console
});

Use Network Tools for Validation

Monitor tracking requests in your browser’s developer tools:

Open the Network tab.
Filter requests by gstatus to see data being sent to the API.

8. Localization and Multilingual Support #

If your site supports multiple languages, configure GStatus to track data accordingly.

Example: Set Language Context

GStatus.init({
  siteId: 'YOUR_SITE_ID',
  language: document.documentElement.lang, // Dynamically set the language
});

9. Integrating with Other Tools #

GStatus is highly compatible with third-party analytics and marketing tools. Use its API to sync data.

Example: Send Data to Google Analytics (If Needed)

GStatus.trackEvent('button_click', {
  buttonId: 'cta-button',
}, () => {
  // Callback to send the same event to Google Analytics
  gtag('event', 'button_click', { buttonId: 'cta-button' });
});