Select a Template

There are currently three templates available:

• Swift
  Our newest banner template with a modern, responsive design.
• Elemental
  The original banner template with our classic design.
• Custom
  This option allows you to create you own custom banner using HTML, CSS, and JavaScript.
  Knowledge of these languages is required to be able to create a custom banner. You may consider reaching out to some of our resellers if you do not have an in-house front-end developer.

Choose a Consent Method

You can choose between the following two consent methods:

• Active Consent
  Also referred to as Implied Consent. When this consent method is chosen, any interaction with the page, for example scrolling or clicking links will trigger an opt-in.
  Please note that this is not a GDPR compliant consent method!
• Explicit Consent
  Submitting consent requires clicking a button in the banner. Consent will not be submitted if a visitor ignores the banner and continues interacting with the page.

Choose the banner’s position

There are several ways to display the banner. There are essentially two display modes: edge-to-edge and pop-up.
The Swift banner is responsive and will adjust according to the available screen width.

This means that if you selected the "Top" / "Slide up" or "Bottom" / "Slide down" template and the screen width is greater than 1280px, the banner will be displayed in edge-to-edge mode:

However, if the screen width is below 1080px the banner will automatically switch to the pop-up style:

If the screen width is below 600px, a mobile banner will be displayed instead:

These are the available options:

• Top
  An edge-to-edge banner displayed at the top of the screen on top of the website.
• Bottom
  An edge-to-edge banner displayed at the bottom of the screen on top of the website.
• Push down
  An edge-to-edge banner which slides in from the top, pushing the content of the page down.
• Slide down
  An edge-to-edge banner displayed which slides down from the top on top of the page.
• Slide up
  An edge-to-edge banner displayed which slides in from the bottom on top of the page.
• Pop up
  A pop-up style banner that is displayed in the center of the screen on top of the page.
• Overlay
  A gray semi-transparent overlay which prevents interaction with the page with a pop-up style banner that is displayed in the center of the screen.
  This banner type essentially forces the visitor to submit their consent choices before being able to interact with the page.

Choose a banner Type

This setting controls the actual appearance and behavior of the banner.

Here is an overview of each type:

Decline Only

This banner type can only be paired with the Active Consent method.
If the visitor clicks the button, only necessary cookies are set. If the user ignores the banner and interacts with the page instead, a full opt-in is submitted.

Accept Only

This is a notification type banner. The visitor has no opt-out option, but cookies will not be set unless the “Allow all cookies” button is pressed.
Essentially the visitor can choose to accept cookies or leave the website.

Accept/Decline

An “all or nothing” type banner. The visitor can accept or reject all non-necessary cookies, but cannot submit a granular choice, where certain categories are accepted/rejected.

Multilevel

The default banner type. This banner can be configured to have one (accept only), two (decline and accept), or three buttons (decline, selection, accept).
This banner type has toggles to make a granular choice about which cookies are accepted.
When the two- or three-button model is selected, the selection button’s text is responsive; If no toggles are enabled, the button will read “Use necessary cookies only”. If one or more toggles are enabled, the button will read “Allow selection” instead.

Inline Multilevel

Like the Multilevel type, but the toggles are not displayed on the first level. The active categories can only be viewed and changed on the second level, which can be accessed by clicking the “Customize >” button or by clicking the “Show details” tab.

Do Not Sell (Opt-in)

This banner type is specifically designed for CCPA.
Checking the checkbox labelled “Do Not Not Sell My Personal Information” will withdraw previously submitted consent and will allow necessary cookies only.

Choose the number of Buttons

This is only available for Multilevel and Inline Multilevel type banners.
There are three options:

• “Ok”
  Essentially identical in functionality to “Allow Selection”. Categories that are toggled “on” are accepted when the button is clicked.
• “Allow all/selection”
  The left button will submit consent for the selected categories and is responsive. For the Multilevel banner type: The caption will read “Use necessary cookies only” when all toggles are “off” and “Allow selection” when one or more toggles are “on”.
  The caption of this button will read “Customize >” on the Inline Multilevel banner type, regardless of the selection.
  The right button will accept cookies in all categories.
• “Reject all / Selection / Allow all”
  The left button will accept necessary cookies only, the middle button will allow cookies in the selected categories, and the right button will accept all cookies.

Set Checkboxes default mode

Here you can set which toggles will be enabled by default.
Keep in mind though that after the Planet49 ruling it was determined that under GDPR, pre-checked categories are not allowed.

Select a Theme

You can choose the following themes:

• White
  A white banner recommended for use against a dark colored website.
• Dark
  A black banner recommended for use against a bright colored website.
• Custom
  Allows you to use colors of your own choosing. Each button can be assigned individual color schemes.

Here is are examples of the White and Dark themes respectively:

Customizing the color scheme

The Swift banner allows far more customization than the previous "Elemental" banners did.

On the body of the banner, you can select colors the following:

• Background
  Sets the background color of the banner.
• Text
  Sets the color of all texts within the banner. This is also applied to disabled toggles and the "powered by Cookiebot logo.
• Highlight
  Sets the color of all links and active toggles in your banner.
• Shade
  Sets the color of all borders and the locked toggle on your banner

Add your logo

To finish up your banner you can add your company logo.
The following formats are supported: JPG, JPEG, PNG, GIF, BMP, TIF.

