Didomi - Developers documentation
  • Introduction
  • SDKs
    • Introduction
    • Web SDK
      • Getting started
      • Tags and vendors management
        • Tags management
          • Events & Variables
            • Deprecated
            • Custom events
          • Tag managers
            • Adobe Launch/DTM
            • Eulerian
            • Google Tag Manager
              • Configure the Didomi / GTM integration
              • Didomi's GTM template
            • Tealium
            • Other tag managers
        • Custom Didomi <script> tags
        • Third-party integrations
          • Google Ad Manager / AdSense
            • GDPR via Non-Personalized Ads
              • Share consent and load/refresh ads
              • Share consent without loading or refreshing ads
            • US states laws
          • Google Consent Mode V2
          • Kameleoon
          • Piano Analytics (AT Internet)
          • Prebid
            • GDPR via IAB TCF
            • US states laws
          • Salesforce DMP (Krux)
        • IAB frameworks
        • Programmatic API
      • Configuration
        • Bots (SEO & Performance tools)
        • Configuration by URL
        • Cookies and storage
        • Custom domains for events
        • Notice
          • Behavior
          • Interactions
          • Look and feel
        • Preferences
        • Theme
      • AB tests
      • Custom domain
        • Domain delegation
        • Reverse proxy
      • Share consents between domains
      • Share consents across devices
      • Pass user choices in query string
      • Serve Didomi assets from your domain
      • Reference
        • API
          • Deprecated
        • Events
      • Performance
    • Mobile and TV SDKs
      • Android and Android TV
        • Setup
        • Logging
        • Reference
          • API
            • Deprecated
          • Events
        • Versions
      • iOS and tvOS
        • Setup
        • Logging
        • App Tracking Transparency (iOS 14.5+)
        • Reference
          • API
            • Deprecated
          • Events
        • Versions
      • Unity
        • Setup
        • Reference
        • Versions
        • Troubleshooting
      • React Native
        • Setup
        • Reference
          • Deprecated
        • Versions
      • Flutter
        • Setup
        • Reference
        • Versions
      • Consent notice
        • Getting started
        • Customize the notice
        • Customize the preferences popup
        • Customize the theme & UI
        • Load notice by ID
      • Third-party SDKs
      • Share consents across devices
      • Share consent with WebViews
      • Google Consent Mode v2
      • FAQ
    • AMP SDK
      • Blocking Behaviors
        • Load immediately on page load
        • Load only after consent (positive or negative)
        • Load only after positive consent
      • Consent status for vendors
    • Help & Support
  • API
    • Introduction
      • Authentication
      • Errors
      • Pagination
      • Filters
      • Caching
      • Rate limiting
      • Quotas
      • Translations
    • Data Manager
      • Regulations
      • Configuration Tree
      • Purposes
        • Purposes & Vendors Numerical IDs
      • Preferences Library
      • User Rights
    • Widgets
      • Consent notices
        • Notices
        • Configurations
        • Multi-Regulation Configurations
          • Migration of Existing Notices and API Updates
        • Deployments
        • Tutorials
          • Create and publish a consent notice
          • Create and publish a multi-regulation consent notice
      • Privacy widgets
        • Create a widget
        • Retrieve widgets
        • Edit a widget
          • Content & Design
            • Themes & Shapes
            • Components
              • auth
              • dsar_form
              • footer
              • header
              • preference
              • preference_value
              • save
              • section
              • sections
            • Options
          • Purposes & preferences
          • Settings
        • Deploy a Widget
          • Use your own subdomain
          • Use your own domain
          • Implement an embeddable widget on your website
        • Authentication
          • Manage authentication providers
          • Authenticate your end-user
        • Archive a widget
        • Headless widgets
          • Public Methods
          • Custom elements
          • Custom events
          • Event listeners
        • Tutorial
          • Launch a Preference Center from a mobile app
    • Compliance Reports
      • Properties
      • Reports
      • CSV format reference
      • Websites
    • Consents and Preferences
      • Events
        • Generate IAB TCF consent string
      • Links
      • Proofs
      • Tokens
      • Secrets
      • Users
      • Tutorial
        • Collect and operate data
    • Privacy Requests
      • Requests
      • Notes
      • Links
      • Emails
  • Integrations
    • Introduction
      • Quotas
    • Generic integrations
      • Batch export
        • Destinations
          • AWS S3 Bucket (owned by Didomi)
          • GCP Storage Bucket
        • Exported data
          • Notices consents
        • Logs
      • Webhooks
      • Batch import
      • Analytics export
        • Destinations
          • AWS S3 Bucket (owned by Didomi)
          • GCP Storage Bucket
    • Third-party apps
      • CMP integrations
        • Didomi-mParticle integration for your CMP
        • Deploy Didomi’s SDK for your Adobe Commerce website
      • Preference Management Platform integrations
        • Actito
        • Adobe Campaign Classic
        • Adobe Experience Cloud
        • Adobe Marketo Engage
        • Adobe Source Connector
        • Braze
        • Dotdigital
        • Hubspot
        • Mailchimp
        • Microsoft Dynamics 365
        • Salesforce Marketing Cloud
        • Salesforce Sales & Service Cloud
        • Selligent
        • Brevo (ex Sendinblue)
    • Tutorials
      • Configure a HTTP webhook
      • Configure a batch export
      • Configure an analytics export
    • Emailing
      • Configurations
        • Actito Email
        • Actito SMS
        • Adobe Campaign Classic
        • Adobe Campaign Standard
      • Emails
        • Templates
        • Manage your templates
