Styling Consent Manager

  • Updated

Tailor your Consent Manager's appearance within the Customization tab. Customize the dialog, widget, and drawer to align with your website's design. For advanced customizations, utilize CSS with a comprehensive list of Osano Classes.

Screenshot 2024-01-13 at 1.08.09 PM.png

The Customization Tab

The Customization tab allows you to customize certain aspects of your Consent Manager's appearance.

From here, you can customize various aspects of the consent manager including: 

  1. The Dialog (the cookie popup)
  2. The Widget (the icon that triggers the drawer)
  3. The Drawer (the storage preferences center). 

Customization settings

From "Settings" you can choose: 

  • If the dialog is a box or a banner
  • The positioning of the dialog, widget, and drawer
  • The timer settings for dialogs that appear "On a Timer" (ex. Canada, Russia, etc.)
  • The coloration of various aspects of the dialog and drawer (via premade theme or color selector)

Use the "Show/Hide Dialog", "Show/Hide Drawer", and "Show/Hide Widget" buttons to view a preview of the various pieces of consent manager based on your selected settings. 

Use the world map to see how your cookie popup (dialogue) and storage preferences (drawer) will look in different countries by clicking on individual countries or by changing the "Locale" dropdown. 

(Note: Osano will geolocate the end-user and provide them with the cookie popup that is most compliant in their location. The language displayed will be determined by the end-user's browser preferences. Selecting a location on the map will show the popup style in that location as well as the most common language in that location.)   


Screenshot 2023-08-03 at 11.57.15 AM


Use the "Enter Full Screen" button to view your style choices in a full-screen mode. This will allow you to get a better idea of how the dialog and drawer will look in real-time and give a clear indication of the scale and potential user experience. 




If there are specific customizations that you would like to employ on your consent manager overlay, you can do this using CSS. View a full list of Osano Classes.