With a premium subscription, the cookie consent banner can be styled in a number of ways using the built-in templates and CSS styling, see Can I style the cookie consent banner?. However, if you prefer to build your own banner, which you can customize completely to your liking, that is possible, too (premium subscriptions only).
Before you start, please note that this requires some coding skills and knowledge of HTML, CSS and Javascript. You need to apply your own coding logic to how the banner looks and behaves, and we are not able to offer you individual support on custom built templates.
How do I get started with the custom template?
- Log in to your account https://manage.cookiebot.com/goto/login
- Go to the menu point ‘Settings’ and the tab ‘Dialog’
- From the ‘Template’ drop-down menu choose ‘Custom’ at the very bottom
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 API
If you prefer, you can use the Cookiebot API to trigger the relevant API functions. The API 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).
Comments
1 comment
Don't have coding skills and knowledge of HTML, CSS and Javascript. ? We have developed some custom banner designs you may like. You can further style these cookie banner designs to your look and feel. Have a look at https://cookiemagic.eu/cookiebot-custom-banner-designs/
Please sign in to leave a comment.