How to setup Ghost analytics and session replay

Oct 11, 2024

Posted by

Danilo Campos

On this page

Adding PostHog using Ghost’s code injection
Further reading

With all the drama in the world of WordPress, it’s a great time to explore Ghost, a robust blogging and newsletter CMS. You can self-host Ghost on your own server, or lean on managed hosting from Ghost.org.

However you host, adding PostHog for web analytics, product analytics, and session replay is a quick process that gives you immediate insight about how people are finding your site, enjoying your writing, and exploring your archives. PostHog is free, so sign up and follow along.

Adding PostHog using Ghost’s code injection

Grab the PostHog snippet from your project settings:

HTML

<script>
    !function(t,e){var o,n,p,r;e.__SV||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}(p=t.createElement("script")).type="text/javascript",p.crossOrigin="anonymous",p.async=!0,p.src=s.api_host.replace(".i.posthog.com","-assets.i.posthog.com")+"/static/array.js",(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r);var u=e;for(void 0!==a?u=e[a]=[]:a="posthog",u.people=u.people||[],u.toString=function(t){var e="posthog";return"posthog"!==a&&(e+="."+a),t||(e+=" (stub)"),e},u.people.toString=function(){return u.toString(1)+".people (stub)"},o="init capture register register_once register_for_session unregister unregister_for_session getFeatureFlag getFeatureFlagPayload isFeatureEnabled reloadFeatureFlags updateEarlyAccessFeatureEnrollment getEarlyAccessFeatures on onFeatureFlags onSessionId getSurveys getActiveMatchingSurveys renderSurvey canRenderSurvey getNextSurveyStep identify setPersonProperties group resetGroups setPersonPropertiesForFlags resetPersonPropertiesForFlags setGroupPropertiesForFlags resetGroupPropertiesForFlags reset get_distinct_id getGroups get_session_id get_session_replay_url alias set_config startSessionRecording stopSessionRecording sessionRecordingStarted captureException loadToolbar get_property getSessionProperty createPersonProfile opt_in_capturing opt_out_capturing has_opted_in_capturing has_opted_out_capturing clear_opt_in_out_capturing debug".split(" "),n=0;n<o.length;n++)g(u,o[n]);e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]);
    posthog.init('<ph_project_api_key>', {api_host: 'https://us.i.posthog.com', person_profiles: 'identified_only'})
</script>

In your Ghost publication’s settings, click the settings button, labeled with a gear icon:

Ghost settings menu

Scroll toward the bottom of the sidebar, looking for Advanced, and select Code Injection. Open the code injection setting:

Code injection menu in Ghost

Paste the PostHog script into the Site header code block:

Ghost code injection settings

Click Save, and you’re all set. Explore your blog to generate some activity, then head to PostHog to see the results.

PostHog analytics dashboard

Hit the web analytics tab to see the basics, including your top-performing content in the paths report. Channels will show you high level traffic sources. Use the retention report to see how often readers are coming back once they find you.

Once set up, you can enable session replay in your project settings under Record user sessions to give you a look at real reader behavior through your site. Click its tab to explore replays.

How to setup Ghost analytics and session replay

Adding PostHog using Ghost’s code injection

Further reading

Product for Engineers

Comments