Skip to main content

Set Up Privacy Manager (CCPA for Web)

Configuring, publishing, and implementing Privacy Manager on your website consists of the following steps contained in the article in this section.

Configure Privacy Manager (CCPA for Web)

First subscribe to the LiveRamp Console. Here you can add your GDPR for Web subscription and manage and fully customize the Privacy Manager via an intuitive interface. This guide will take you through the set-up and customisation of your Privacy Manager.

Before you begin have a think about what is required for the Privacy Manager to fit your business needs. For example:

  • The content that should be displayed in the Privacy Manager

  • What languages should be supported

  • Whether you are looking to implement any further conditional firing logic based on the user consent

To ensure best user experience for your app users and balanced advertising revenues you need to take all these elements into consideration before publishing the Privacy Manager on your website.

Step-by-step Guide

Configuring and publishing Privacy Manager on your website consists of the following steps:

Create a New Configuration (CCPA for Web)

An App represents the configuration of Privacy Manager on your website. It holds all configurations to control the look and feel, content, and functionality of Privacy Manager.

Before implementing the Privacy Manager on your website you must create an entry for that app. This guide will walk you through this process.

Getting There

From the CCPA page, select Overview from the left navigation bar.

Apps / Configurations

You can create and manage your instances of Privacy Manager via "Overview" functionality.

Tip

You have the possibility to create a new configuration from scratch or use an existing template. More info on templating can be found in "Privacy Manager Templates."

  • Add App - Create a new App

  • Rename - Rename an App

  • Edit - Edit an App by clicking on the name

  • Duplicate - Duplicate an App

  • Delete - Delete an App

Step 1. Create a New App

Go to "Overview" and click the "+ Add App" button:

This opens the Create New App screen, where you define all relevant details for your App.

Step 2. Choose Platform

The Privacy Manager can be configured only for Web platform.

  • Web - Supports desktop and mobile web

Select Web for the desktop and mobile web configuration.

Step 3. Enter Basic Details
  • Name - Enter your App name. Later you will be able to search for and report on the App using this name.

Step 4. Configure Your Privacy Manager

Your App has now been created! Let's proceed with the configuration in the following articles.

Customize the Look and Feel (CCPA for Web)

The look and feel of the Privacy Manager for CCPA Web can be fully customised to suit your needs. You can adjust a multitude of parameters to make the Privacy Manager for CCPA match your website design and layout. This guide will walk you through the process.

Getting There

From the CCPA page, select Overview from the left navigation bar and select the App you want to edit. Then go to the "Editor" tab.

General Settings

You can configure the colors and logo in the general branding settings of the Privacy Manager. Please be noted you can set separate colors and logo for mobile web.

Desktop Web Configuration
  • Notice type – Choose “Popup Window ” or “Bar” to configure placement options for Privacy Manager.

  • Notice Position –

    • Popup Window – Enables placement in the bottom left or right , top left or right as well as Centre.

    • Bar – Enables placement in the top or bottom of the screen.

  • Block Content When PM is shown – Choose “On Manager” , “On Notice”, “On Manager and Notice” from the drop down to have an overlay behind the consumer user interface that requires a selection to be made before interacting with the website. Clicking the palette icon next to the drop down enables users to control the color and transparency of the backdrop.

Choose “Never” from the drop down to not have an overlay behind the consumer user interface.

  • Show Logo - Choose “On Manager” , “On Notice”, “On Manager and Notice” from the drop down in order to have the Logo shown.

