Ghost Integrations Overview | OpsBlu Docs

Ghost Integrations Overview

Complete guide to analytics, tracking, and marketing integrations available for Ghost.

Ghost's minimalist architecture makes it ideal for integrating analytics platforms, marketing pixels, and tag management systems through code injection or custom theme modifications. This section covers the most common integrations and Ghost-specific implementation considerations.

Available Integrations

Analytics Platforms

Google Analytics 4 (GA4)

Ghost offers multiple methods to implement GA4, each with different trade-offs:

  • Code Injection - Ghost Admin → Settings → Code Injection (site-wide)
  • Custom Theme Integration - Handlebars theme modification via default.hbs
  • Google Tag Manager - Centralized tag deployment (recommended for multiple tools)
  • Ghost Integration - Native Ghost integrations via Settings → Integrations

Learn more about Google Analytics setup →

Tag Management

Google Tag Manager (GTM)

GTM provides centralized control over all marketing and analytics tags without modifying Ghost theme files. Essential for teams managing multiple tracking tools.

  • Ghost Code Injection - Add GTM container via Settings → Code Injection
  • Custom Theme Integration - Add to Handlebars partials
  • Per-Post Injection - Individual post code injection for specific campaigns

Learn more about GTM setup →

Marketing Pixels

Meta Pixel (Facebook Pixel)

Track visitor behavior and optimize Facebook/Instagram advertising campaigns:

  • Code Injection Method - Site header injection for global tracking
  • Custom Theme Implementation - Handlebars-based integration
  • GTM Deployment - Tag manager approach
  • Conversion API (CAPI) - Server-side tracking for enhanced privacy

Learn more about Meta Pixel setup →

Ghost-Specific Considerations

Code Injection System

Ghost provides four primary injection points accessible via Ghost Admin → Settings → Code Injection:

  • Site Header - Loads on every page in <head> (ideal for critical tracking)
  • Site Footer - Loads on every page before </body> (better for non-critical scripts)
  • Post/Page Header - Individual post/page header injection (not in site injection)
  • Post/Page Footer - Individual post/page footer injection

Handlebars Theme Integration

Ghost uses Handlebars templating engine for theme customization:

  • Default.hbs - Master template for all pages
  • Partials - Reusable components (\{\{> header\}\}, \{\{> footer\}\})
  • Post.hbs - Single post template
  • Index.hbs - Homepage and post list template
  • Page.hbs - Static page template

Ghost Helpers for Dynamic Data

Ghost provides built-in Handlebars helpers for accessing content data:

{{!-- Site information --}}
{{@site.title}}
{{@site.description}}
{{@site.url}}

{{!-- Post/page data --}}
{{post.title}}
{{post.slug}}
{{post.id}}
{{post.published_at}}
{{post.tags}}

{{!-- Author data --}}
{{author.name}}
{{author.slug}}
{{primary_author.name}}

{{!-- Member data (for Members-enabled sites) --}}
{{@member}}
{{@member.email}}
{{@member.subscriptions}}

Ghost Members and Subscriptions

For Ghost sites with Members enabled:

  • Member Portal - Built-in member signup/signin widget
  • Content Gating - Public, Members-only, and Paid-members-only content
  • Newsletter Subscriptions - Email newsletter tracking
  • Member Tiers - Free, Premium, and custom subscription tiers
  • Stripe Integration - Native payment processing

Performance Impact

Ghost is designed for speed, but integrations add overhead:

  • Lazy Loading - Consider delaying non-critical tracking scripts
  • Async/Defer - Use async or defer attributes for external scripts
  • Conditional Loading - Load tracking only on relevant pages (e.g., paid content)
  • Asset Optimization - Ghost automatically optimizes images, don't interfere with this

Caching Considerations

