AMP Implementation

AMP Support is available only with PRO / PAYWALL PRO / ENTERPRISE plans. Compare available plans and prices here

Core principals

When a user visits an AMP page for the first time, AMP framework requests checkConsentHref URL and determines if the user consent is required.

  • If NOT - page ads are displayed immediately;
  • If YES - framework creates an iframe with promptUISrc src and displays the consent tool UI. When the user makes a decision, preferences are saved and sent back to the framework to be stored in the user's browser. On the next visit, the consent string is re-used AND also re-sent to checkConsentHref for verification.

We provide two ways of integration:

  1. Without domain parking. The user has to give consent separately on AMP and non-AMP versions of your site.
  2. With domain parking through CNAME record. This way, both AMP and non-AMP versions of your site can utilize the same user consent data (pop-up shown once).

AMP integration without domain parking

To add Clickio Consent on AMP version of your site, follow the steps below:

Step 1: Install AMP сonsent support library
  • Go to the Code tab of the Consent (CMP). Expand the AMP integration link.
  • Copy the AMP-consent tag and insert it in the <head></head> on all AMP pages of your website.
Step 2: Install consent HTML tag with the ‘Change privacy settings’ link
  • Copy the consent HTML tag.
  • The text ‘Change privacy settings’ can be edited and translated into your site’s language.
  • Place the code on all AMP pages of your website, where you want the ‘Change privacy settings’ link to be located (for example, in footer or header).
Step 3: Set up ads pausing

Add the 'data-block-on-consent' attribute to all <amp-ad> or <amp-sticky-ad> tags to prevent them from rendering without consent.

<amp-ad data-block-on-consent ... > ... </amp-ad>
<amp-sticky-ad data-block-on-consent ... > ... </amp-sticky-ad>

AMP integration with domain parking

To allow transparent usage of consent cookies in both AMP and non-AMP versions of your site, we offer publishers to park a subdomain which will be used to serve Consent Tool UI iframe in AMP site version, so that cookies can be set/read directly to/from user browser.

This logic works only for sites on https, due to browsers security restrictions

Step 1: Create a subdomain

Create a subdomain to serve Consent Tool UI, e.g. consent.yourdomain.com.

Step 2: Add CNAME record

Create the record consent.yourdomain.com. CNAME consent.clickiocdn.com. in your DNS provider control panel, replacing yourdomain.com with the actual domain name of your site.

Please report the created domain name to your Clickio manager or to our support team, for us to approve it and set up the backend part.

There is no need to change consent script URLs on the www version of your site.

Step 3: Install AMP сonsent support library
  • Go to the Code tab of the Consent (CMP). Expand the AMP integration link.
  • Copy the AMP-consent tag and insert it in the <head></head> on all AMP pages of your website.
Step 4: Install consent HTML tag with the ‘Change privacy settings’ link

Example (with placeholders): 

  • The text ‘Change privacy settings’ can be edited and translated into your site’s language.
  • Place the code on all AMP pages of your website, where you want the ‘Change privacy settings’ link to be located (for example, in footer or header).

The URLs specified in the consent config tag are not meant to be called directly, so return 400 http error code in that case.

Step 5: Set up ads pausing

Add the 'data-block-on-consent' attribute to all <amp-ad> or <amp-sticky-ad> tags to prevent them from rendering without consent.

<amp-ad data-block-on-consent ... > ... </amp-ad>
<amp-sticky-ad data-block-on-consent ... > ... </amp-sticky-ad>