When GEO IP is enabled in Complianz, the type of Cookie Banner shown to the visitor (opt-in/opt-out) will depend on the location from which a user visits your website. For instance, the opt-in banner will be shown when a user visits the website from a country within the European Union. For visitors from the United States, the opt-out banner will be displayed.
There are situations imaginable where you would like to solely display a text to users that visit from an opt-in region, or when the visitor has yet to give his consent for the “Marketing” category. Complianz provides body classes that you can use to dynamically apply properties to an element, based on the consent type or region that Complianz detects.
Using the Complianz body classes to conditionally apply properties
Complianz provides the following classes that you can apply to your HTML elements. These classes are dynamically updated based on the status of Complianz, allowing you to attach CSS properties to this HTML element based on the Region and Consent Type.
Class for HTML element | Classes to apply CSS to |
cmplz-consenttype | cmplz-optin, cmplz-optout |
cmplz-status-category | cmplz_functional, cmplz_preferences, cmplz_statistics, cmplz_marketing |
cmplz-region | cmplz-eu, cmplz-ca, cmplz-us, cmplz-uk, cmplz-other |
cmplz-bannertype | cmplz-tcf-banner |
Assume that we have a <div> element with the class “cmplz-status-consenttype” attached:
We can now hide/show this element based on the consent type with the following CSS:
Only show “Manage Consent” in Opt-in regions
It is possible to only show the “Manage Consent” button to users visiting from an opt-in region, instead of both opt-in and opt-out regions.
To do so, we will hide the class responsible for the Manage Consent button by default, unless the status is “opt-in”:
Only show “Manage Consent” when TCF is Enabled
By using the cmplz-tcf-banner class, we can show the Manage Consent button when TCF is enabled, but keep it hidden in other cases.