ProductReadyProductReady

Third-Party Integrations

Configure third-party analytics, feedback, and marketing tools via environment variables

Third-Party Integrations

ProductReady supports integration with various third-party services for analytics, user feedback, and marketing. All integrations are configured via environment variables for security and flexibility.

Available Integrations

Analytics & Tracking

Google Analytics (GA4)

Track user behavior and page views with Google Analytics 4.

Environment Variable:

NEXT_PUBLIC_GA_MEASUREMENT_ID=G-XXXXXXXXXX

Setup:

  1. Create a GA4 property in Google Analytics
  2. Copy your Measurement ID (starts with G-)
  3. Add to your .env.local file

Google Tag Manager (GTM)

Manage multiple tracking scripts and marketing tags from one place.

Environment Variable:

NEXT_PUBLIC_GTM_ID=GTM-XXXXXXX

Setup:

  1. Create a container in Google Tag Manager
  2. Copy your Container ID (starts with GTM-)
  3. Add to your .env.local file

Google Search Console (GSC)

Verify your site ownership for search performance tracking.

Environment Variable:

NEXT_PUBLIC_GSC_VERIFICATION=your-verification-code

Setup:

  1. Go to Google Search Console
  2. Add your property and choose "HTML tag" verification method
  3. Copy the content value from the meta tag
  4. Add to your .env.local file

Microsoft Clarity

Session recording and heatmaps for understanding user behavior.

Environment Variable:

NEXT_PUBLIC_CLARITY_PROJECT_ID=your-project-id

Setup:

  1. Create a project in Microsoft Clarity
  2. Copy your Project ID
  3. Add to your .env.local file

User Feedback & Support

Featurebase

Collect user feedback, feature requests, and product roadmap voting.

Environment Variable:

NEXT_PUBLIC_FEATUREBASE_TOKEN=your-public-token

Setup:

  1. Sign up at Featurebase
  2. Create a workspace
  3. Copy your public widget token
  4. Add to your .env.local file

Usage: The Featurebase widget will automatically appear on your application when configured.

ProductDrone

Customer support and feedback collection tool.

Environment Variable:

NEXT_PUBLIC_PRODUCTDRONE_API_KEY=your-api-key

Setup:

  1. Sign up at ProductDrone
  2. Create a project
  3. Copy your API key
  4. Add to your .env.local file

Support Email

Configure a custom support email address displayed throughout the application.

Environment Variable:

NEXT_PUBLIC_SUPPORT_EMAIL=support@yourdomain.com

Environment Variable Prefix

All public integrations use the NEXT_PUBLIC_ prefix, which means:

  • ✅ Values are exposed to the browser
  • ✅ Safe to include non-sensitive configuration
  • ❌ Do NOT include secret keys or credentials

Example Configuration

Create or update your .env.local file in the root of your project:

# Analytics
NEXT_PUBLIC_GA_MEASUREMENT_ID=G-XXXXXXXXXX
NEXT_PUBLIC_GTM_ID=GTM-XXXXXXX
NEXT_PUBLIC_CLARITY_PROJECT_ID=abc123xyz

# Search Console
NEXT_PUBLIC_GSC_VERIFICATION=abc123xyz456

# User Feedback
NEXT_PUBLIC_FEATUREBASE_TOKEN=ft_xxxxxxxxxxxxx
NEXT_PUBLIC_PRODUCTDRONE_API_KEY=pd_xxxxxxxxxxxxx

# Support
NEXT_PUBLIC_SUPPORT_EMAIL=support@yourapp.com

Development vs Production

You can use different values for different environments:

  • Development: .env.local (not committed to git)
  • Production: Set in your hosting platform (Vercel, Railway, etc.)

Verification

After setting environment variables:

  1. Restart your development server - Environment variables are loaded at build time

    pnpm dev

  2. Check the browser console - Most integrations will log initialization messages

  3. Verify in the source code - View page source and look for:

    • GTM/GA script tags in <head>
    • Featurebase/ProductDrone widgets at the bottom of <body>
    • GSC verification meta tag in <head>

Disabling Integrations

To disable an integration, simply remove or comment out its environment variable:

# NEXT_PUBLIC_GA_MEASUREMENT_ID=G-XXXXXXXXXX  # Disabled

Security Best Practices

  1. Never commit .env.local to version control
  2. Use separate accounts for development and production
  3. Rotate API keys if accidentally exposed
  4. Review permissions for each integration
  5. Only enable integrations you actively use

Troubleshooting

Scripts Not Loading

Check:

  • Environment variable is set correctly (including NEXT_PUBLIC_ prefix)
  • Development server was restarted after adding variables
  • No browser extensions blocking scripts (adblockers, privacy tools)

Wrong Data Being Tracked

Solution:

  • Verify you're using the correct property ID for your environment
  • Use different IDs for dev, staging, and production

Widget Not Appearing

Check:

  • API key is valid and active
  • Widget is enabled in the service dashboard
  • No CSS conflicts hiding the widget

Need Help?

If you encounter issues with third-party integrations:

  1. Check the service's official documentation
  2. Verify your API keys are valid
  3. Test with browser dev tools console open
  4. Contact the service's support team

For ProductReady-specific integration issues, please refer to the Troubleshooting Guide.

Analytics Integration

Learn how to integrate Google Analytics and Microsoft Clarity into ProductReady

Deployment Guide

Deploy ProductReady to production - Vercel, Docker, environment setup, and CI/CD best practices

On this page

Third-Party IntegrationsAvailable IntegrationsAnalytics & TrackingGoogle Analytics (GA4)Google Tag Manager (GTM)Google Search Console (GSC)Microsoft ClarityUser Feedback & SupportFeaturebaseProductDroneSupport EmailEnvironment Variable PrefixExample ConfigurationDevelopment vs ProductionVerificationDisabling IntegrationsSecurity Best PracticesTroubleshootingScripts Not LoadingWrong Data Being TrackedWidget Not AppearingNeed Help?