Ghost Integration Guide

Complete guide to integrate CallMeBack with Ghost

Setup time: 5-10 minutes

Difficulty: Easy

Compatible versions: Ghost 4.x, 5.x

Integrate CallMeBack with your Ghost blog to capture leads from newsletter signups, contact forms, and content engagement. Ghost powers thousands of professional publications and blogs worldwide.

Prerequisites

A CallMeBack account - Sign up here
Your CallMeBack integration code from your dashboard
Ghost site admin access
Ghost 4.x or 5.x installation
Access to Ghost theme files (for advanced integration)

Integration Methods

Code Injection

5 minutes Easy

Use Ghost's built-in Code Injection feature to add CallMeBack site-wide. This is the easiest and most reliable method.

Access Code Injection Settings

Navigate to Ghost admin settings to add custom code.

Log into your Ghost admin panel
Go to Settings (gear icon)
Click Code Injection
You'll see Site Header and Site Footer sections

Important Note

Code Injection is available on all Ghost plans, including self-hosted installations.

Add CallMeBack to Site Header

Insert your CallMeBack integration code in the Site Header section.

Click in the Site Header text area
Paste your CallMeBack integration code
Click Save
The code will be active immediately on all pages

<!-- CallMeBack Integration for Ghost -->
<script>
(function() {
  var script = document.createElement('script');
  script.src = 'https://widget.callmebackbutton.com/widget.js';
  script.setAttribute('data-account', 'YOUR_ACCOUNT_ID');
  script.setAttribute('data-ghost', 'true');
  script.setAttribute('data-blog', 'true');
  document.head.appendChild(script);
})();
</script>

Important Note

The data-ghost and data-blog attributes help optimize the widget for blogging platforms and content sites.

Configure for Content Sites

Optimize CallMeBack settings for blog and content-focused websites.

In your CallMeBack dashboard, enable 'Content Site' mode
Set up triggers for newsletter subscriptions
Configure timing for blog post engagement
Test on both blog posts and static pages

Important Note

Content site optimization helps capture leads at optimal moments during content consumption.

Theme File Integration

10 minutes Intermediate

Integrate CallMeBack directly into your Ghost theme files for maximum control and customization.

Access Theme Files

Download and modify your Ghost theme files.

In Ghost admin, go to Design
Click Change theme
Download your current theme
Extract the theme files for editing

Important Note

Always backup your theme before making modifications. Consider creating a custom theme to avoid losing changes during theme updates.

Modify default.hbs Template

Add CallMeBack code to your theme's main template file.

Open default.hbs in your theme folder
Locate the {{ghost_head}} helper
Add CallMeBack code just after this helper
Save the file

{{!-- Ghost Theme Template --}}
<!DOCTYPE html>
<html>
<head>
    {{ghost_head}}
    
    {{!-- CallMeBack Integration --}}
    <script>
    (function() {
        var script = document.createElement('script');
        script.src = 'https://widget.callmebackbutton.com/widget.js';
        script.setAttribute('data-account', 'YOUR_ACCOUNT_ID');
        script.setAttribute('data-ghost', 'true');
        script.setAttribute('data-blog', 'true');
        document.head.appendChild(script);
    })();
    </script>
</head>

Important Note

Placing code after {{ghost_head}} ensures it loads after Ghost's core scripts.

Upload Modified Theme

Upload your modified theme back to Ghost.

Zip your modified theme folder
In Ghost admin, go to Design
Click Change theme → Upload theme
Select your modified theme zip file
Activate the theme

Important Note

Test your site thoroughly after uploading a modified theme to ensure everything works correctly.

Post-Specific Integration

3 minutes per post Easy

Add CallMeBack to specific blog posts using Ghost's post-level code injection.

Edit Target Post

Open the blog post where you want to add CallMeBack.

In Ghost admin, go to your Posts
Click on the post you want to edit
Click the Settings gear icon (top-right)

Add Post-Level Code

Insert CallMeBack code in the post's code injection section.

Scroll down to Code Injection
Add your code to Post Header
Click Update to save
Publish or update your post

<!-- CallMeBack for this specific post -->
<script>
(function() {
  // Only load if not already loaded site-wide
  if (!window.callmebackLoaded) {
    var script = document.createElement('script');
    script.src = 'https://widget.callmebackbutton.com/widget.js';
    script.setAttribute('data-account', 'YOUR_ACCOUNT_ID');
    script.setAttribute('data-ghost', 'true');
    script.setAttribute('data-blog', 'true');
    script.setAttribute('data-post-specific', 'true');
    document.head.appendChild(script);
    window.callmebackLoaded = true;
  }
})();
</script>

Important Note

This method is useful for high-value content or specific landing pages where you want targeted lead capture.

Troubleshooting

Still having issues?

Can't find the answer you're looking for? Our support team is here to help with your integration.

Contact Support

Related Integrations

