Launch Brevz Application

Ghost Integration

A guide to integrate Brevz into a Ghost blog


This guide will help you setting up Brevz with your Ghost blog. You'll have to add some files to your theme.

If you have some trouble with this guide, you can come to our slack to ask questions or send us a mail at support@brevz.io.

This tutorial walks you through installing and configuring Brevz on your blog.

To do this tutorial you'll need a Brevz account, do not worry, Brevz got a free tier. If you don't have an account yet, create one here.

Of course you'll also need a ghost blog, and ghost got a free tier too.

Create your project

Follow this guide to create a new project.

Integrate it

Modify your theme

For Ghost users, you need to modify your existing theme to add the files necessary for the integration of Brevz.

Go to Settings > Theme and hit the download button.

Theme downloadHit that download button!

Follow instructions from the Integration Tab and download the provided manifest.json and sw.js.

Upload them to your root folder of your theme. If you already have a sw.js inside your theme, just copy at the end of your existing sw.js our sw.js. If you already have a manifest.json inside your theme, just merge our with yours.

Upload your theme to ghost and activate it!

Inject Brevz bundle with Ghost injection

Ghost allows you to inject code into the top and bottom of your theme files without editing them. This allows for quick modifications to insert useful things like tracking codes and meta tags.

We will add our Brevz bundle here, just go to Settings and Code Injection and add to the Site Header the code provided by the Integration Tab.

You may have to refresh the page twice to see Brevz working this is due to internal caching.

Create a custom hook to re-engage visitors after 15 minutes when they didn't finish their article

With the integration of Ghost, we add some additional data for each visitor to show the power of our targeting tools.

Example of visitor data for a ghost blogExample of visitor data for a ghost blog

We will add properties to know the last article read, and to know if the visitor has finished it, we also make a comparison to know if the visitor has already read the article before. In this data, there are only browsing data, and they will allow us to set up a hook that will send a notification to finish the article he was reading if he did not finish it.

An article is considered finished when the visitor has exceeded 80% of the site scroll.

To do this, we will start by creating a segment that will target visitors who have not finished an article and who have not been on the site for 15 minutes (A duration ISO 8601):

Example of segmentExample of segment

We will create our notification template now with the link ${custom.lastpost_link}, the title ${custom.lastpost_title} and finally a little message to tell it to come back.

Example of templateExample of template

And finally we will create the hook that will allow us to trigger all this.

Example of hookExample of hook

And that's it! After 15 minutes our notification is here!

Example of notificationExample of notification