How to add a Privacy Controls and Cookie Solution to Ghost

Built your website on Ghost and need to manage cookies? In this guide, you’ll learn when you need a cookie consent management system CMP or a cookie policy for Ghost and how to add iubenda’s Privacy Controls and Cookie Solution to your Ghost site.

Jump directly to How to add iubenda’s Privacy Controls and Cookie Solution to your Ghost site.

Yes, and here’s why.

If you have EU-based users and your website uses cookies (which it most likely does), you need to manage cookie consents according to the ePrivacy Directive and GDPR. This means you need to block cookie scripts and similar technologies until the user gives consent.

Also, for the consent to be considered valid, you need to make certain disclosures via a cookie banner and link to a more detailed cookie policy. See our getting started guide.

Need to add a privacy policy to your Ghost site? See the Ghost privacy policy integration guide.

What the solution supports

When you embed the Privacy Controls and Cookie Solution on your Ghost site, you get access to the full iubenda cookie management platform:

Before adding the cookie banner, generate a cookie policy for your Ghost site. Head over to your iubenda dashboard and click on [Your website] > Privacy and Cookie Policy > Edit. Add each service your site uses (e.g. Google Analytics, embedded videos, social buttons) so that your cookie policy accurately reflects your data processing activities.

Once your cookie policy is ready, the Privacy Controls and Cookie Solution will automatically link to it from your cookie banner.

Generate a cookie policy in the iubenda dashboard

If you already host your cookie policy at a custom URL, you can link to it manually in the Privacy Controls and Cookie Solution settings under Embed > Cookie Policy URL.

Not sure what privacy documents you need for your Ghost site? Take this quick quiz to see which laws apply to you and your business.

Once you’ve generated and customized your Privacy Controls and Cookie Solution, follow these steps to integrate it with your Ghost website:

First, head over to your iubenda dashboard and click on [Your website] > Privacy Controls and Cookie Solution > Embed.

How to add the Privacy Controls and Cookie Solution to Ghost

Then click Copy to copy your Privacy Controls and Cookie Solution snippet.

How to add the Privacy Controls and Cookie Solution to Ghost

Now, head over to your Ghost account, and on the bottom left of your screen click on the settings icon.

How to add the Privacy Controls and Cookie Solution to Ghost

Once you are in your settings, scroll down to “Advanced” and select Code injection.

How to add the Privacy Controls and Cookie Solution to Ghost

Scroll down until you find “Site Header”, paste your iubenda snippet in the box below, and click Save in the top right-hand corner of your screen.

How to add the Privacy Controls and Cookie Solution to Ghost

Few categories of cookies are exempt from the consent requirement. Therefore, almost all scripts that install or can install cookies must be blocked before consent is obtained.

Simplify your cookie-blocking process with auto-blocking

There’s a simpler option available for the prior blocking of cookies and trackers. Our auto-blocking feature automates the process, saving you time and effort.

If you prefer to manually tag your scripts that install or may install cookies, you can still follow the process below for step-by-step instructions and practical examples. However, we highly recommend considering the auto-blocking feature for a more streamlined approach.

Learn more about auto-blocking and how it can simplify your cookie-blocking process.

How to implement prior blocking via manual tagging on your Ghost site

Manual tagging is the method of prior blocking we’ll be using for the tutorial below. You can view other methods here.

To set up prior blocking, you need to make some minor changes to your site’s scripts. Here’s what to do:

  1. Identify the script/iframe for any additional services running on your website (e.g., Twitter follow button)
  2. Add some simple text to the HTML code (we’ll show you how below)
  3. Save

In this tutorial, we are going to block a Twitter follow button.

Not sure which services you need to block? If you’re using a cookie policy generated by iubenda, the services listed in your cookie policy are most likely the ones you need to modify now.

In your Ghost dashboard, find the script you need to modify (simply search for the service you want to block, in this case, the Twitter follow button).

Then click on the Edit icon to open the code editor.

Now, we’re going to change the script. To do this, we will make 3 simple changes:

  • Add this class: _iub_cs_activate to the script tags, and change the “type” attribute from text/javascript to text/plain
  • Replace the src with data-suppressedsrc or suppressedsrc
  • Specify the categories of the scripts/iframes with a special comma-separated data-iub-purposes attribute, e.g. data-iub-purposes="2" or data-iub-purposes="2, 3"

More about categories and purposes

Purposes are your legal reasons for processing the particular type of user data. Different scripts on your site will fall into different categories and serve different purposes. For example, Google Analytics may be used for Measurement, while the Pinterest button may be used for Experience (Purpose 3 below). Purposes are grouped into 5 categories each with an id (1, 2, 3, 4, and 5):

  • Necessary (id: 1)
  • Functionality (id: 2)
  • Experience (id: 3)
  • Measurement (id: 4)
  • Marketing (id: 5)

For even more detailed info on categories and purposes, see our guide here.

Let’s take the Twitter follow button as an example:

We need to 1. Add the class and change the “type” attribute, 2. replace the src and 3. specify the categories.

The code structure should look like this:

Script modification example for prior blocking
<p>Twitter follow button:</p>

        <!-- please note type="text/plain" class="_iub_cs_activate" data-suppressedsrc="..." (manual tagging) and data-iub-purposes="3" (per-category consent) -->
<a href="https://twitter.com/iubenda" class="twitter-follow-button" data-show-count="false">Follow @iubenda</a>
  <script async type="text/plain" class="_iub_cs_activate" data-suppressedsrc="https://platform.twitter.com/widgets.js" data-iub-purposes="3" charset="utf-8"></script>

Now that you’ve made your changes, simply hit save, and you’re done.

Not sure if you’ve set up correctly? Check out the live example and FAQs below.

Live example

This is an example that shows everything we have described above. You can use this CodePen as a guide to see what happens before and after blocking scripts via manual tagging.

(see the example)

To demonstrate the cookie blocking feature, we’ve embedded a YouTube video and a Twitter follow button:
Follow @iubenda

Both scripts are blocked through manual tagging. Since both the YouTube video widget and the Twitter follow button are part of the Experience purpose (id 3), we’ve added data-iub-purposes="3" to their scripts so that the Privacy Controls and Cookie Solution can properly identify them for release.

Click on the Accept button, or just activate the “Experience” toggle, to release these scripts (refresh the page to return to the starting point).

How can I tell if I’ve set prior blocking up properly?

As you can see in the CodePen example, the YouTube and Twitter scripts do not load if you do not consent. (You can test this again by opening this link in incognito mode in your browser.)

After you have saved, open your site in incognito mode and check if the scripts you have blocked via manual tagging stay blocked until you consent.

For other blocking options, see Google Consent Mode as an alternative to prior blocking, Google Tag Manager to simplify the blocking of cookies, or the IAB Transparency & Consent Framework and how to enable it.

Manage cookie consent for your Ghost website

Generate a cookie banner

See also