Powered by GitBook
On this page
  • Purposes
  • Order of purposes
  • Categories of purposes
  • Text
  • Vendors screen
  • Text
  • Display when consent is missing
  • Prevent the popup from being closed when consent is missing
  • Allow the Agree to all and Disagree to all buttons to be disabled until the user scrolls to the bottom of the screen
  • "Disagree to all" behavior
  • Display all buttons in bottom bar
  1. SDKs
  2. Mobile and TV SDKs
  3. Consent notice

Customize the preferences popup

PreviousCustomize the noticeNextCustomize the theme & UI

Last updated 1 month ago

The "Preferences" pop-in allows the user to manage his or her preferences in terms of consent given by purpose and by vendor. By default, it is shown when the user clicks on "Learn more" in the notice (banner or popin) and we recommend adding a link in your app to open it.

You can customize the texts from that screen.

Purposes

Order of purposes

You can control how purposes should be displayed, such as preferred order, icons, etc.

This can be done by adding an array of purposes in the preferences.categories property in the didomi_config.json file. The order in which items are added to this array will be the same order in which purposes will be displayed in based on their purposeId.

Purposes that are required by some vendors and that are not included in the list will be appended to the end of the list in alphabetical order to make sure that all required purposes are displayed and that consent is correctly collected.

Custom JSON
{
    "preferences": {
        "categories": [{
            "type": "purpose",
            "purposeId": "cookies",
            "icon": "PurposeIcon1"
        }, {
            "type": "purpose",
            "purposeId": "advertising_personalization",
            "icon": "PurposeIcon2"
        }, {
            "type": "purpose",
            "purposeId": "ad_delivery",
            "icon": "PurposeIcon3"
        }]
    }
}

Configuration Key

Type

Description

preferences.categories[index].type

String

Type of the entity to be displayed. If you are specifying the purpose, this key should have purpose value

preferences.categories[index].purposeId

String

preferences.categories[index].icon

String

Reference to an icon image loaded from the app.

Categories of purposes

Purposes having a similar functionality can be optionally grouped into categories. This could be useful for better clarity of the purposes screen.

To group purposes into categories, preferences.categories configuration option in the Didomi configuration could be used:

didomi_config.json
{
  "preferences": {
    "categories": [
      {
        "id": "category-id",
        "type": "category",
        "name": {
          "en": "Category name"
        },
        "description": {
          "en": "Category description"
        },
        "children": [
          {
            "type": "purpose",
            "purposeId": "cookies"
          }
        ]
      }
    ]
  }
}

Purposes that are required by some vendors and that are not included in one of the specified categories will be appended to the end of the purposes list in alphabetical order so that all required purposes are displayed and that consent is correctly collected for them.

Each category has the following configuration keys:

Configuration Key

Type

Description

category.id

String

Unique category identifier

category.name

Object

An object containing language ISO code as keys and the localized category name as values

category.description

Object

An object containing language ISO code as keys and the localized category description as values

category.children

Array

An array of purposes which are included in the specified category

category.type

String

Type of the entity to be displayed. If you are specifying the category, this key should have category value

If the user has agreed to the whole category, the PreferencesClickCategoryAgreeEvent Didomi event will be dispatched. Similarly, if the user has disagreed to the whole category, the PreferencesClickCategoryDisagreeEvent Didomi event will be dispatched.

Text

You can change the content of the popup by setting properties on preferences.content.

Configuration Key

Description

preferences.content.text

Main content of the popup

preferences.content.title

Title of the popup (Welcome to ...)