Ghost uses built-in caching that affects dynamic tracking:

  • Page Caching - Ghost caches rendered HTML (can serve stale data layers)
  • CDN Caching - Ghost(Pro) uses Cloudflare (may prevent real-time tracking updates)
  • Member Context - Logged-in members may see cached content incorrectly
  • Cache Headers - Tracking scripts should not be cached by CDN

Ghost Memberships + E-commerce Tracking

Member subscription tracking requires special attention:

  • Signup Events - Track new member registrations
  • Subscription Events - Track tier upgrades/downgrades
  • Cancellation Events - Track subscription cancellations
  • Newsletter Events - Track newsletter signups/opens/clicks
  • Checkout Flow - Ghost Portal checkout tracking

Self-Hosted vs. Ghost(Pro)

Implementation differs between hosting types:

Ghost(Pro) (Managed Hosting):

  • Full access to Code Injection
  • Cannot directly edit theme files (must upload custom theme)
  • CDN and caching managed by Ghost
  • Automatic SSL and performance optimization

Self-Hosted Ghost:

  • Full file system access
  • Direct theme editing via /content/themes/
  • Manual caching configuration (Nginx, Varnish)
  • Custom server-side integrations possible

Implementation Approaches

1. Code Injection (Easiest)

Best for: Non-technical users, quick implementations, site-wide tracking

Pros:

  • No theme editing required
  • Survives theme updates
  • Accessible via Ghost Admin interface
  • Works on Ghost(Pro) and self-hosted

Cons:

  • All code loads on every page (less granular)
  • Limited access to dynamic Handlebars data
  • Cannot use conditional logic easily
  • Performance impact if overused

2. Custom Theme Integration (Most Control)

Best for: Developers, custom tracking needs, performance-critical sites

Pros:

  • Complete control over implementation
  • Access to all Handlebars helpers and data
  • Conditional loading based on context
  • Optimal performance (only load what's needed)

Cons:

  • Requires Ghost theme development knowledge
  • Must maintain changes across theme updates
  • Requires theme upload on Ghost(Pro)
  • More complex troubleshooting

3. Google Tag Manager (Most Flexible)

Best for: Marketing teams, multiple tracking tools, frequent changes

Pros:

  • Centralized tag management
  • No theme editing for tag changes
  • Version control and rollback
  • Built-in debugging tools
  • Team collaboration features

Cons:

  • Requires GTM knowledge
  • Additional container load time
  • Need to configure data layer properly
  • Limited access to Ghost member context without custom code

Ghost Handlebars for Integrations

Basic Tracking Code Example

{{!-- In default.hbs or partials/head.hbs --}}
<head>
    {{!-- Site metadata --}}
    <title>{{meta_title}}</title>
    <meta name="description" content="{{meta_description}}">

    {{!-- Analytics tracking with Ghost helpers --}}
    <script>
        // Ghost data layer
        window.ghostData = {
            siteTitle: '{{@site.title}}',
            siteUrl: '{{@site.url}}',
            {{#post}}
            contentType: 'post',
            postTitle: '{{title}}',
            postSlug: '{{slug}}',
            postId: '{{id}}',
            publishedDate: '{{published_at}}',
            author: '{{primary_author.name}}',
            tags: [{{#foreach tags}}'{{name}}'{{#has index=@last}}{{else}}, {{/has}}{{/foreach}}],
            {{/post}}
            {{#page}}
            contentType: 'page',
            pageTitle: '{{title}}',
            pageSlug: '{{slug}}',
            {{/page}}
            {{#is "home"}}
            contentType: 'home',
            {{/is}}
            {{#member}}
            memberStatus: 'logged-in',
            memberEmail: '{{email}}',
            {{/member}}
        };
    </script>

    {{ghost_head}}
</head>

Conditional Tracking by Content Type

{{!-- Load e-commerce tracking only for paid content --}}
{{#if @labs.members}}
    {{#has visibility="paid"}}
        <script>
            // Enhanced tracking for paid/premium content
            console.log('Paid content viewed: {{post.title}}');
        </script>
    {{/has}}
{{/if}}

Member-Specific Tracking

{{!-- Different tracking for members vs. visitors --}}
{{#if @member}}
    <script>
        // Member tracking
        console.log('Member:', '{{@member.email}}');
        console.log('Subscriptions:', {{json @member.subscriptions}});
    </script>
{{else}}
    <script>
        // Visitor tracking
        console.log('Anonymous visitor');
    </script>
{{/if}}

Data Privacy and Compliance

Ghost requires manual consent management implementation:

  • Custom Cookie Banner - Build using Ghost theme
  • Third-Party CMP - Integrate OneTrust, Cookiebot, or similar
  • Consent Mode - Implement Google Consent Mode v2
  • Member Privacy - Respect Ghost member privacy settings

Integration with CMPs

Ensure your tracking integrations respect user consent:

  • Conditional script loading based on consent status
  • GTM consent mode integration
  • Cookie categorization (necessary, analytics, marketing)
  • Opt-out mechanisms for each platform

Testing and Validation

Browser Extensions

  • Google Analytics Debugger - Console logging for GA hits
  • Meta Pixel Helper - Validate Facebook Pixel implementation
  • Tag Assistant - Debug Google tags (GA, GTM, Ads)
  • ObservePoint - Automated tag auditing

Ghost Testing

  • Preview Mode - Test changes before publishing
  • Test in Staging - Use Ghost staging environment (self-hosted)
  • Check with Different Member States - Test as logged-in/out, free/paid
  • Validate Post vs. Page - Ensure tracking works on all content types
  • Test Ghost Portal - Verify member signup/subscription tracking

Common Issues

See Troubleshooting → Tracking Issues for Ghost-specific debugging.

Performance Optimization

Script Loading Strategies

{{!-- Defer non-critical tracking --}}
<script defer src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>

{{!-- Async loading for independent scripts --}}
<script async src="https://connect.facebook.net/en_US/fbevents.js"></script>

{{!-- Preconnect to analytics domains --}}
<link rel="preconnect" href="https://www.google-analytics.com">
<link rel="preconnect" href="https://www.googletagmanager.com">
<link rel="dns-prefetch" href="//connect.facebook.net">

Conditional Loading by Content Type

{{!-- Only load membership tracking on member-gated content --}}
{{#has visibility="members,paid"}}
    <script>
        // Load membership analytics
    </script>
{{/has}}

Resource Hints

{{!-- In default.hbs head section --}}
<link rel="preconnect" href="https://www.google-analytics.com">
<link rel="preconnect" href="https://www.googletagmanager.com">
<link rel="dns-prefetch" href="//connect.facebook.net">

Ghost API Integration

Content API (Read-Only)

For headless Ghost implementations:

// Fetch posts with custom tracking
const api = new GhostContentAPI({
  url: 'https://yoursite.com',
  key: 'your-content-api-key',
  version: 'v5.0'
});

api.posts.browse({limit: 10})
  .then((posts) => {
    // Track content impressions
    posts.forEach(post => {
      gtag('event', 'content_view', {
        content_id: post.id,
        content_type: 'post'
      });
    });
  });

Admin API (Read/Write)

For server-side integrations:

// Create member and track signup
const admin = new GhostAdminAPI({
  url: 'https://yoursite.com',
  key: 'your-admin-api-key',
  version: 'v5.0'
});

admin.members.add({email: 'user@example.com'})
  .then((member) => {
    // Track member creation server-side
    fetch('https://www.google-analytics.com/mp/collect', {
      method: 'POST',
      body: JSON.stringify({
        client_id: member.uuid,
        events: [{
          name: 'member_signup',
          params: {member_id: member.id}
        }]
      })
    });
  });

Next Steps

Choose your integration path:

  1. Google Analytics 4 - Setup Guide
  2. Google Tag Manager - Installation Guide
  3. Meta Pixel - Implementation Guide
Back to top