Skip to content
Branch: master
Find file Copy path
Find file Copy path
3 contributors

Users who have contributed to this file

@lironzluf @tomerlevy1 @bpaduch
84 lines (58 sloc) 3.22 KB


Example installation of the Outbrain widget

The examples below must be accompanied by AMP-enabled widgets delivered by Outbrain’s Account Management Team, do not directly install this code with existing widgets.


<amp-embed width="100" height="100"

Sticky Ad

<amp-sticky-ad layout="nodisplay">
  <amp-ad width="300" height="100"

Note that <amp-sticky-ad /> component requires the following script to be included in the page:

<script async custom-element="amp-sticky-ad" src=""></script>

See AMP documentation for more information regarding <amp-sticky-ad /> component.


For details on the configuration semantics, please contact Outbrain’s Account Management Team.
These configurations are relevant for both <amp-ad /> and <amp-embed />.

Required parameters

  • data-widgetIds: Widget Id/s Provided by Account Manager.

Optional parameters

  • data-htmlURL: The URL of the standard html version of the page.
  • data-ampURL: The URL of the AMP version of the page.
  • data-styleFile: Provide publisher an option to pass CSS file in order to inherit the design for the AMP displayed widget. Consult with Account Manager regarding CSS options.

User Consent

The widget will check for user consent to decide whether personalized or non-personalized recommendations should be displayed.

The following rules will be applied:

  • CONSENT_POLICY_STATE.SUFFICIENT - Show personalized recommendations
  • CONSENT_POLICY_STATE.INSUFFICIENT - Show non-personalized recommendations only
  • CONSENT_POLICY_STATE.UNKNOWN_NOT_REQUIRED - Show personalized recommendations
  • CONSENT_POLICY_STATE.UNKNOWN - Show non-personalized recommendations only


Widget is cut off

According to the AMP API, "resizes are honored when the resize will not adjust the content the user is currently reading. That is, if the ad is above the viewport's contents, it'll resize. Same if it's below. If it's in the viewport, it ignores it."


You can set an initial height of what the widget height is supposed to be. That is, instead of height="100", if the widget's final height is 600px, then set height="600". Setting the initial height will not finalize the widget height if it's different from the actual. The widget will resize to it's true dimensions after the widget leaves the viewport.

You can’t perform that action at this time.