Create a custom cookie banner using Hubspot

How to use the Hubspot integration to show a custom cookie banner on your Flipsnack profile and flipbooks

If you have a custom domain and you want to replace our cookie policy banner with a custom one, you have multiple options.

A short while ago I made another article explaining how to implement a custom cookie banner using Cookie Pro by OneTrust. Hubspot also has a built-in consent manager that allows you to add that cookie banner via Tag Manager. The process is simpler than in my previous article and can offer similar results.

If you haven't already installed the Hubspot tracking code, I suggest you start there first since that is the main connection between your site and the Hubspot tools.

Also, make sure that you don't have any other cookie banners active on your website since that would conflict with this implementation.

a cookie banner example

Here’s how to integrate the cookie banner:

  • In the Hubspot, settings page go to Privacy & Consent and select the Cookies tab.

  • Customize your banner and policy and when you are finished copy the Cookie Settings Button code at the bottom of the page.

  • Go to your Google Tag Manager and in the same container create a new Custom HTML tag and paste the code for the cookie banner.

  • Set the trigger to include all pages and publish the container.

     

cookie banner integration

And there you have it. The cookie banner should show up on your profile page and any subsequent flipbooks you have.

Example of how a cookie policy looks like on a flipsnack profile

Advanced targeting & Geolocation

In case your cookie policy needs are more advanced and you wish to display different policies for different countries or on specific flipbooks you can do that by adding a new policy.

  • Go to Settings and click on Privacy & Consent.

  • Then click on the Cookies tab.

  • Press the Add policy button and select the targeting criteria for it.

customized cookie policy created in hubspot

This is useful if, for example, you have a flipbook written in a certain language and you want the policy to match it. So if you want your cookie policy to appear on a specific flipbook you can paste the domain and URL path in Hubspot.

Let's make a Portuguese version of our cookie banner and make it appear on a single flipbook as an example. For this we first need the URL path from our flipbook, meaning the part of the link that comes after the domain. In the example below the domain is "flipsnack-articles@razvanpop.com" and the path of my flipbook is "automation-task-c3f2j5nd1j".

cookie policy settings in hubspot

And if you need to match the country as well, letting the generic policy appear for users from outside that country (Brazil in our example), we can add a filter for that as well.

The cookie banner should be online. If you want to test it out I would suggest opening your flipbook in a new tab and pressing Shift + F5 to make sure you load the latest content of your page.

example of a customized cookie banner on a flipbook

Further reading:

Customize your Hubspot cookie tracking settings (Hubspot Knowledge Base)

For more ways to use Hubspot together with Flipsnack also visit: