HTML pagination | Digital Publishing Suite

This article is for Adobe Digital Publishing Suite customers creating HTML articles. Knowledge of HTML and CSS is required.

In some cases, you want users to flip through an HTML article page-by-page rather than scrolling smoothly. When these articles are displayed in the Content Viewer, it's possible that lines of text or images at the bottom of a page are cropped:

To avoid this problem, you can take measures to paginate HTML articles properly.

Include the following meta tag in the <head> block of the HTML file that you want to paginate. If necessary, remove the older <meta name="viewport" content="width=device-width"> tag, which is no longer required.

Download the pagination CSS template and edit it as necessary. Make sure that it is named "template.css." The template.css file is included with other sample files that you can download here: Download Sample_HTML_Pagination.zip

Copy the template.css file to a css folder in your HTMLResources folder. Create an HTMLResources.zip file by compressing the contents of the folder (not the folder itself). Then, import the HTMLResources.zip file into your folio.

Include only two CSS files in the css folder. When using paginated content, you can reference only the template.css file and one other CSS file.

Including the meta tag in your HTML file references the CSS files automatically. It's not necessary to reference the CSS files specifically.

To avoid style conflicts, do not put CSS files for non-paginated files into the HTMLResources > css folder.

At this time, pagination works only in single-column text.

Subtotal
Promotions
Estimated Shipping
VAT	Calculated at checkout

Total

HTML pagination | Digital Publishing Suite

Products Affected

Issue

Steps

Products

Download

Support & Learning

Buy

Company