DPS offers several methods for using HTML and JavaScript APIs to enhance the user experience. When you create HTML content for a custom library, a custom store, or an entitlement banner, you can reference the Library and Store API.

For HTML content within a folio, such as an HTML article or a Web Content overlay, you can reference the Reading API. The Reading API includes some some features available in the Library and Store API as well as APIs for geolocation, camera, calendar, and device detection.

Any HTML content you specify in DPS App Builder can reference the Library and Store API. HTML articles or Web Content overlays in a folio can reference the Reading API.

  Library and Store API Reading API
Custom library *  
Custom store *  
Custom slots (web views) *  
Entitlement banner *  
Welcome Screen *  
Information Screen * *
Web Content overlay   *
HTML article   *

The following features provide access to the JavaScript APIs.

Custom library

You can replace the native implementation of the viewer library using HTML, JavaScript, and CSS to fit your needs. By accessing APIs, you can duplicate e-commerce functionality found in the default library and customize it to suit your project design. For information about creating custom libraries and stores, see Custom storefronts and libraries.

Custom storefront
Custom libraries have access to the Library and Store APIs.

Custom slots

Custom slots (also called "custom navigation icons") appear on the bottom navigation bar. When tapped, these custom slots display a web view, such as a custom store or an FAQ page. The web view HTML can include references to the Library and Store API.

Custom navigation icons
Tapping any of the navigation icons displays a web view. The HTML content in each web view can reference the Library and Store APIs.

Entitlement banner

If your app include direct entitlement, you can define an HTML banner to display at the top of the library view, as shown in the above images. You use the banner as a call to action for print subscribers to get immediate access to the content, to make subscription offers, or to display ads. The entitlement banner has full access to the Library/Store API. For details, see Leveraging direct entitlement with DPS.

Welcome Screen

The welcome screen is a transparent web view that displays HTML content between the splash screen and the Library/Store. The HTML content appears the first time customers launch the app after installing it or the first time they launch the app after it's updated. The welcome screen has full access to the Library/Store API. See Getting started with a welcome screen in DPS Developer Center.

Sample Welcome screen
Sample Welcome Screen that gathers information from the Library and Store APIs.

Information Screen

You can display an Information Screen wherever customers are viewing content in your app. For example, you can encourage readers to create an account, download a companion app, access help content, or view other customized offers through a transparent web view. The Information Screen has full access to the JavaScript APIs—either the Library and Store API or the Reading API, depending on where the Information Screen is triggered.

You can launch the Information Screen from either the app level (such as a custom library or entitlement banner) or from the folio level (HTML article or Web Content overlay). The HTML files used in the Information Screen reside on a server outside the app, not within the app. Users must be connected to the Internet to view the Information Screen.

For more information, see New APIs and features in r30.

HTML articles / Web Content overlays

To access JS APIs from within a folio rather than in the library, you can create an HTML article or a Web Content overlay. You can then create digital blow-ins to display different content depending on how the article was acquired, or you can take advantage of the Camera API, the Geolocation API, or various consumer marketing APIs.

Web content overlay
The HTML in this Web Content overlay makes a call to the Reading API to determine how the issue was obtained and displays content accordingly.

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License  Twitter™ and Facebook posts are not covered under the terms of Creative Commons.

Legal Notices   |   Online Privacy Policy