AMP

Accelerated Mobile Pages (AMP) are essentially stripped-down pages with minimized HTML. They can be stored in Google's AMP cache, which allows users to access them almost instantly on smartphones and other mobile devices. AMP ships with a lot of components for these stripped-down websites. The amp-consent is one of them. This component takes care of managing user consent as well as rendering the consent layer. The amp-consent component has a fixed list of supported CMPs. The CMPs can take care of rendering the actual consent layer inside an iframe, or the user can build a custom consent layer.

We believe that AMP does not provide the level of privacy that we at Contentpass aim for. Therefore, we offer a Contentpass integration where users who give full consent stay on the AMP site. Contentpass users are sent to the canonical version of the website where Contentpass is already integrated via our web-sdk.

The Contentpass integration into AMP is still in Beta. There is no dedicated amp-contentpass component at the moment. Instead, we rely on the CMP providing functionality to allow us sending the user to the canonical version of the website. As of today, we support integrations with Consentmanager, Didomi and Sourcepoint only. Please reach out to us if you need an integration with a different CMP.

Consentmanager

First, enable Contentpass in your Consentmanager design according to our Consentmanager docs. This will activate Contentpass in the consent layer shown in the amp-consent component.

As mentioned above, we will send Contentpass users to the canonical version of the website. The consent layer is running inside an iFrame created by the amp-consent component and has no access to that information. Therefore, you have to pass the canonical URL as the cpCanonicalUrl URL parameter to the iFrame. You can do so by changing the promptUISrc setting to https://cdn.consentmanager.net/delivery/ampui.php?cpCanonicalUrl=CANONICAL_URL. This will use the CANONICAL_URL template provided by AMP. To allow the code running inside the iFrame to send the user to a different website, a sandbox security setting is required. Apart from the "sandbox" and "promptUISrc" configuration, the rest can stay as is. Here is an example of a fully configured amp-consent component:

warning

The following snippet contains a placeholder value that you need to replace with the correct value for your property

Please replace the {{scriptId}} example with the correct value for your property

You can find the correct values for your property on the Publisher Dashboard

caution

Please do not change the "canonicalUrl=CANONICAL_URL" parameter in the promptUISrc URL. Doing so will stop the AMP integration from working!

<amp-consent id="ConsentManager" layout="nodisplay" type="ConsentManager">
  <script type="application/json">
    {
      "promptUISrc": "https://cdn.consentmanager.net/delivery/ampui.php?canonicalUrl=CANONICAL_URL",
      "sandbox": "allow-top-navigation-by-user-activation",
      "uiConfig": {
        "overlay": true
      },
      "clientConfig": {
        "id": "{{scriptId}}"
      }
    }
  </script>
</amp-consent>

Didomi

As mentioned above, we will send Contentpass users to the canonical version of the website. Thus, you have to integrate Contentpass in your website first. When this is done, you can start with the AMP integration.

In case of Didomi, we replace the default consent layer with a custom Contentpass layer. The following changes need to be done to your amp-consent component configuration. You need to provide the URL to our custom consent layer by setting the promptUISrc attribute. In the clientConfig section, make sure to add your Contentpass parameters to the according Contentpass object, and setting the initial height attribute as well. We recommend you use 80vh to provide enough space for our layer. Lastly, a sandbox security setting is required to allow sending the user to contentpass.net for login or signup from within the iFrame. Otherwise the browser will block the navigation and leave the user on the current website. The rest of your configuration stays as is.

Here is an example of a fully configured amp-consent component.

warning

The following snippet uses placeholder values that you need to replace with the correct values for your property.

Please replace the {{didomiApiKey}} example for the apiKey of your property with the correct one from your Didomi config. You can find this by calling the Didomi.getConfig() method in your browser console. The returned value will be an object containing an app.apiKey property.
The promptUISrc and baseUrl values should use the CNAME created for your property. You must also replace the 1234abcd example value for the propertyId. You can find the correct values for your property on the Publisher Dashboard.

