The new banner is structured in HTML and CSS only. This means, in theory, you can make anything you want. But for more rigorous changes you will need some knowledge of CSS.
I found a cool banner, what now?
Let’s say you have found a banner that looks completely different from the default templates available in Complianz. Can you still create the cool banner you’d like? Yes, you can. The below example is from a client who asked us if we could create this banner in CSS, so she can use it on her websites. So we did.
If you want to challenge us. Leave us a support ticket! We will gladly take you up on it.
Changing the default Complianz banner to the above example in two steps
1. Cookie Banner Settings
- You will need to start in the back-end under Cookie Banner settings and change the texts to the desired text. This is important, as the width of the banner in Complianz is calculated on your button texts.
- Change the template to Save Preferences. This will make sure that the categories are visible by page load.
- Change to the desired colours
- Proceed to enable or disable the required elements. In this case, the button to save preferences, category descriptions are disabled and the title is enabled.
- You can choose to use capslock for text in the back-end or transform this with CSS after.
- The icon is loaded with dash icons, make sure this default library in WordPress is loaded. You can use Font-Awesome as well.
- The width is done with CSS, as we need to force to stack the buttons and calculate the width later.
2. Custom CSS
Add the below CSS, tweak it if needed. That’s it!
