Can I build my own fully customized cookie consent banner?

1. Log in to your account https://manage.cookiebot.com/goto/login
2. Go to ‘Settings’ and click the ‘Banner’ tab
3. From the ‘Banner template’ drop-down menu select ‘Custom’

What can I use to build my banner?

1. HTML, CSS and JavaScript

When you have chosen the ‘Custom’ template, you will see examples of the HTML definitions, the CSS and the JavaScript functions you can use to build your banner (do remember to scroll within each one to reveal more lines of code).

You can change the name of functions to show and to hide the cookie consent banner, if you would like.

Remember to save your settings (tick mark in the blue bar on the left-hand side).

2. HTML placeholders and naming conventions

By clicking the small grey question mark on the upper right corner, you will get access to the HTML placeholders and naming conventions you can use. Scroll to see all of them.

The HTML placeholders you use will dynamically be replaced with the relevant content from your Cookiebot configuration.

Further down you will find ID attribute values you can use on your HTML elements for various button events.

Remember to save your settings (tick mark in the blue bar on the left-hand side).

3. Cookiebot SDK

If you prefer, you can use the Cookiebot SDK to have access to Cookiebot methods and properties. The SDK is available here: https://www.cookiebot.com/goto/developer

Remember to save your settings (tick mark in the blue bar on the left-hand side).

1. Log into the Admin.
2. Select "Configuration" from the left-hand menu.
3. Click "Templates" in the upper left corner.
   
4. Check the option labeled "Custom code" and click the "Next >" button.
   
5. You can now craft your banner using HTML, CSS, and JavaScript.
   
6. Remember to save your changes using the "Save changes" button in the upper right corner.

To automatically hook up button events on your HTML elements, use one or more of the following ID-attribute-values on the relevant HTML elements. Alternatively you must trigger the appropriate Cookiebot API-function when the user clicks your element to submit a consent.

Cookiebot SDK

If you prefer, you can use the Cookiebot SDK to have access to Cookiebot methods and properties. The SDK is available here: https://www.cookiebot.com/goto/developer