References & Official Documentation

Next Steps

Configure CallMeBack

Set up your business hours and timezone
Configure callback phone numbers
Set up email notifications
Add team members to your account

Advanced Features

Set up custom form templates
Configure lead scoring rules
Integrate with your CRM
Set up automated workflows

Need Help?

Our support team is here to help you with your integration.

Contact Support

Prerequisites

A CallMeBack account - Sign up here
Your CallMeBack integration code from your dashboard
Ghost site admin access
Ghost 4.x or 5.x installation
Access to Ghost theme files (for advanced integration)

Integration Methods

Code Injection

5 minutes Easy

Use Ghost's built-in Code Injection feature to add CallMeBack site-wide. This is the easiest and most reliable method.

Access Code Injection Settings

Navigate to Ghost admin settings to add custom code.

Log into your Ghost admin panel
Go to Settings (gear icon)
Click Code Injection
You'll see Site Header and Site Footer sections

Important Note

Code Injection is available on all Ghost plans, including self-hosted installations.

Add CallMeBack to Site Header

Insert your CallMeBack integration code in the Site Header section.

Click in the Site Header text area
Paste your CallMeBack integration code
Click Save
The code will be active immediately on all pages

<!-- CallMeBack Integration for Ghost -->
<script>
(function() {
  var script = document.createElement('script');
  script.src = 'https://widget.callmebackbutton.com/widget.js';
  script.setAttribute('data-account', 'YOUR_ACCOUNT_ID');
  script.setAttribute('data-ghost', 'true');
  script.setAttribute('data-blog', 'true');
  document.head.appendChild(script);
})();
</script>

Important Note

The data-ghost and data-blog attributes help optimize the widget for blogging platforms and content sites.

Configure for Content Sites

Optimize CallMeBack settings for blog and content-focused websites.

In your CallMeBack dashboard, enable 'Content Site' mode
Set up triggers for newsletter subscriptions
Configure timing for blog post engagement
Test on both blog posts and static pages

Important Note

Content site optimization helps capture leads at optimal moments during content consumption.

Post-Specific Integration

3 minutes per post Easy

Add CallMeBack to specific blog posts using Ghost's post-level code injection.

Edit Target Post

Open the blog post where you want to add CallMeBack.

In Ghost admin, go to your Posts
Click on the post you want to edit
Click the Settings gear icon (top-right)

Add Post-Level Code

Insert CallMeBack code in the post's code injection section.

Scroll down to Code Injection
Add your code to Post Header
Click Update to save
Publish or update your post

<!-- CallMeBack for this specific post -->
<script>
(function() {
  // Only load if not already loaded site-wide
  if (!window.callmebackLoaded) {
    var script = document.createElement('script');
    script.src = 'https://widget.callmebackbutton.com/widget.js';
    script.setAttribute('data-account', 'YOUR_ACCOUNT_ID');
    script.setAttribute('data-ghost', 'true');
    script.setAttribute('data-blog', 'true');
    script.setAttribute('data-post-specific', 'true');
    document.head.appendChild(script);
    window.callmebackLoaded = true;
  }
})();
</script>

Important Note

This method is useful for high-value content or specific landing pages where you want targeted lead capture.

Troubleshooting

Still having issues?

Can't find the answer you're looking for? Our support team is here to help with your integration.

Contact Support

References & Official Documentation

Next Steps

Configure CallMeBack

Set up your business hours and timezone
Configure callback phone numbers
Set up email notifications
Add team members to your account

Advanced Features

Set up custom form templates
Configure lead scoring rules
Integrate with your CRM
Set up automated workflows

Ghost Integration Guide

Prerequisites

Integration Methods

Code Injection

Access Code Injection Settings

Important Note

Add CallMeBack to Site Header

Important Note

Configure for Content Sites

Important Note

Theme File Integration

Access Theme Files

Important Note

Modify default.hbs Template

Important Note

Upload Modified Theme

Important Note

Post-Specific Integration

Edit Target Post

Add Post-Level Code

Important Note

Troubleshooting

Still having issues?

Related Integrations

References & Official Documentation

Next Steps

Configure CallMeBack

Advanced Features

Need Help?

Ghost Integration Guide

Prerequisites

Integration Methods

Code Injection

Access Code Injection Settings

Important Note

Add CallMeBack to Site Header

Important Note

Configure for Content Sites

Important Note

Theme File Integration

Access Theme Files

Important Note

Modify default.hbs Template

Important Note

Upload Modified Theme

Important Note

Post-Specific Integration

Edit Target Post

Add Post-Level Code

Important Note

Troubleshooting

Still having issues?

Related Integrations

References & Official Documentation

Next Steps

Configure CallMeBack

Advanced Features

Need Help?

Setup a Demo

Thank you for scheduling a demo!

Request a Call Back

Thank you for your request!

Join Our Waitlist

Welcome to the waitlist!