You can find the correct values for your property on the Publisher Dashboard

caution

Please do not change the "cpCanonicalUrl=CANONICAL_URL" parameter in the promptUISrc URL. Doing so will stop the AMP integration from working!

<amp-consent id="consent" layout="nodisplay" type="didomi">
  <script type="application/json">
  {
    "promptUISrc": "https://cp.example.com/amp/ui-didomi.html?cpCanonicalUrl=CANONICAL_URL",
    "sandbox": "allow-top-navigation-by-user-activation",
      "uiConfig": { "overlay": true },
      "clientConfig": {
        "gdprAppliesGlobally": true,
        "config": {
          "notice": {
            "initialHeight": "80vh"
          },
          "app": {
            "apiKey": "{{didomiApiKey}}"
          }
        },
        "contentpass": {
          "baseUrl": "https://cp.example.com",
          "propertyId": "1234abcd"
        }
      }
    }
    </script>
    </amp-consent>

Sourcepoint

First, enable Contentpass in your Sourcepoint scenario according to our Sourcepoint docs. This will activate Contentpass in the consent layer shown in the amp-consent component. You will need to use slightly different JavaScript code in the message to accomodate for technical differences of the AMP implementation. Use the following snippet to trigger the signup action. It works in the web as well as in AMP:

if (typeof window.cp === 'function') {
cp('signup');
} else {
window.parent.postMessage({ sentinel: 'contentpass', operation: 'signup' }, '*');
}

There are limitations of Sourcepoint's AMP-integration we need to set up workarounds for. In particular, Sourcepoint drops the query parameters passed to the default promptUISrc URL. To solve this, and to get our SDK into the consent layer, we provide a custom promptUISrc document that wraps Sourcepoint's document. Please reach out to us to get the correct URL for your AMP site.

A sandbox security setting is required to allow sending the user to contentpass.net for login or signup from the iFrame. Otherwise the browser will block the navigation and leave the user on the current website.

Apart from the "sandbox" and "promptUISrc" configuration, the rest of your configuration stays as is. Here is an example of a fully configured amp-consent component:

warning

The following snippet uses placeholder values that you need to replace with the correct values for your property.

The promptUISrc and propertyHref values should use the CNAME created for your property. Please replace the https://cp.example.com example used in it's place. You must also replace the 1234abcd example for the propertyId.
The accountId and privacyManagerId values should be replaced with the correct values from your account on the Sourcepoint Portal.

You can find the correct values for your property on the Publisher Dashboard

caution

Please do not change the "cpCanonicalUrl=CANONICAL_URL" or "CLIENT_ID" parameters in the promptUISrc URL. Doing so will stop the AMP integration from working!

<amp-consent id="consent" layout="nodisplay" type="SourcePoint">
  <script type="application/json">
    {
      "consentRequired": "remote",
      "consentInstanceId": "SourcePoint",
      "checkConsentHref": "https://cdn.privacy-mgmt.com/wrapper/tcfv2/v1/amp",
      "promptUISrc": "https://cp.example.com/amp/wrapper.html?cpCanonicalUrl=CANONICAL_URL&propertyId=1234abcd&baseUrl=https%3A%2F%2Fcp.example.com&promptUISrc=https%3A%2F%2Fcdn.privacy-mgmt.com%2Famp%2Findex.html%3FauthId%3DCLIENT_ID",
      "sandbox": "allow-top-navigation-by-user-activation",
      "uiConfig": { "overlay": true },
      "clientConfig": {
        "accountId": 1234,
        "mmsDomain": "https://cdn.privacy-mgmt.com",
        "propertyHref": "https://cp.example.com",
        "propertyId": "1234abcd",
        "privacyManagerId": 123456,
        "isTCFV2": true,
        "pmTab": "purposes",
        "stageCampaign": false
      }
    }
  </script>
</amp-consent>

Consentmanager​

Didomi​

Sourcepoint​

Consentmanager

Didomi

Sourcepoint