preferences.content.disagreeToAll

'Disagree to all' button

preferences.content.agreeToAll

'Agree to all' button

preferences.content.save

'Save' button

preferences.content.viewOurPartners*

'View our partners' button

preferences.content.viewAllPurposes*

'How we use data' button

preferences.content.bulkActionOnPurposes*

'Agree to all purposes for the best experience' button

preferences.content.bulkActionOnVendors*

'Agree to all vendors for the best experience' button

* Fields marked with asterisk are relevant only for TV SDKs for now

didomi_config.json
{
    "preferences": {
        "content": {
            "text": {
                "en": "We and our partners place cookies, access and use non-sensible information from your device to improve our products and personalize ads and other contents throughout this website. [...]",
                "fr": "Nos partenaires et nous déposons des cookies et utilisons des informations non sensibles de votre appareil pour améliorer nos produits et afficher des publicités et contenus personnalisés. Vous pouvez accepter ou refuser ces différentes opérations. [...]"
            },
            "title": {
                "en": "Welcome to our website",
                "fr": "Bienvenue sur notre site"
            },
            "disagreeToAll": {
                "en": "Disagree to all",
                "fr": "Refuser tout"
            },
            "agreeToAll": {
                "en": "Agree to all",
                "fr": "Accepter tout"
            },
            "save": {
                "en": "Save",
                "fr": "Sauvegarder"
            },
            "viewOurPartners": {
                "en": "View our partners",
                "fr": "Voir nos partenaires"
            },
            "viewAllPurposes": {
                "en": "How we use data",
                "fr": "Comment nous utilisons les données"
            },
            "bulkActionOnPurposes": {
                "en": "Agree to all purposes for the best experience",
                "fr": "Accepter toutes les finalités pour avoir une meilleure expérience"
            },
            "bulkActionOnVendors": {
                "en": "Agree to all vendors for the best experience",
                "fr": "Accepter tous les partenaires marketing pour une meilleure expérience"
            }
        }
    }
}

Vendors screen

Text

You can change the content of the popup by setting properties on preferences.content.

Configuration Key

Description

preferences.content.textVendors

Main content of the popup

Display when consent is missing

If you want to bypass the notice and display the Preferences popup directly when consent is missing, you can set the property preferences.showWhenConsentIsMissing to true. When that is configured, you also need to disable the regular notice to ensure that it will not be displayed by setting notice.enable to false.

Custom JSON
{
  "notice": {
    "enable": false
  },
  "preferences": {
    "showWhenConsentIsMissing": true
  }
}

Prevent the popup from being closed when consent is missing

By default, the Preferences popup can be closed at any time, even if the user has not made a choice for some purposes. You can choose to hide the "X" icon and disallow closing the popup until the user has expressed a choice for every purpose by setting canCloseWhenConsentIsMissing to false.

Custom JSON
{
    "preferences": {
      "canCloseWhenConsentIsMissing": false
    }
}

Allow the Agree to all and Disagree to all buttons to be disabled until the user scrolls to the bottom of the screen

On mobile devices, by adding the disableButtonsUntilScroll flag into the preferences section of the config file and setting it to true, the Agree to all and Disagree to all buttons of the Purposes view will be blocked/disabled until the user scrolls to the bottom of the screen in order to see all the purposes.

Configuration key

Type

Description

preferences.disableButtonsUntilScroll

Boolean

If true, Agree to all and disagree to all buttons will be disabled until the user scrolls to the bottom. If false or not present, the buttons will not be blocked.

Custom JSON
{
    "preferences": {
      "disableButtonsUntilScroll": true
    }
}

"Disagree to all" behavior

By default, "Disagree to all" option on preferences screen applies to both consent and legitimate interest. This means that after "Disagree to all" was selected, all purposes and vendors will be disabled, for both consent and legitimate interest data processing.

This behavior can be controlled by setting the denyAppliesToLI property. When set to false, selecting "Disagree to all" will disable only consent based data processing. Legitimate interest purposes will stil be enabled, as well as legitimate interest based data processing for all vendors.

Custom JSON
{
    "preferences": {
        "denyAppliesToLI": false
    }
}

Display all buttons in bottom bar

By default, on purposes screen on mobile, "Agree to all" and "Disagree to all" buttons are only visible if no choice was made by the user (all purposes are in Unknown state), and "Save" is only visible if the user started to express its choices.

By adding setting the property preferences.enableAllButtons to true, all these buttons will be visible at all times on this screen.

Purpose ID to be displayed in that position. See for a list of available purposes.

Vendors and purposes