Choose “Never” from the drop down in order not to show the logo.

  • Theme - You can choose your following preferred Color Themes for Privacy Manager:

    • Default Theme ( Color codes : #48484A and #48484A)

    • Shamrocker (Color codes : #6AC56A and #F88D37)

    • Bloody Mary (Color codes: #FA4323 and #FA4323)

    • Blue Lagoon (Color codes: #236DFA and #23B8FA)

    • Dry Martini (Color codes: #000000 and #000000|)

    • Pina Colada (Color codes: #40E2AF and #D5632B)

    • Tequila Sunrise (Color codes: #FF5800 and #FF9696)

Mobile Web Configuration

Much of the same functionality is available on mobile as on desktop. Please note that with regard to “Type & Position”, corner placement is not available for mobile devices.

It is also possible to match the look and feel of the desktop version by simply not ticking the “Use Different Notice Types For Mobile Devices” box.

Configure the logo that will be displayed in the header of the Privacy Manager or Privacy Notice or both. Provide a URL to your logo or upload the file.

  • It should be at least 50x50 pixels.

  • In case the uploaded image exceeds the maximum height it will be scaled down to fit.

  • Acceptable formats are PNG or JPG.

Controls

Show "X" Button (close the app) - Choose “On Manager” , “On Notice”, “On Manager and Notice” from the drop down in order to have “X” symbol shown on the top right hand corner.

The “X” symbol can be used to close the Privacy Manager or Privacy Notice or both along with the current state saved.

Choose “Never” from the drop down in order not to have the “X” symbol shown.

Button Style - There are 2 buttons that can be separately configured:

  • Save and Exit

  • Do Not Sell My Personal Info

For each button you can set the base color (secondary color is always white) and choose from 4 different pre-defined stylings such as Unelevated, Outlined, Raised and Text

Do Not Sell My Personal Info Button
  • Choose Text Color - Choose to control the text color on the “Do Not Sell My Personal Info” button by Clicking the palette icon.

  • Choose Background Color - Choose to control the background color on the “Do Not Sell My Personal Info” button by Clicking the palette icon.

  • Show the Button – Choose “On Desktop” , “On Mobile” and “On Desktop and Mobile” options from the drop down to have the “Do Not Sell My Personal Info” button shown.

Choose “Never” from the drop down in order not to “Do Not Sell My Personal Info” button shown.

Note

Please be aware that the DNS button is disabled by default for new configurations.

  • Position of the Toggle - Choose to position the button on the “Bottom Left” or “Bottom Right”

  • Load Privacy Manage on – Choose to load the Privacy Manager in the Privacy Information tab or in the Privacy Settings tab.

Tip

Since the text “Do Not Sell My Personal Information” is too big to sensibly fit in a floating button, we recommend to give your customers the option to toggle Privacy Manager from a text link. In the admin section within your configuration you can find a code snippet to toggle Privacy Manager.

Dialogs and Confirmations

Choose to have confirmation dialog after the visitor presses one of the following buttons or both the following buttons:

  • Save and Exit - Save current state and close Privacy Manager

  • Do Not Sell My Personal Info - This ensures that the End user has been opted out for Sale.

Write Content (CCPA for Web)

The content and language of the Privacy Manager can be fully customized to suit your needs. You can adjust a multitude of parameters to make the Privacy Manager match your website design and layout. This guide will walk you through the process.

Getting There

Get to the configuration screen, select Overview from the left hand navigation menu and select the App you want to edit. Then go to the "Content" tab.

Languages

You can configure any text in any supported language in the Privacy Manager from the "Content configuration" section.

Privacy Manager for CCPA currently has default text for the following languages:

  • English (default)

  • Spanish (Mexico) - es-mx

The Privacy Manager will adjust the language based on the user's device language/ region setting. If the language is not available, then the Privacy Manager will default to English.

Note

English the only language configured by default for new configurations. Other languages need to be selected manually.

How to edit the default text

Scroll down to "Content Editor" and select your language from the drop-down menu on top of the section.

The text entry fields will be pre-populated with the default text we have for the selected language. Each text entry field corresponds to text on a page or in an object in the Privacy Manager. Here is an example:

  • Introductions - The main introduction text and titles shown in the top of the Privacy Manager on every page:

    • Privacy Notice Page

    • Purpose Overview

    • Purpose Details Page

    • Special Purpose Details Page

    • Feature Details Page

    • Special Feature Details page

    • Vendor Overview

    • Vendor Details Page

    • Organization Details Page

    • Privacy Information Page

  • Privacy Information - Privacy Information topics can be used to provide additional context to visitors.

  • Controls - Edit the text in the call-to-action buttons shown in Privacy Manager:

    • Accept All

    • Reject All

    • Save and Exit

    • Manage Settings

  • Dialogs - Set/edit optional dialog boxes that can be used to request additional confirmation and/or provide information on the consequences of a visitor's choices, for example when a visitor clicks:

    • Accept All

    • Reject All

    • Save and Exit

    • Reset Audit ID

  • Stacks - The default Stack descriptions can be overridden with custom text.

The console makes use of auto-save so you can switch between different languages while editing.

Your changes will only be published after clicking Publish App (see "Preview and Publish Configuration Versions" for more information).

Configure Vendors (CCPA for Web)

The Privacy Manager allows you to fully customize the vendor selection from the portal. Vendors are third party partners you allow to set cookies on your site. Setting up vendor selection is of key importance to your business to ensure any opt-out or partial opt-out signals are communicated downstream appropriately. This guide will walk you through the settings. In case you have any doubts or questions with regards to vendor selection, please don't hesitate to drop us a line.

Getting There

Get to the configuration screen, select Overview from the left hand navigation menu and select the App you want to edit. Then go to the "Vendors" tab.

Third-party Vendors

The vendor list section reflects your current vendor selection and a link to their privacy policy. The vendors that have been selected will be displayed in the Privacy Manager with their respective Purposes, Vendors and Data Categories. Given that CCPA does not require you to disclose vendors, you may elect not to disclose vendors to your users from the Admin page within Console. If you do not disclose vendors, you are able to still leverage the backend functionality of the Privacy Manager.

Choosing Vendors
  • Choose vendors - Opens the vendor selection drawer.

  • If you do not see a Vendor in the Vendor list, please make a request here to add it to the Vendor List. We will typically be able to add the Vendor within 24 business hours if you provide the Vendor name and privacy policy.

Purposes for this Vendor

Use the “Purposes for this vendor” dropdown to add or remove purposes tied to each vendor. Configure which purposes apply to each vendor by clicking “Add/Remove” in the top right corner of the drop down.

Once a purpose has been selected, you may make further changes to the configuration:

  • Tick the check box in the “Lock” column to disable changes in preference state for the respective purpose. This means the user will not be able to opt-out of collection for that purpose. Please consult with your counsel to determine which purposes your business considers lock-able under the CCPA.

  • Use the “Opt in/out by default” toggle to determine whether that purpose is enabled or not when a consumer first interacts with their preference settings.

There are nine standard purposes available within Privacy Manager. The purposes and their definitions are listed below.

  1. Auditing Interactions with Consumers – Auditing includes counting ad impressions to unique visitors, verifying positioning and quality of ad impressions, and other compliance auditing with regard to concurrent transactions.

  2. Security – Security involves detecting security incidents, protecting against malicious or fraudulent activity, and prosecuting offenders

  3. Debugging/Repair – Debugging relates to the identification and repair of impairments to intended, existing functionality.

  4. Certain Short-term Uses – Short-term, transient uses include data collection for which personal information is not disclosed to another third party, not used to build a profile about a consumer, or not used to alter an individual’s experience outside the current transaction (including contextual ads as part of the same interaction).

  5. Performing Services – The services performed may be either by the business or a service provider. These services include “maintaining or servicing accounts, providing customer service, processing or fulfilling orders and transactions, verifying customer information, processing payments, providing financing, providing advertising or marketing services, providing analytic services, or providing similar services.”

  6. Internal Research for Tech Development – Allows for research into technological development and demonstration.

  7. Quality and Safety Maintenance and Verification – The quality and safety business purpose includes activities related to the improvement, upgrade or enhancement of the service or device owned, manufactured for, or controlled by the business. It also includes the verification or maintenance of the quality or safety of a service or device.

  8. Selling – Selling means selling, renting, releasing, disclosing, disseminating, making available, transferring, or otherwise communicating personal information for monetary or other valuable consideration.

  9. Operating our Website(s) - Enables to maintain the performance and the working of the Website(s). [coming soon]

Data Categories for this Vendor

Use the “Data categories for this vendor” dropdown to add or remove data categories tied to each vendor. Configure which data categories apply to each vendor or vendor category by clicking “Add/Remove” in the top right corner of the drop down.

There are nine standard categories available within Privacy Manager. The categories and their definitions are listed below:

  1. Identifiers – Such as a real name, alias, postal address, unique personal identifier, online identifier, Internet Protocol (IP) address, email address, account name, Social Security Number, driver’s license number, passport number, or other similar identifiers.

  2. Biometric data – Such as fingerprints and facial recognition data.

  3. Internet or network activity data – Such as IP addresses, browsing history, search history, and interactions with online sites, apps, or advertisements.

  4. Commercial information – Including records of personal property, products or services purchased, obtained, or considered, or other purchasing or consuming histories or tendencies.

  5. Geolocation data – Information that can be used to identify an electronic device's (historic or real-time) physical location.

  6. Professional or employment-related information – Information about an individual’s professional job titles, salary, school attended, employment history, evaluations, references, interviews, certifications, disciplinary actions, etc.

  7. Education information – Information that is not publicly available personally identifiable information as defined in the Family Educational Rights and Privacy Act (20 U.S.C. section 1232g, 34 C.F.R. Part 99).

  8. Inferences – Inferences drawn from any of the information identified in this subdivision to create a profile about a consumer reflecting the consumer’s preferences, characteristics, psychological trends, preferences, predispositions, behavior, attitudes, intelligence, abilities, and aptitudes.

  9. Categories from CA Civil Code 1798.80 – Name, address, telephone number, employment, credit card number, debit card number, or any other financial information.

Granular Controls and Disclosure

Granular Controls dictating how the purposes, vendors, and categories listed in your Privacy Manager for CCPA UI can be set prior to publishing your Privacy Manager for CCPA version:

  • Do not disclose vendors: This option enables you to hide the Vendors Tab in the Privacy Manager.

  • Do not disclose data categories: This option enables you to hide the Data Categories Tab in the Privacy Manager.

  • Do not disclose purposes: This option enables you to hide the Purposes Tab and to hide the purposes in the Vendor details page in the Privacy Manager.

  • Disable granular controls: This option disables the end-user’s ability to deactivate/activate Purposes, Vendors, and Data Categories individually.

Configure Advanced Settings (CCPA for Web)

Getting There

From the CCPA page, select Overview from the left navigation bar and select the App you want to edit. Then go to the "Admin" tab.Install Privacy Manager

Advanced Settings

Interpret DNT as Opt-out signal

When a DNT (Do Not Track) signal is passed by a browser, this option interprets the DNT signal as an Opt out signal.

IAB U.S. Privacy

Select this option if you are a participant in the IAB U.S. Privacy framework.

Debug Mode

Enables extensive logging in the console log.

Set Local Cookies on Second Level Domain

When this box is ticked, whenever Privacy Manager sets a first-party cookie it will always be set on the second level domain (for example; demo.com) regardless of whether the Privacy Manager is loaded from a third level domain (for example; cmp.demo.com).

Geo Targeting

With this setting it is possible to include or exclude specific countries or regions from surfacing the Privacy Manager. By default, this is filtered to include only users located in California based on IP address. You may elect to broaden or decrease the scope as desired.

JavaScript Loading Options

Control how the Privacy Manager script is loaded.

  • async - Enable "async" to add "async" to the tag. The script is fetched asynchronously, and when it’s ready the HTML parsing is paused to execute the script, then it’s resumed.

  • defer - Enable "defer" to add "defer" to the tag. By adding defer the script is fetched asynchronously, and it’s executed only after the HTML parsing is done.

Check here for more information on async/defer.

Preview and Publish Configuration Versions (CCPA for Web)

The Privacy Manager stores the settings of every published version of your Consent Manager. This guide will walk you through the settings and mechanics of versions.

Getting There

To get to the configuration screen, select Overview from the left hand navigation menu and select the App you want to edit. Then go to the "Versions" tab.

Versions

A version is a snapshot of a configuration at a particular time. You can save the current state of a configuration as a version at any time. This enables you to revert your configuration back to a previous version if necessary. The version of the configuration is also logged as part of the audit trail. This way it is possible to refer back to what the configuration was at the time when the user gave consent.

Versions can make it easier to recover from mistakes. For example: If someone accidentally publishes a configuration version before it's ready for production, you can revert your configuration to an earlier version and publish it.

Save Your Current Configuration

When you don’t want to publish your configuration it is also possible to save changes to a configuration. This can be for example used for when a configuration change requires review from others before going live. In the Overview tab you can see if a configuration has unpublished changes.

Publish Your Current Configuration

When you publish your configuration, Privacy Manager will make your changes active. If you've edited text, vendors or any other setting in your configuration, you will need to publish those changes to make those changes operational on your website or mobile app. You are also able to publish multiple configurations in bulk. Simply select multiple configurations and select “Publish” when pressing on the “actions” button.

  1. Click Publish at the top right hand side of the screen.

  2. The Publish Settings screen will appear, with options to publish the configuration and name the version.

  3. When you publish or create a version, enter a Version Name that will make it easy to know what changes are being made. The name will be stored along with the version number and could for instance reflect your last changes.

  4. Click Publish

Note

The initial version of the configuration is always called "Version 1 - Initial CCPA WEB Privacy Manager."

Reverting to a Previous Configuration

Privacy Manager maintains a publish history, so you can see when versions were set live. To see the publish history, go to Versions and look for entries with a date in the Date Published column.

To replace the current container version with a previously saved version:

  1. Click Versions.

  2. Click the Actions menu next to the desired configuration version.

  3. Select Publish version to immediately publish a specific version from the Versions screen.

  4. Select Restore version in case you still want to make modifications to the selected version. This replaces the current configuration draft with the content of the selected configuration version. You may then make any additional modifications to the configuration draft, and publish your changes when ready.

Previewing Your Current Configuration

Privacy Manager provides you with an option to preview the changes even before they are being published.

In order to perform a preview, you need to click on the “Preview” button available at the top right hand corner of the page. Starting from the Editor section until Admin section you can notice the “Preview” button at the top right hand corner of the page.

Alternative User Experiences (CCPA for Web)

Given your legal counsel’s CCPA compliance requirements or your existing site functionality, you may wish to implement your Privacy Manager for CCPA instance in a manner that does not leverage the existing out-of-the-box Privacy Manager UI and instead enables a different user experience (UX) for your site visitors. In this FAQ section, we have included instructions on how to set up Privacy Manager for CCPA instances for the most commonly requested alternative implementations.

Don’t see your desired workflow here? Our product is highly configurable, and we may be able to accommodate your request.

Alternative CCPA UX: "Do Not Sell My Personal Information" Button Only

Given your legal counsel’s CCPA compliance requirements or your existing site functionality, you may wish to implement your Privacy Manager for CCPA instance(s) in a manner that does not leverage the existing out-of-the-box Privacy Manager UI and instead enables a different user experience (UX) for your site visitors.

This alternative UX guide details how to implement the Do Not Sell My Personal Information button only on your website, while still leveraging all of Privacy Manager’s great backend functionality to communicate the Do Not Sell My Personal Information request.

Please see the basic demo implementation of this UX here: Do Not Sell My Personal Information Button Only Demo

Notice this implementation “suppresses” the standard Privacy Manager UI, but it will still respect the vendor selections you configure.

You may wish to implement this UX if you have determined:

  • You engage in the sale of California consumer personal information as applicable under CCPA

  • Your legal counsel has advised that a link to your privacy policy or another notice mechanism on your site is sufficient “notice at collection” to users under CCPA

  • You sell only cookie-based data or will collect your own identifier when a user clicks Do Not Sell My Personal Information such that you can fulfill Do Not Sell My Personal Information requests with a simple button implementation.

Note, if you will need to collect additional personal information from the consumer in order to fulfill the Do Not Sell My Personal Information request in your downstream data assets, you may wish to visit our ""Do Not Sell" Button and "Do Not Sell" Web Form Redirect" article for instructions.

  1. Navigate to http://launch.liveramp.com/

  2. On the Overview page, create a new App or select the existing App you wish to implement.

  3. From the Editor Menu toggle off Show Privacy Notice

  4. From the Editor menu > Uncheck toggle enable on website

  5. Configure your vendors (the 3rd parties to whom you wish to communicate the CCPA Do Not Sell signal) for the App.

  6. Configure any Advanced Settings you may wish to activate via the Admin page

  7. When you feel ready, go to the Admin page and click Publish

Implementing this UX in your environment will require you to implement four components. You may either hardcode or place via a tag manager:

  1. CSS code styling of the Do Not Sell My Personal Information button

  2. JavaScript tag for the Privacy Manager backend configurations you set up above (placed in the header)

    1. You may find this on the Admin page in your configured App in LiveRamp Console.

  3. JavaScript code for triggering the Do Not Sell My Personal Information request to your vendors when a user clicks the Do Not Sell My Personal Information button.

  4. An HTML div component, which dictates the text and loading on the page of the Do Not Sell My Personal Information button should be placed in the body of your page.

Please see below for examples of the code used for the demo. Note that you may change the inputs to adjust the look and feel of the button as desired:

CSS Styling
    <style>
        .cs_pToggle {
            position: fixed;
            cursor: pointer;
            z-index: 2147483646;
            bottom: 10px;
            right: 10px;
            /* display: block; */
        }

        .cs_toggle {
            background-color: #F88D37;
            background-image: linear-gradient(to right, #F88D37, #F88D37);
            color: #ffffff;
            border: solid #F88D37 0px;
            border-radius: 18px;
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            cursor: pointer;
            font-weight: bold;
            line-height: normal;
        }

        .cs_span {
            font-size: 13px;
            text-transform: uppercase;
            line-height: 24px;
        }
        
    </style>
Privacy Manager Script

***Note: This is an example. You can find your own configured script via the Admin page within the desired App in LiveRamp Console.

<script src="https://ccpa-wrapper-dev.console.fktr.io/ccpa/a13d7969-1bc8-4fa3-ac00-e66a0f1f1623/ccpa-liveramp.js"></script>
JavaScript Function
    <script>
        function doNotSell() {
            window.__ccpa("doNotSellMyData", null, 1, function () {

            });
        }
    </script>
HTML Div Code
    <div class="cs_pToggle">
        <button onclick="doNotSell()" class="cs_toggle">
            <span class="cs_span">
                Do Not Sell My Personal Information
            </span>
        </button>
    </div>

Once you've implemented these components, you will have a Do Not Sell My Personal Information button implementation of your Privacy Manager for CCPA. Please do not hesitate to check out our FAQ CCPA or reach out to support-privacy-manager@liveramp.com if you run into any implementation questions.

Alternative CCPA UX: "Do Not Sell" Button and "Do Not Sell" Web Form Redirect

Given your legal counsel’s CCPA compliance requirements or your existing site functionality, you may wish to implement your Privacy Manager for CCPA instances in a manner that does not leverage the existing out-of-the-box Privacy Manager UI and instead enables a different user experience (UX) for your site visitors.

This alternative UX guide details how to implement the Do Not Sell My Personal Information button, with a redirect to your access request web form on your website, while still leveraging all of Privacy Manager’s great backend functionality to communicate the Do Not Sell My Personal Information request.

Please see the basic demo implementation of this UX, illustrating our integration with WireWheel, here: Do Not Sell My Personal Information + Redirect Demo.

Notice this implementation “suppresses” the standard Privacy Manager UI, but it will still respect the vendor selections you configure.

You may wish to implement this UX if you have determined:

  • You engage in the sale of California consumer personal information as applicable under CCPA.

  • Your legal counsel has advised that a link to your privacy policy or another notice mechanism on your site is sufficient “notice at collection” to users under CCPA.

  • You have a web form or other mechanism for capturing additional information on California consumers wishing to opt out of the sale of their information.

  1. Navigate to http://launch.liveramp.com/.

  2. On the Overview page, create a new App or select the existing App you wish to implement.

  3. From the Editor Menu toggle off Show Privacy Notice.

  4. From the Editor menu > Uncheck toggle enable on website.

  5. Configure your vendors (the third-parties to whom you wish to communicate the CCPA Do Not Sell My Personal Information signal) for the app by following the instructions in "Configure Vendors."

  6. Configure any Advanced Settings you may wish to activate via the Admin page.

  7. When you feel ready, go to the Admin page and click Publish.

Implementing this UX in your environment will require you to implement four components. You may either hardcode or place via a tag manager:

  • CSS code for styling the Do Not Sell My Personal Information button.

  • JavaScript tag for the Privacy Manager backend configurations you set up above (placed in the header)

    Tip

    You may find this on the Admin page in your configured App in LiveRamp Console.

  • JavaScript code for triggering the Do Not Sell My Personal Information request to your vendors when a user clicks the Do Not Sell My Personal Information button.

  • An HTML div component, which dictates the text and loading on the page of the Do Not Sell My Personal Information button, should be placed in the body of your page.

Please see below for examples of the code used for the demo. Note that you may change the inputs to adjust the look and feel of the button as desired:

CSS styling:

This script dictates the look and feel of the Do Not Sell My Personal Information button. You can change the styling to match your on-site branding guidelines.

    <style>
        .cs_pToggle {
            position: fixed;
            cursor: pointer;
            z-index: 2147483646;
            bottom: 10px;
            right: 10px;
        }

        .cs_toggle {
            background-color: #F88D37;
            background-image: linear-gradient(to right, #F88D37, #F88D37);
            color: #ffffff;
            border: solid #F88D37 0px;
            border-radius: 18px;
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            cursor: pointer;
            font-weight: bold;
            line-height: normal;
        }

        .cs_span {
            font-size: 13px;
            text-transform: uppercase;
            line-height: 24px;
        }
        
    </style>
Privacy Manager script:

Note

This is an example. You can find your own configured script via the Admin page within the desired App in LiveRamp Console.

<script src="https://ccpa-wrapper-dev.console.fktr.io/ccpa/a13d7969-1bc8-4fa3-ac00-e66a0f1f1623/ccpa-liveramp.js"></script>

JavaScript function:

  • This script function will fire opt-outs to the vendors selected with Selling purpose when a user clicks the Do Not Sell My Personal Information button.

  • It then pulls the AuditID and the domain and pushes them to the destination in the header

  • The user is then redirected to the webform URL destination.

Note

Be sure to replace the webform URL with the desired redirect URL in the script below.

    <script>
        function doNotSell() {
            window.__ccpa("doNotSellMyData", null, 1, function () {});
            var url = "Place the webform URL here"
            var auditId
            var domain
            __ccpa('getConsent', null, 1, function (data) {
                auditId = data.auditId
                domain = window.location.hostname
            });
            var uri = url + "?auditID=" + auditId + "&domain=" + domain;
            var res = encodeURI(uri);
            console.log(res);
            window.location = uri
        }
    </script>

HTML div code:

Place this code in the body of the page to reflect the content and appearance of the Do Not Sell My Personal Information button.

    <div class="cs_pToggle">
        <button onclick="doNotSell()" class="cs_toggle">
            <span class="cs_span">
                Do Not Sell My Personal Information
            </span>
        </button>
    </div>

Once you've implemented these components, you will have a Do Not Sell My Personal Information button + Redirect implementation of your Privacy Manager for CCPA. Please do not hesitate to check out "FAQs for Privacy Manager for CCPA" or reach out to support-privacy-manager@liveramp.com if you run into any implementation questions.

Alternative CCPA UX: Custom Banner Notice

Given your legal counsel’s CCPA compliance requirements or your existing site functionality, you may wish to implement your Privacy Manager for CCPA instance(s) in a manner that does not leverage the existing out-of-the-box Privacy Manager UI and instead enables a different user experience (UX) for your site visitors.

This alternative UX guide details how to implement a custom banner notice while still leveraging all of Privacy Manager’s great backend functionality.

Please see the basic demo implementation of this UX here: Custom Banner Notice Demo

Notice this implementation “suppresses” the standard Privacy Manager UI, but it will still respect the vendor selections you configure. This implementation also shows the notice once to the user, unless they clear their cookies. Once a user exits the notice, it will not be shown again when they revisit the site in the same browser session. You may also optionally choose not to include various granular controls around whether to display categories of data, your vendor list, or your full privacy notice.

You may wish to implement this UX if you have determined:

  • Your legal counsel has advised that you must show a clear, visible “notice at collection” to users under CCPA upon visiting your site

  • The existing Privacy Manager UI does not meet your styling requirements (ie. you would like a smaller notice, wish to customize the look of the notice further, etc.)

  1. Navigate to http://launch.liveramp.com/

  2. On the Overview page, create a new App or select the existing App you wish to implement.

  3. From the Editor Menu toggle off Show Privacy Notice

  4. Configure the rest of the App as desired according to the Set Up Privacy Manager guide.

  5. Configure any Advanced Settings you may wish to activate via the Admin page

  6. When you feel ready, go to the Admin page and click Publish

Including the following in your environment ( hardcode or through a tag manager )

  • CSS code for styling the custom notice banner

  • JavaScript tag for the Privacy Manager backend configurations you set up above (placed in the header)

    Tip

    You may find this on the Admin page in your configured App in LiveRamp Console.

  • JavaScript code for triggering the functionality of the notice banner, including:

    • Close button (optional)

    • Save & Exit option

    • Redirect to Do Not Sell My Personal Information or opt-out web form (optional)

  • An HTML div component, which dictates the text and loading on the page of the custom notice banner should be placed in the body of your page.

CSS styling:

Note

This file is for the custom notice banner. Please note this is an example, and you may modify the code to reflect your own styling needs.

Make sure to include either the Minified or the Expanded version below

Minified :

<style>.cs_pToggle{position:fixed;cursor:pointer;z-index:2147483646;bottom:10px;right:10px}.cs_toggle{background-color:#f88d37;background-image:linear-gradient(to right,#f88d37,#f88d37);color:#fff;border:solid #f88d37 0;border-radius:18px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;font-weight:700;line-height:normal}.cs_span{font-size:13px;text-transform:uppercase;line-height:24px}.modal-content{position:fixed;bottom:0;background-color:#fefefe;width:100%;-webkit-animation-name:slideIn;-webkit-animation-duration:.4s;animation-name:slideIn;animation-duration:.4s;z-index:2147483647;box-shadow:0 0 12px 0 rgba(0,0,0,.1)}.cs_close{color:#323333;float:right;font-size:24px;font-weight:700;margin:4px 16px}.cs_close:focus,.cs_close:hover{color:#000;text-decoration:none;cursor:pointer}.modal-header{padding:2px 16px;background-color:#fff;color:#323333}.modal-body{padding:2px 16px}.modal-footer{padding:2px 2px;background-color:#fff;color:#323333}.c_par{font-family:OpenSans;font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4949;margin:16px;font-family:"Flexo Medium",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif}.c_btn_1{background-color:#f88d37;font-size:8px;font-weight:700;border-radius:27px;color:#fff;border:2px solid #f88d37;margin:12px 16px 12px 10px;line-height:normal;display:flex;height:30px;width:120px}.c_btn_2{background-color:#f88d37;font-size:8px;font-weight:700;border-radius:27px;color:#fff;border:2px solid #f88d37;margin:12px 0 12px 0;line-height:normal;display:flex;width:120px;height:30px}.c_nac{line-height:inherit;color:#fa8d28;text-decoration:none;cursor:pointer}.c_btn_container{display:flex!important;align-content:center;flex-direction:column;justify-content:center;padding-left:60px}@-webkit-keyframes slideIn{from{bottom:-300px;opacity:0}to{bottom:0;opacity:1}}@keyframes slideIn{from{bottom:-300px;opacity:0}to{bottom:0;opacity:1}}@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}</style>

For more adjustments on the CSS, here is the expanded version:

        .cs_pToggle {
            position: fixed;
            cursor: pointer;
            z-index: 2147483646;
            bottom: 10px;
            right: 10px;
        }

        .cs_toggle {
            background-color: #F88D37;
            background-image: linear-gradient(to right, #F88D37, #F88D37);
            color: #ffffff;
            border: solid #F88D37 0px;
            border-radius: 18px;
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            cursor: pointer;
            font-weight: bold;
            line-height: normal;
        }

        .cs_span {
            font-size: 13px;
            text-transform: uppercase;
            line-height: 24px;
        }
    </style>


    <style>
        .cr_modal {
            z-index: 1;
            overflow: auto;
            background-color: rgb(0, 0, 0);
            background-color: rgba(0, 0, 0, 0.4);
            -webkit-animation-name: fadeIn;
            -webkit-animation-duration: 0.4s;
            animation-name: fadeIn;
            animation-duration: 0.4s;
            z-index: 2147483647;
        }

        .modal-content {
            position: fixed;
            bottom: 0;
            background-color: #fefefe;
            width: 100%;
            -webkit-animation-name: slideIn;
            -webkit-animation-duration: 0.4s;
            animation-name: slideIn;
            animation-duration: 0.4s;
            z-index: 2147483647;
            box-shadow: 0 0 12px 0 rgba(0, 0, 0, .1);
        }

        .cs_close {
            color: #323333;
            float: right;
            font-size: 24px;
            font-weight: bold;
            margin: 4px 16px;
        }

        .cs_close:hover,
        .cs_close:focus {
            color: #000;
            text-decoration: none;
            cursor: pointer;
        }

        .modal-header {
            padding: 2px 16px;
            background-color: #FFF;
            color: #323333;
        }

        .modal-body {
            padding: 2px 16px;
        }

        .modal-footer {
            padding: 2px 2px;
            background-color: #FFF;
            color: #323333;
        }

        .c_par {
            font-family: OpenSans;
            font-size: 12px;
            font-weight: normal;
            font-stretch: normal;
            font-style: normal;
            line-height: normal;
            letter-spacing: normal;
            color: #4a4949;
            margin: 16px;
            font-family: "Flexo Medium", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
        }

        .c_btn_1 {
            background-color: #f88d37;
            font-size: 8px;
            font-weight: 700;
            border-radius: 27px;
            color: #fff;
            border: 2px solid #f88d37;
            margin: 12px 16px 12px 10px;
            line-height: normal;
            display: flex;
            height: 30px;
            width: 120px;
        }

        .c_btn_2 {
            background-color: #f88d37;
            font-size: 8px;
            font-weight: 700;
            border-radius: 27px;
            color: #fff;
            border: 2px solid #f88d37;
            margin: 12px 0px 12px 0px;
            line-height: normal;
            display: flex;
            width: 120px;
            height: 30px;

        }

        .c_nac {
            line-height: inherit;
            color: #fa8d28;
            text-decoration: none;
            cursor: pointer;
        }

        .c_btn_container {
            display: flex !important;
            align-content: center;
            flex-direction: column;
            justify-content: center;
            padding-left: 60px;
        }

        @-webkit-keyframes slideIn {
            from {
                bottom: -300px;
                opacity: 0
            }
            to {
                bottom: 0;
                opacity: 1
            }
        }

        @keyframes slideIn {
            from {
                bottom: -300px;
                opacity: 0
            }
            to {
                bottom: 0;
                opacity: 1
            }
        }

        @-webkit-keyframes fadeIn {
            from {
                opacity: 0
            }
            to {
                opacity: 1
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0
            }
            to {
                opacity: 1
            }
        }

Privacy Manager script:

**Note: This is an example. You can find your own configured script via the Admin page within the desired App in LiveRamp Console.

<script src="https://ccpa-wrapper-dev.console.fktr.io/ccpa/a13d7969-1bc8-4fa3-ac00-e66a0f1f1623/ccpa-liveramp.js"></script>

HTML (Banner):

Needs to be implemented in the body of the page. Note, we have inserted generic notice language in this example. You may wish to review it with your legal counsel and update to fit your needs prior to implementation.

    <div id="cs_modal" class="cr_modal" style="display: none;">
        <div class="modal-content">
            <span class="cs_close">&times;</span>
            <div class="modal-footer">
                <p class="c_par">We may collect cookies and other personal information from your interaction with our
                    website.
                    For more information on the categories of personal information we collect and the purposes we use
                    them for,
                    please view our <a class="c_nac" onclick=shoCMP()> Notice at Collection.</a></p>
            </div>
        </div>
    </div>
JavaScript function:
  • This script will allow the suppressed Privacy Manager UI to be accessed once a user clicks the notice link for more information

  • Note that once a user exits the notice, it will not be shown again when they revisit the site in the same browser session.

  • Optionally, you can include a redirect from the Do Not Sell My Personal Information button to an access request web form, and the Privacy Manager will pull the Audit ID and the domain and push them to the destination in the header

Note

If you choose to include a redirect to a web form, you need to replace PLACE REDIRECT WEBFORM URL HERE with your web form destination URL.

The script needs to be placed after the HTML tag to avoid undefined status

    <script>
         var c_modal = document.getElementById("cs_modal");

        var c_close = document.getElementsByClassName("cs_close")[0];

        var c_NAC = document.getElementsByClassName("NAC")[0];

        window.__ccpa('addEventListener', 'consentToolShouldBeShown', 1, function () {
            c_modal.style.display = "block";
        });

        var shoCMP = function () {
            __ccpa("showConsentManager", [], [1], function () {})
            c_modal.style.display = "none";
        }

        c_close.onclick = function () {
            c_modal.style.display = "none";
            __ccpa("optIn", [], [1], function () {})
        }


        var url = "PLACE REDIRECT WEBFORM URL HERE"
        var auditId
        var domain
        window.__ccpa('addEventListener', 'doNotSellMyDataButtonClicked', 1, function () {
            __ccpa('getConsent', null, 1, function (data) {
                auditId = data.auditId
                domain = window.location.hostname
            });
            var uri = url + "?auditID=" + auditId + "&domain=" + domain;
            var res = encodeURI(uri);
            console.log(res);
            window.location = uri
        });
    </script>

Implement Privacy Manager (CCPA for Web)

The articles in this section contain instructions on how to implement LiveRamp Privacy Manager on your website.

Note

Please ensure that there is not already a CMP (consent management platform) installed before you begin the installation instructions below. Only one CMP should be installed on any website at a given time.

API Reference (CCPA for Web)

__ccpa(command, [parameter], [version], [callback])

Argument Name

Type

Value

callback

function

Function to be executed with the result of the command

command

String

Name of the command to execute

parameter

number

Parameter to be passed to the command function

version

number

Optional parameter, version of the API, currently v1.0

command: "ping"

[parameter]: (ignored)

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (Object):

isLoaded: true if CCPA main script is loaded, false if still running stub

status: stub | loading | loaded | error

displayStatus: visible | hidden | disabled

apiVersion: version of the API that is supported, e.g. "1.0"

vendorListVersion: Version of the vendor list used when consent is given.

command: "optIn"

[parameter]: Array of vendors with purposes, if none is passed all vendors will be opted in

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (Void): Void

command: "optOut"

[parameter]: Array of vendors with purposes, if none is passed all vendors will be opted out

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (Void): Void

command: "ccpaApplies"

[parameter]: (ignored)

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (Boolean): True if ccpa details apply for current user

command: "getConsent"

[parameter]: (ignored)

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (Object): Consent data for the current user

command: "getAuditId"

[parameter]: (ignored)

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (String): AuditId of a user

command: "resetAuditId"

[parameter]: (ignored)

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (String): Auto generated AuditId

command: "shouldConsentToolBeShown"

[parameter]: (ignored)

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (Boolean): True if consent tool should be shown

command: "getVendorList"

[parameter]: (ignored)

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (Object): Vendor list

command: "addEventListener"

parameter (String): Name of the event to listen to

version:

[callback(result)]: Function to execute when the event is fired

Arguments

result (Object): Object containing the event name and any data the event may return

command: "removeEventListener"

parameter (String): Name of the event to remove as a listener

version:

[callback(result)]: Callback function to remove as a listener

Arguments

result (Object): Object containing the event name and any data the event may return

command: "showConsentManager"

[parameter]: (ignored)

version: (ignored)

[callback(result)]: Function to be executed with the result of the command

Arguments

result (Void): Consent manager will be displayed

The U.S. Privacy String is a core part of IAB’s framework to support CCPA compliance amongst publishers. This U.S. Privacy String communicates signals regarding consumer privacy and choice under U.S. privacy regulation [For more technical information: Github]. The U.S. Privacy String only applies to traffic originating in the U.S. market.

Version 1 of this specification is focused on supporting requirements under the California Consumer Privacy Act (CCPA). If privacy regulations apply, digital property owners (websites, apps, or other media platforms) are expected to provide consumer privacy signals to all parties that intend to exchange data on a given transaction (such as displaying an impression). For example, parties receiving the signal use the information to determine whether they’re allowed to process the consumer’s personal data.

This privacy string enables the capture of signals to ensure:

  • Notice has been given to the consumer, or an opportunity to opt-out

  • The consumer can pass their right to opt-out of the sale of data

IAB U.S. Privacy API

Check the __uspapi stub for consent data. The stub has three parameters:

__uspapi(Command, Version, Callback)

Argument Name

Type

Value

command

string

'getUSPData'

version

number

U.S. Privacy spec version

callback

version

function(uspData: uspdata, success: boolean)

Example how to view the content of the uspData object:

__uspapi('getUSPData', 1 , (uspData, success) => { 

    if (success) { 

        console.log('cmp response: ', JSON.stringify(uspData));

    } 

});

"version" is a number, indicating the U.S. Privacy spec version.

"uspString" is a string that encodes all choices and information, and has the following components:

Character

Value

Explanation

1st

1

U.S. Privacy spec version

2nd

Y / N

Explicit notice / Opportunity to opt out

3rd

Y / N

User opted out of sale of personal information

4th

Y / N

Publisher is a signatory to the IAB Limited Service Provider Agreement. (In case you are a signatory to the IAB Limited Service Provider Agreement then you should enable this in the settings of your Privacy Manager CCPA configuration.)

The eligibility of CCPA is determined based on IP. In case CCPA does not apply, the string's value will always be "1---."

Examples

The following examples provide a sample U.S. Privacy String that represents the stated conditions. In all but the last example, a digital property has determined to use a U.S. Privacy String and that CCPA applies to the transaction.

Example 1 meets the following conditions:

Version 1 of the U.S. Privacy string is being used. (1)

The digital property has provided explicit user notice. (Y)

The user has NOT made a choice to opt out of sale. (N)

The digital property is not operating under the Limited Service Provider Agreement. (N)

Result: 1YNN

Example 2 meets the following conditions:

Version 1 of the U.S. Privacy string is being used. (1)

The digital property has NOT provided explicit user notice. (N)

The user has made a choice to opt out of sale. (Y)

The digital property is not operating under the Limited Service Provider Agreement. (N)

Result: 1NYN

Example 3: CCPA does not apply

In this example, a digital property has determined to use a U.S. Privacy String and that CCPA does not apply to the transaction.

Result: 1---

Events (CCPA for Web)

Events

isLoaded
callback result: {"event":"isLoaded"}

Fired when the full CCPA implementation has been loaded and assigned to window.__ccpa. If the CCPA is loaded before an event listener is added the listener will be fired immediately after being added.

isReady
callback result: {"event":"isReady"}

Fired when the full CCPA implementation has been loaded and all commands from the queue are processed. If the CCPA is ready before an event listener is added the listener will be fired immediately after being added. Event for document is also fired.

consentChanged
callback result: {"event":"consentChanged"}

Fired on every consent change.

consentManagerDisplayed
callback result: {"event":"consentManagerDisplayed"}

Fired when consent manager is displayed.

consentManagerClosed
callback result: {"event":"consentManagerClosed"}

Fired when consent manager is closed.

consentNoticeDisplayed
callback result: {"event":"consentNoticeDisplayed"}

Fired when consent notice is displayed.

consentNoticeClosed
callback result: {"event":"consentNoticeClosed"}

Fired when consent notice is closed.

consentManagerAlreadyShown
callback result: {"event":"consentManagerAlreadyShown"}

Fired if consent manager is already shown and command for show is called.

consentNoticeAlreadyShown
callback result: {"event":"consentNoticeAlreadyShown"}

Fired if consent notice is already shown and command for show is called.

doNotSellMyDataButtonClicked
callback result: {"event":"doNotSellMyDataButtonClicked"}

Fired on do not sell my data button click and set do not sell to true.

saveAndExitButtonClicked
callback result: {"event":"saveAndExitButtonClicked"}

Fired on save and exit button click and set empty opt out consent array.

disabledCookies
callback result: {"event":"disabledCookies"}

Trigger if cookies are disabled.

consentToolShouldBeShown
callback result: {"event":"consentToolShouldBeShown"}

Trigger after ccpa load.

Vendor List (CCPA for Web)

{
  "specificationVersion": 1,
  "vendorListVersion": 1, // incremented with each published file change
  "purposes": {
    /**
           * Information published for each Purpose
           *
           * "id": number, REQUIRED
           * "name": string, REQUIRED
           * "description": string, REQUIRED
           * "icon": string, REQUIRED
          */
    "1": {
      "id": 1,
      "name": "Storage and access of information",
      "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
      "icon": "storage"
    },
    // ... more purposes from id=2 to id=9 (up to no higher than id=64)
    "10": {
      "id": 10,
      "name": "Develop and improve product",
      "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
      "icon": "develop"
    }
  },
  "features": {
    /**
           * Information published for each Faeture
           *
           * "id": number, REQUIRED
           * "name": string, REQUIRED
           * "description": string, REQUIRED
          */
    "1": {
      "id": 1,
      "name": "Matching Data to Offline Sources",
      "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
    }
    // ... more features
  },
  "dataCategories": {
    /**
           * Information published for each Data Category
           *
           * "id": number, REQUIRED
           * "name": string, REQUIRED
           * "description": string, REQUIRED
          */
    "1": {
      "id": 1,
      "name": "User Identifier",
      "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
    }
    // ... more features
  },
  "vendors": {
    /**
         * Information published for each vendor
         *
         * "id": numeric, REQUIRED
         *
         * "name": string, REQUIRED
         *
         * "purposeIds": array of purpose ids
         *
         * "featureIds": array of feature ids 
         *
         * "dataCategoryIds": array of data category ids 
         *
         * "policyUrl": url string, URL to the Vendor's privacy policy document
         *
         * "deletedDate": date string ("2019-05-28T00:00:00Z") if present,
         * vendor is considered deleted after this date/time and MUST NOT be established to users
         *
         * "optOutUrl": url string, URL to the Vendor's opt out page
         *
         * "cookies": array of cookie names
         *
         */
    "1": {
      "id": 1,
      "name": "Vendor Name",
      "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
      "purposeIds": [
        1,
        3,
        15
      ],
      "featureIds": [
        1,
        2
      ],
      "dataCategoryIds": [
        1,
        2
      ],
      "policyUrl": "<https://vendorname.com/gdpr.html",>
      "optOutUrl": "<https://vendorname.com/opt-out",>
      "cookies": [
        "cookie-name",
        "cookie-name-2"
      ]
    }
    // ... more vendors
  }
}

Audit ID Interoperability (CCPA for Web)

The preference and consent manager is more than just a way to ensure that the end-users preference is stored in a centralised way.

To use this piece of technology to the fullest we’ll have to take a look at the interoperability of the preference and consent manager, or in other words, connecting the audit ID with any data silo available.

Our example will highlight the advantage of connecting the audit id with a login.

This will help create a complete 360° view of the end-user consent across devices.

Example

We start off with the workflow of our use-case.

Once the end-user decides to log-in into their account, after given consent, a script need to be triggered that execute the API to fetch the audit ID, which can then be stored in a variable and passed through together with the login ID with another API to the desired end-point.

Note

It’s important to note that we never override the previous audit ID, but always use the ‘Insert’ statement when storing the audit ID.

With the insert statement we will generate a long array of different audit ID’s together with one login ID. The different audit ID’s represent different devices or audit ID resets, done by the end-user.

This will give you more control over the full consent history, which can be used for auditability purposes, if required.

The API for the audit ID:

__ccpa('getAuditId',[],[], function(data) {console.log('Fetched Audit ID',data)})

Note

The logic of connecting the faktor ID to any other persistent ID available will regardless stay the same. By swapping the login system for any other data-silo you’ll achieve the same results.

Default Configuration (CCPA for Web)

Default configuration is

{
    libraryVersion: version,                                     // Version of the library
    logging: false,                                              // can be a string defining the level of logging (debug, info, warn, error) or a boolean. A boolean value of true is equivalent to debug. A boolean value of false disables logging
    ccpaApplies: true,                                           // Force ccpa applies to all users
    configVersion:                                               // Version of the configuration
    appId:                                                       // Used for reporting
    useSecondLevelDomain: false,                                 // if true local cookies will be set on second level domain
    vendors: {},                                                 // List of vendors and purposes for each vendor that are relevant to publisher
    vendorListLocation: './vendor-list.json',                    // optional location of the JSON file that holds a list of vendors. This file must be able to be requested from the domain that the CMP is loaded on.
    forceLocale: null,                                           // Force consent tool language
    consentLoggingURL: '<http://localhost:4200',>                  // URL for external consent logging
    dailyActiveUserLoggingURL:                                   // Link to kinesis for daily active users logging
    localization: {},                                            // custom translations
    publicPath:                                                  // Internal property used for webpack config
    supressUI: false,                                            // if true and CMP is loaded inside iframe UI won't be shown
    forceMobile:                                                 // Force mobile configuration. Used for preview
    redisplayAfter: {                                            // after what period of time will consent tool be redisplayed, on page load, value is in seconds
        optIn: 10368000,                                         // re-trigger the notice x seconds after the user opted-in
        optOut: 2592000,                                         // re-trigger the notice x seconds after the user opted-out
        vendorChange: 604800,                                    // re-trigger the notice x seconds after a new vendor or purpose has been added
        configChange: 604800                                     // re-trigger the notice x seconds after a the configuration version changed
    },
    noticeConfig: {
        id: 'cmp-faktor-io-brand-consent-notice',                // id which will be set to the brand consent notice iframe
        location: '<http://localhost:3000',>                       // location of the app
        display: 'always',                                       // should notice be displayed and when, never|always|onlyIfDNT
        hideAfter: null,                                         // number of seconds after which consent notice will be hidden. If zero is specified, notice will not be hidden automatically
        loadLimit: null,                                         // Number of times that consent notice will be shown in 24 hours on page load
        desktopConfig: {
            logo: './logo.jpg',                                  // logo to be shown on the brand notice
            type: 'bar',                                         // type of brand notice, bar|corner
            position: 'top',                                     // position of brand notice, bar(top|bottom|modal) corner(topLeft|topRight|bottomLeft|bottomRight)
            showBackdrop:                                        //
            height: 40,                                          // bar and corner height in percentage
            width: 40,                                           // bar and corner width in percentage
            color: '#ffffff',                                    //
            background: {
                gradient: true,                                  // should brand notice background be gradient
                startColor: '#DD8257',                           // brand notice background gradient start color
                endColor: '#2A9CD2'                              // brand notice background gradient end color
            },
            showCloseButton: true,                               // should close button be shown in brand notice
            saveAndExit: {
                show: true,                                      // should saveAndExit be shown
                showAsTextLink: false,                           // should saveAndExit be presented as button or link
                style: {                                         // saveAndExit css properties
                    textSize: 24,
                    textColor: '#000000',
                    backgroundColorStart: '#d5632d',
                    backgroundColorEnd: '#d5632d',
                    paddingTop: 10,
                    paddingRight: 20,
                    paddingBottom: 10,
                    paddingLeft: 20,
                    showBorder: false,
                    borderColor: '#d5632d',
                    borderWidth: 0,
                    borderRadius: 0,
                    showBoxShadow: false,
                    boxShadowColor: '#d5632d',
                    boxShadowX: 0,
                    boxShadowY: 0,
                    boxShadowBlur: 0,
                    showHover: false,
                    hoverBackgroundColorStart: '#d5632d',
                    hoverBackgroundColorEnd: '#d5632d',
                }
            },
            doNotSellMyData: {
                // same properties as for saveAndExit
            },
            privacyLinks: {
                style: {
                    textSize: 24,
                    textColor: '#000000',
                    bold: false,
                    italic: false,
                    underline: false,
                    showIcon: false,
                    iconColor: '#d5632d',
                    icon: 'settings',
                }
            }
        },
        mobileConfig: {
            mobile: true,
            matchDesktop: false,
            // same properties as for desktopConfig
        }
    },
    managerConfig: {
        location: '<http://localhost:4200',>                       //
        allowLoadInIframe: false,                                //
        id: 'cmp-faktor-io',                                     //
        logo: './assets/logo.jpg',                               //
        name: 'faktor.io',                                       //
        backdrop: 'rgba(0,0,0,0.5)',                             //
        showCloseButton: true,                                   //
        defaultLocale: {                                         //
            code: "en",
            name: "English"
        },
        supportedLocales: [                                      //
            {
                code: "bg",
                name: "Bulgarian"
            }
        ],
        topics: [
            {
                title: 'Why do you need my consent?',
                icon: 'consent',
                text: `<ul><li><p>You have the rights to withdraw your consent at any time.</p></li><li><p>Some Vendors are not requesting consent, but processing your data on the basis of their legitimate interest.</p></li></ul>`,
                tip: 'You can always review and manage your data by clicking the fingerprint icon on the bottom right of your screen.',
                expanded: true
            },
            .
            .
            .
        ] 
    },
    toggleConfig: {
        displayToggleOnMobile: true,                             // should toggle be shown on mobile devices
        displayToggle: true,                                     // should toggle be shown
        id: 'toggle',                                            // id which will be set to the toggle
        zIndex: 2147483646,                                      // z-index of the toggle
        position: 'bottomRight',                                 // set position of the toggle, topRight|bottomRight|topLeft|bottomLeft|CSS-Selector
        toggleUrl: null,                                         //
        color: '#ffffff',                                        // change default toggle color
        backgroundColor: 'red',                                  //
        gradient: {
            isSet: true,
            topColor: '#DD8257',
            bottomColor: '#2A9CD2'
        }
    }
}

Perform a QA for CCPA for Web

When you have implemented the script, you can perform a quick QA yourself to ensure a compliant setup.

  1. Is the CMP loading?

  2. Is the U.S. privacy string present?

  3. Is the CMP implemented on top of the HTML Code?

  4. Turn debug mode on/off.

  5. Decode U.S. Privacy string

1. Is the CMP loading?

Before starting testing the CMP, you should turn on debug mode through Console.

(Please refer to the debug section at the bottom of the page)

The following log: Successfully loaded CMP version is an indicator that the CMP is loading correctly.

2. Is the U.S. privacy string present?

To check U.S. privacy string:

  1. Open the console.

  2. Make a choice (save and exit )

  3. Go to Network tab in the console

  4. Search for "ads?" call for U.S. privacy string

PM-Perform_QA_CCPA_Web-example_privacy_string.png

3. Is the CMP implemented on top of the HTML Code?

It is highly recommended to have the CMP script implemented as high as possible in the header area and above any ads or content tags.

In case it is not possible to be implemented in the header, make sure to include the stub in the header of the page (or before any ad calls to queue the calls to the CMP).

4. Turn Debug Mode On/Off

To turn debug mode on or off, navigate to the Admin section of the Console, head to Advanced Settings and you will see the Debug mode check box:

PM-Perform_QA_CCPA_Web-debug_mode_checkbox.png

5. Decode the U.S. Privacy String

The Framework provides a mechanism to notify downstream vendors that the publishers who are a part of it have provided explicit notice of “sale” that is required by the CCPA, and whether the consumer exercised their right to object to the sale by clicking a “Do Not Sell My Personal Information” link. The U.S. Privacy string can be broken down into four main components:

String Component

Expected Value

Definition

1) Specification Version

Number

(1 char in string)

The version of this string specification

2) Explicit Notice/Opportunity to Opt Out

ENUM

(N = No

Y = Yes

– = Not Applicable)

Has explicit notice been provided and the opportunity to opt out of the sale of their data?

3) Opt-out Sale

ENUM

(N = No

Y = Yes

– = Not Applicable)

Has a user opted-out of the sale of his or her personal information?

4) LSPA

ENUM

(N = No

Y = Yes

– = Not Applicable)

Publisher is a signatory to the IAB Limited Service Provider Agreement

(LSPA)

The USP String is added to all ad requests, bid requests, and user synchronisation to ensure the information flows between each member of the ad tech ecosystem and that the sender and recipient are able to properly comply with the CCPA.

You can use any of online tools such as Consent String Decoder to decode your U.S. Privacy string.