^{* Currently only square logos (1:1) are supported.
Using a rectangular logo is currently not supported. We are working on being able to offer this option for your logo in the near future.}

Select a banner layout

The first thing to determine should be what the consent dialog should look like and where it should be displayed on your website when a visitor needs to asked for consent.

To do this expand the 'Layout' section on the 'Design' tab.

Here you have the following options:

• Dialog
  Dialog is a small window in the middle of the screen. With this option you can choose an additional style effect; Overlay. Adding this effect put a semi transparant overlay over the website to call extra attention to the banner and to avoid being able to interact with the website without submitting consent choices.
  

  

• Bar
  A bar at the top or bottom of screen spanning the full with of the window.
  You can choose whether the bar appear at the top or bottom of the page and as an additional style effect you can select whether the bar simply is displayed, or slides into view when the banner loads.
  

  

  The Cookiebot banner is responsive, so for screens narrower than 1280px the bar layout automatically converts to the dialog layout. If the screen width is below 600px, the dialog scales down even further and a mobile banner will be displayed instead.

  

Design

Now that you have selected how and where the banner should be displayed, you can focus on the color scheme.
To do this you can select themes.

Theme

• Light
  This theme is black text on a white back ground, with dark blue accents. Well suited for a website in a bright color scheme.
• Dark
  This theme is white text on a black background, with light blue accents. This theme is best suited for websites with a dark color scheme.
• Custom
  Here you can customize the banner- and button colors. This allows you to make the banner fit seamlessly into your website's color scheme.
  This is a Premium feature.

Here is are examples of the White and Dark themes respectively:

Button styles

You can also adjust how the button should look.
The following options are available to you:

• Default
  A solid opt-in and outlined granular- and opt-out buttons.
  This is somewhat like CTA (call to action) buttons, where the option you prefer is used attracts more attention.
  Opt-out Granular Opt-in
• Solid
  All three buttons are of equal weight with the accent color as a background color.
  Opt-out Granular Opt-in
• Outline
  All three buttons are of equal weight with the accent color as an outline color.
  Opt-out Granular Opt-in

Logo

You can add your own company logo to the top left corner of the banner. If you don't add your logo the a default image is displayed that resembles an Oreo cookie.
The following filetypes are supported: jpg, jpeg, gif, png, svg

Compliance

You can choose between the following two consent methods:

• Active Consent
  Also referred to as Implied Consent. When this consent method is chosen, any interaction with the page, for example scrolling or clicking links will trigger an opt-in.
  
  This is not a GDPR compliant consent method!
• Explicit Consent
  Submitting consent requires clicking a button in the banner. Consent will not be submitted if a visitor ignores the banner and continues interacting with the page.

Choose a banner Type

This setting controls the actual appearance and behavior of the banner.

Here is an overview of each type:

Multilevel

The default banner type. This banner can be configured to have one (accept only), two (decline and accept), or three buttons (decline, selection, accept).
This banner type has toggles to make a granular choice about which cookies are accepted.
When the two- or three-button model is selected, the selection button’s text is responsive; If no toggles are enabled, the button will read “Use necessary cookies only”. If one or more toggles are enabled, the button will read “Allow selection” instead.

Accept Only

This is a notification type banner. The visitor has no opt-out option, but cookies will not be set unless the “Allow all cookies” button is pressed.
Essentially the visitor can choose to accept cookies or leave the website.

Accept/Decline

An “all or nothing” type banner. The visitor can accept or reject all non-necessary cookies, but cannot submit a granular choice, where certain categories are accepted/rejected.

Inline Multilevel

Like the Multilevel type, but the toggles are not displayed on the first level. The active categories can only be viewed and changed on the second level, which can be accessed by clicking the “Customize >” button or by clicking the “Show details” tab.

Do Not Sell (Opt-in)

This banner type is specifically designed for CCPA.
Checking the checkbox labelled “Do Not Not Sell My Personal Information” will withdraw previously submitted consent and will allow necessary cookies only.

Choose the buttons

This is only available for Multilevel and Inline Multilevel type banners.
There are three options:

• “Reject all / Selection / Allow all”
  The left button will accept necessary cookies only, the middle button will allow cookies in the selected categories, and the right button will accept all cookies.
• “Allow all/selection”
  The left button will submit consent for the selected categories and is responsive. For the Multilevel banner type: The caption will read “Use necessary cookies only” when all toggles are “off” and “Allow selection” when one or more toggles are “on”.
  The caption of this button will read “Customize >” on the Inline Multilevel banner type, regardless of the selection.
  The right button will accept cookies in all categories.
• “Ok”
  Essentially identical in functionality to “Allow Selection”. Categories that are toggled “on” are accepted when the button is clicked.

Set Checkboxes default mode

Here you can set which toggles will be enabled by default.
Keep in mind though that after the Planet49 ruling it was determined that under GDPR, pre-checked categories are not allowed.

Display a close icon

This gives you the option to display a close (X) icon in the upper right corner, as is required by some local legislations.

Distribution

Here you can define in which regions you want your banner to be displayed. Visitors from regions outside of the specified regions will not be asked for consent and all tracking will be allowed by default instead.

You have the following options:

• All visitors
• Europe only
• Per continent → part of the continent → country / state