Skip navigation

Monetized widgets

We provide some web components you can embed on your website to prompt users to get access at Monetized, as well as verify access tokens once they get access.
The web-components/custom-elements are available at npm with their source available at GitHub.
 
We also provide an API that you can use to implement custom widgets and middleware to do same. At present, we only provide one custom element: <monetized-link-riser>

<monetized-link-riser>

Use this web component/widget to:
  1. Prompt user to get access at Monetized. The widget figure out whether current page URL (where the component is embedded) is monetized at www.monetized.link and show a pop-under to redirect users to correct page at Monetized.
  1. Validate access token once users access your link from Monetized. If the token is invalid, expired, or missing, we’ll show the prompt again.
You can demo this widget here.

Usage

  1. Include monetized-link-riser.js in your page.
    1. Add <monetized-link-riser>to your page’s markup:

      Customization

      Styles

      You can customize the look and feel with these CSS variables:

      Attributes

      Following HTML attributes are supported on this custom element:
      Attribute name
      Type
      Default value
      Description
      publication
      string
      -
      If a page is monetized by multiple users, you can provide your publication ID to ensure we keep only the links corresponding to this publication.
      page-id
      string (Page ID)
      Inferred from page URL.
      If you want entitlement correspond to specific page ID, you can provide it here. This will lead to faster checks, as we won’t need to find the monetized page by URL. This is useful when you’re monetizing something other than a URL to your site.
      page-url
      string (Page URL)
      Current page URL (window.location.href)
      If you want to provide a different page URL to search for, you can provide it here. We’ll search only based on domain and path (query parameters and hash are ignored).
      strict
      boolean
      false
      Strict mode: Ensures the token corresponds to only the page monetized at https://www.monetized.link (matches page id as well as publication ID). The presence of this attribute enables the strict mode, regardless of what value you set it to.

      Custom element name

      You can customize the name of the custom element, for example to bypass adblocker filters.