Google AMP SDK

The Google AMP SDK is an integration that allows you to display widgets on AMP pages. It's in charge of getting content (whether editorial or sponsored) and display it correctly in your AMP pages.

It initialises and identifies the page as yours
It calls our content server to check if there's content to display

Declaring sponsorable slots#

Sponsorable slots can display either your own editorial content or sponsored contents.

Add the following in your <head /> element:

<script src="https://cdn.ampproject.org/v0/amp-ad-0.1.js" async="" custom-element="amp-ad"></script>

You can declare such slots, or places where widgets should appear, by simply putting the following tag where you want them on your pages, making sure you replace YOUR_ACCOUNT_ID with your actual account Id.:

<amp-ad width="300" height="1"
      type="beopinion"
      layout="responsive"
      data-account="YOUR_ACCOUNT_ID">
      <div overflow></div>
</amp-ad>

In order to ensure your sponsorable slots are correctly filled, we highly recommend naming them, this way the SDK will still be able to identify them. If your desktop or mobile slots have a data-name attribute set, the AMP slots must have the same data-name for the content configuration to work properly.

Example:

<amp-ad width="300" height="1"
      type="beopinion"
      layout="responsive"
      data-account="YOUR_ACCOUNT_ID"
      data-name="below-article">
      <div overflow></div>
</amp-ad>

Declaring editorial-only slots#

info

Editorial slots are for editorial contents only and will not allow you to display sponsored contents at all. See previous section if you would like to declare slots that may display sponsored contents as well as editorial content.

Add the following in your <head /> element:

<script src="https://cdn.ampproject.org/v0/amp-beopinion-0.1.js" async="" custom-element="amp-beopinion"></script>

You can declare slots, or places where widgets should appear, by simply putting the following tag where you want them on your pages, making sure you replace YOUR_ACCOUNT_ID with your actual account Id.:

<amp-beopinion width="375" height="1"
      layout="responsive"
      data-account="YOUR_ACCOUNT_ID">
</amp-beopinion>

In order to ensure your editorial slots are correctly filled, we highly recommend naming them, this way the SDK will still be able to identify them. If your desktop or mobile slots have a data-name attribute set, the AMP slots must have the same data-name for the content configuration to work properly.

Example:

<amp-beopinion width="375" height="1"
      layout="responsive"
      data-account="YOUR_ACCOUNT_ID"
      data-name="below-article">
</amp-beopinion>

If a slot is declared for a specific content, the content Id can be specified. To do so, replace YOUR_CONTENT_ID with your actual content Id.

<amp-beopinion width="375" height="1"
      layout="responsive"
      data-account="YOUR_ACCOUNT_ID"
      data-name="below-article"
      data-content="YOUR_CONTENT_ID">
</amp-beopinion>

caution

Please note that given AMP technical limitations, the "Add creative" button isn't available on AMP pages. You can use it from the canonical page.