Permission: Vendor list - U.S. Privacy
Sourcepoint provides a JavaScript code that can be implemented on your property that allows end-users to directly manage their consent preferences on an ongoing basis without having to re-encounter your organization's first layer message. This code is implemented on-page as a link or button.
Your organization may want to only show this link or button on your property if the end-user is based in a particular location that you have defined. In this article, we will cover how to leverage the ccpaApplies field to render your privacy manager link/button to end-users in specific locations.
- ccpaApplies field
- Add privacy manager link/button to property
- Create function to change element's display style
- Complete example
ccpaApplies field
Note: Currently, Sourcepoint only supports U.S. Privacy - CCPA.
The ccpaApplies flag determines whether U.S. Privacy regulations are applicable to the end-user visiting your property based on the geographic location of that end-user. ccpaApplies is configured in the vendor list associated for the property.
From the U.S. Privacy vendor list of the property, navigate to the Applies Scope field and configure the locations that should be included (or excluded).
The value of ccpaApplies will be used in this article to determine whether U.S. Privacy regulations applies to the end-user and conditionally display the button/link to the them.
Add privacy manager link/button to property
Use the directions found in this article to add your privacy manager's JavaScript code onto the property.
It is important that you set the element's display to none so that the button/link is not visible to the end-user. The display will dynamically change with functions we will create later in the article based on the ccpaApplies value. See the example below:
<button id="ccpa_link" style="display:none" onclick="window._sp_.ccpa.loadPrivacyManagerModal(null, 123456)">CCPA Privacy Manager</button>Create function to change element's display style
Finally, the last step is to create a function that will read the value of the ccpaApplies flag and use it to possibly change the display setting of your button or link. In the example below, if ccpaApplies is true then the function will change the element's style from display:none to display:block.
<script type="text/javascript">
__uspapi('getUSPData',1,function(uspData,success){console.log('uspData: ' + JSON.stringify(uspData)+ 'success: ' + success);
if(JSON.stringify(uspData).indexOf("---")===-1){
document.getElementById("ccpa_link").style.display = "block";
}
});
</script>
Complete example
Please find a complete example of the steps outlined in this section:
//Example only. Please use implementation code snippet generated in Sourcepoint portal as stub file may have changed.
<html>
<head>
<script>(function () { var e = false; var c = window; var t = document; function r() { if (!c.frames["__uspapiLocator"]) { if (t.body) { var a = t.body; var e = t.createElement("iframe"); e.style.cssText = "display:none"; e.name = "__uspapiLocator"; a.appendChild(e) } else { setTimeout(r, 5) } } } r(); function p() { var a = arguments; __uspapi.a = __uspapi.a || []; if (!a.length) { return __uspapi.a } else if (a[0] === "ping") { a[2]({ gdprAppliesGlobally: e, cmpLoaded: false }, true) } else { __uspapi.a.push([].slice.apply(a)) } } function l(t) { var r = typeof t.data === "string"; try { var a = r ? JSON.parse(t.data) : t.data; if (a.__cmpCall) { var n = a.__cmpCall; c.__uspapi(n.command, n.parameter, function (a, e) { var c = { __cmpReturn: { returnValue: a, success: e, callId: n.callId } }; t.source.postMessage(r ? JSON.stringify(c) : c, "*") }) } } catch (a) { } } if (typeof __uspapi !== "function") { c.__uspapi = p; __uspapi.msgHandler = l; c.addEventListener("message", l, false) } })();</script>
<script>
window._sp_queue = [];
window._sp_ = {
config: {
accountId: 12345,
baseEndpoint: 'https://cdn.privacy-mgmt.com',
ccpa: { },
events: {
onMessageReady: function () {
console.log('[event] onMessageReady', arguments);
},
onMessageChoiceSelect: function () {
console.log('[event] onMessageChoiceSelect', arguments);
},
onPrivacyManagerAction: function () {
console.log('[event] onPrivacyManagerAction', arguments);
},
onMessageChoiceError: function () {
console.log('[event] onMessageChoiceError', arguments);
},
onConsentReady: function () {
console.log('[event] onConsentReady', arguments);
},
onPMCancel: function () {
console.log('[event] onPMCancel', arguments);
},
onMessageReceiveData: function () {
console.log('[event] onMessageReceiveData', arguments);
},
onSPPMObjectReady: function () {
console.log('onSPPMObjectReady')
},
onError: function () {
console.log('[event] onError', arguments);
}
}
}
}
</script>
<script src='https://cdn.privacy-mgmt.com/unified/wrapperMessagingWithoutDetection.js' async></script>
<script type="text/javascript">
__uspapi('getUSPData',1,function(uspData,success){console.log('uspData: ' + JSON.stringify(uspData)+ 'success: ' + success);
if(JSON.stringify(uspData).indexOf("---")===-1) {
document.getElementById("ccpa_link").style.display = "block";
}
});
</script>
</head>
<body>
<p>CCPA Test</p>
<button id="ccpa_link" style="display:none" onclick="window._sp_.ccpa.loadPrivacyManagerModal(null, 123456)">CCPA Privacy Manager</button>
</body>
</html>
Comments
0 comments