Cookiebot コンソール上で行える同意バナーデザインのカスタマイズについて紹介します。
コンソールを開き、Dialogタブを開くと以下のようなカスタマイズオプションが利用可能です。
左欄の「Preview」をクリックすると、同意バナー及び宣言文のプレビューが表示されます。 
(1) Template | 同意バナーの表示位置と表示のされ方
(a) Top または Slide down
Top: 画面上に表示
Slide down: 画面上に表示（画面上からスライドダウンの動作付きで表示）
(b) Bottom または Slide up
Bottom: 画面下に表示
Slide up: 画面下に表示（画面下からスライドアップの動作付きで表示）
(c) Push down
画面上に表示（画面上から画面全体が押し下げられて表示）
(d) Pop up
ポップアップとして画面中央に表示
(e) Overlay
ポップアップとして画面中央に表示（ウェブサイト自体はグレーアウト）
(f) Custom
HTML、CSS や JavaScript にてカスタムデザインが可能
(2) Method | 同意の取り方
(a) Active Consent（非推奨）
同意バナーを無視し、ウェブサイトをスクロールした場合は自動的に同意したものとみなす同意取得方法
(b) Explicit Consent（推奨）
同意ボタンが押されるまで、各ページに同意バナーが表示され続ける同意取得方法
(3) Type | 同意ボタン及びチェックボックスの表示のされ方
(a) Accept only / Decline only (非推奨)
同意または非同意のみのボタンのみの表示
ユーザーのOpt-inとならないため非推奨
(b) Accept/Decline
「Use necessary cookies only」と「Allow all cookies」の二択
(c) Multilevel (推奨)
すべてのチェックボックスが表示され、カテゴリー毎にオプトインが可能
「(5) Checkbox default mode 」にてチェック済みのカテゴリーを指定可能
(d) Inline multilevel
右下の「Show details」をクリックすると、クッキーの詳細とともにチェックボックスが表示され、カテゴリー毎のオプトインが可能
↓
(4) Theme | 背景色
(a) White
白の背景に黒字
(b) Dark
黒の背景に白字
(c) Custom
Customを選択すると、Costom Coloursとして、以下のような5つの部分の色を指定することが可能
(5) Checkboxes default mode | チェックボックスのデフォルト設定
(3) Type にて Multilevel または Inline multilevel を選択した場合は、各カテゴリーボックスのチェックのデフォルト設定が可能
(6) Logo | ロゴの表示有無
同意バナーの左側にロゴを表示したい場合は「Display logo on the consent dialog」にチェックを入れ、対象画像をアップロード可能
(7) Distribution | 同意バナーの表示地域及び国の指定
(a) All visitors
全てのユーザーに表示
(b) Visitors from the EU only
EU圏からのユーザーにのみ表示
※EU Only のバナー表示をEU圏外から確認する方法としては、お使いのブラウザのDeveloper コンソールをお開き頂き、下記の JavaScript を入力頂くと Geolocation を無視して同意バナーを表示させることができます。
javascript:void function(){Cookiebot.show(‘true’)}();
また、以下のようにブラウザのブックマークとして登録すると容易にご確認いただくことができます。
(c) Visitors from specific countries and/or regions
特定の国または地域のユーザーのみに表示
特定の国及び地域のチェックボックスにチェックすることでその対象にのみ表示可能
