AMP

amp-access-poool

Description

Displays a Poool paywall.

 

Required Scripts

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

Usage

The amp-access-poool component, based on amp-access, loads and shows a paywall using your bundleID from Poool's Dashboard configuration.

See poool.tech for more details. amp-access-poool is based on, and requires, amp-access.

As you'll know if you're familiar with how Poool works outside of AMP, you cannot use excerpt and hide modes here. This is due to AMP's specific behavior. You will be able to lock or unlock your content with the access variable which is provided by amp-access. Check out the poool-widget section just below.

The amp-access-poool component does not require an authorization or pingback configuration because it is pre-configured to work with Poool.

For more information about modes, check out our SDK documentation.

Configurations

You have to set configuration attributes within AMP in camelCase instead of the underscore (" _ ") symbol traditionally used by Poool.

For example : use customSegment="amp-custom-segment" to achieve poool("config", "custom_segment", "amp-custom-segment");.

HTML sections

Set poool-widget section, which contain poool paywall when access isn't granted.

The amp-access-poool component requires 3 different sections:

  • The article preview, shown when access hasn't been granted yet (with amp-access="NOT access") and identified by Poool using the poool-access-preview attribute
  • The article content, shown when access has been granted (with amp-access="access"), hidden by the amp-access-hide attribute until access has been granted, and identified by Poool using the poool-access-content attribute
  • Poool's Paywall container, shown when access hasn't been granted yet (with amp-access="NOT error AND NOT access"), identified by Poool using the poool id
<section poool-access-preview amp-access="NOT access">
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur
    ullamcorper turpis vel commodo scelerisque.
  </p>
</section>

<section poool-access-content amp-access="access" amp-access-hide>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur
    ullamcorper turpis vel commodo scelerisque.
  </p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur
    ullamcorper turpis vel commodo scelerisque.
  </p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur
    ullamcorper turpis vel commodo scelerisque.
  </p>
</section>

<section amp-access="NOT error AND NOT access" id="poool"></section>

amp-access script - poool config

Example: Basic paywall configuration (with default values)

Configuration is similar to AMP Access, except no authorization, pingback or login url is required.

<script id="amp-access" type="application/json">
  {
    "vendor": "poool",
    "poool": {
      "bundleID": "Your app id provided by poool",
      "pageType": "premium",
      "itemID": "amp-example-article"
    }
  }
</script>

Example: Show a paywall for a user in a custom group/segment called "amp-custom-segment"

<script id="amp-access" type="application/json">
  {
    "vendor": "poool",
    "poool": {
      "bundleID": "Your app id provided by poool",
      "pageType": "premium",
      "debug": "true",
      "cookiesEnabled": "true",
      "itemID": "amp-example-article",
      "customSegment": "amp-custom-segment"
    }
  }
</script>

For more information about configuration variables, check out our SDK documentation.

Attributes

bundleID (required)

Your App ID (you can find it on your Dashboard).

itemID (required)

Your unique article ID.

pageType (required)

Used to tell Poool that a page has been visited by the current user. See documentation for more information.

debug

Enable/disable debug mode. See documentation for more information.

forceWidget

Override current widget for user. See documentation for more information.

loginButtonEnabled

Enable/disable paywall "login" button. See documentation for more information.

signatureEnabled

Enable/disable paywall signature, shown under article content when the article has been unlocked. See documentation for more information.

videoClient

Set default video client (vast, googima) for video widget. See documentation for more information.

customSegment

Override native segments with a custom group/segment slug. See documentation for more information.

cookiesEnabled

Following latest GDPR requirements, we decided to disable cookies by default inside our paywall. You will have to explicitly set this attribute to reflect the user's consent. See documentation for more information.

locale

Set default locale for all texts inside the paywall. See documentation for more information.

context

Override default or native contexts with a custom context value. See documentation for more information.

Validation

See amp-access-poool rules in the AMP validator specification.

도움이 더 필요하신가요?

이 문서를 수십 번 읽었음에도 여전히 궁금한 점이 남아 있나요? 다른 개발자들도 같은 심정일지 모릅니다. Stack Overflow에서 소통해 보세요.

Stack Overflow로 이동
버그나 누락된 기능을 발견하셨나요?

AMP 프로젝트는 여러분의 참여와 기여를 적극 환영합니다! 오픈 소스 커뮤니티를 통해 지속적으로 활동해 주셔도 좋지만 관심 있는 주제에 한 번만 기여하셔도 큰 도움이 됩니다.

GitHub로 이동하기