AMP

AMP pages can't run the CookieBeam script, because AMP doesn't allow custom JavaScript. Use AMP's own amp-consent component instead and point it at CookieBeam. CookieBeam supplies two things:

• checkConsentHref decides whether this visitor has to be asked. It applies the same regional rules as your banner.
• promptUISrc is the prompt itself: your banner's title, text and button labels in your theme colours. Accepts and rejects go into your consent log, the same as choices made on the banner.

Add it to your AMP pages

Replace YOUR_BANNER_ID with the banner ID from Deployment → Install in the dashboard (the ID in the script URL).

<head>
  <!-- … -->
  <script async custom-element="amp-consent" src="https://cdn.ampproject.org/v0/amp-consent-0.1.js"></script>
</head>
<body>
  <amp-consent id="cookiebeam-consent" layout="nodisplay">
    <script type="application/json">
      {
        "consentInstanceId": "cookiebeam",
        "consentRequired": "remote",
        "checkConsentHref": "https://cookiebeam.com/api/amp/consent/YOUR_BANNER_ID",
        "promptUISrc": "https://cookiebeam.com/api/amp/consent/YOUR_BANNER_ID/prompt",
        "postPromptUI": "cookiebeam-post-prompt"
      }
    </script>
    <div id="cookiebeam-post-prompt">
      <button on="tap:cookiebeam-consent.prompt(consent=cookiebeam)">Cookie settings</button>
    </div>
  </amp-consent>

  <!-- Hold back anything that needs consent until the visitor accepts: -->
  <amp-analytics type="gtag" data-credentials="include" data-block-on-consent>
    <!-- … -->
  </amp-analytics>
</body>

Add data-block-on-consent to every amp-analytics, amp-ad, amp-iframe and embed that sets cookies or tracks. Those elements then wait for the visitor's answer.

The page's domain has to be on the banner, the same as for the script. AMP cache copies (*.cdn.ampproject.org, *.amp.cloudflare.com, *.bing-amp.com) are matched to your domain automatically. The one exception is a very long domain name, which the cache replaces with a hash: choices made on such a cache copy still apply, but they aren't logged.

What visitors see, per region

checkConsentHref matches the visitor's country and region against the regional rules of the published banner, the same way the banner script does:

With regional rules off, every visitor is treated as opt-in.

The response also carries sharedData (consentMode, country, regionalRuleId), which vendors can read through amp-consent.

The prompt

The prompt uses the banner's default translation: title, description, Accept all and the necessary-only button (shown as the reject option). It picks the language from the visitor's browser. To force a language, add ?hl=de to promptUISrc. Links and formatting in the description are shown as plain text.

• Accept unblocks everything and is logged as accept_all.
• Reject keeps blocked elements blocked and is logged as accept_necessary.
• Close (×) dismisses the prompt without an answer. Nothing is logged, and amp-consent asks again on a later visit.

AMP only understands accept or reject for the page as a whole. Per-category choices aren't available on AMP pages.

Limits

• AMP stores the answer itself, separately from the consent cookie your non-AMP pages use. A visitor who accepts on the AMP version of an article is asked again on the regular site, and the other way round.
• A/B tests and consent model experiments don't apply to AMP pages.
• Changes to regional rules reach AMP pages about a minute after you publish.

Testing

Open an AMP page in a private window with #development=1 appended to the URL. The console shows amp-consent's decisions.

To check the regional answer directly:

curl -s -X POST \
  -H 'Origin: https://www.example.com' \
  'https://cookiebeam.com/api/amp/consent/YOUR_BANNER_ID?__amp_source_origin=https%3A%2F%2Fwww.example.com'

Use your own domain in both places. A 403 means the domain isn't on the banner.