Vivliostyle version 2019.1.101 released!

We have released Vivliostyle version 2019.1.101.

(See the latest Vivliostyle Viewer, and User’s Guide)

This release includes the following improvements:

TOC (Table of Contents) navigation is now enabled

  • TOC panel is enabled when #b= Viewer parameter is used, and the publication has TOC data. In HTML documents, the TOC element is marked up with e.g. <nav role="doc-toc">. Vivliostyle recognizes element that is selected with CSS selector [role=doc-toc], [role=directory], nav li, .toc, #toc as a TOC element.

Support Web Publications and similar multi-HTML documents

  • Supported document types with #b= Viewer parameter are:
    • Unzipped EPUB
      • URL of the OPF file can be specified as well as the top directory of the unzipped EPUB files.
    • Web publication (a collection of HTML documents with reading order)
    • (X)HTML document
      • When (X)HTML document URL is specified, the URL is treated as primary entry page’s, and a series of HTML files are automatically loaded.
        • When the web publication manifest is specified in the primary entry page (X)HTML document, the readingOrder in the manifest is used.
        • If manifest is not specified or “readingOrder” is not in the manifest, the (X)HTML documents linked from the TOC element that is selected with CSS selector [role=doc-toc], [role=directory], nav li, .toc, #toc are loaded.

Support loading documents from GitHub and some specific URLs

  • GitHub and Gist URLs can be directly specified. Vivliostyle loads raw github/gist content when github/gist URL is specified.
  • Aozorabunko (青空文庫) (X)HTML URL can be specified. Vivliostyle loads Aozorabunko’s raw github content when Aozorabunko (X)HTML URL is specified.
  • JS Bin URL is converted to JS Bin output URL and can be loaded. This is useful for testing Vivliostyle output from small HTML + CSS code, as well as Gist.

Publication title and individual HTML document title are now passed to viewer UI

  • [Viewer UI] Reflects viewing document title to the web page title.

‘env(pub-title)’ and ‘env(doc-title)’ environment variables for page headers with publication/document titles

  • Spec: CSS Environment Variables Module Level 1 defines env() function, but env(pub-title) and env(doc-title) are not yet defined so far.
  • env(pub-title): publication title = EPUB, Web publication, or primary entry page HTML title. Enabled when #b= Viewer parameter (= Viewer.loadPublication() function) is used.
  • env(doc-title): document title = HTML title, which may be chapter or section title in a publication composed of multiple HTML documents
  • When title data are not found, i.e. no <title> element in HTML, or env(pub-title) with #x= Viewer parameter, the empty string “” is returned.

Viewport-percentage length units: vw, vh, vi, vb, vmin, vmax, and page-size-percentage units pvw, pvh, pvi, pvb, pvmin, pvmax

  • Spec: CSS Values and Units - Viewport-percentage lengths, but page-size-percentage units are not defined so far.
  • Note: On paged media context, the viewport-percentage units vw, vh, vi, vb, vmin, vmax are relative to the size of the page area, i.e., the content area of a page box and not including margin, border and padding specified on @page rule. This makes a lot of sense, but page size relative units may also be necessary. The pvw, pvh, pvi, pvb, pvmin, pvmax units are similar to the vw, vh, vi, vb, vmin, vmax but the reference size is the page size including page margins.

Support CSS ‘calc()’ function

[Viewer UI] New “User Style Preferences” in the Settings panel

  • New settings: Page Margins, Page Breaks (widows/orphans), Images, Text (base font-size, line-height, font-family)
  • User style CSS code is shown and editable in “CSS Details” box
  • User style CSS is saved in the URL parameter userStyle=data:,/*<viewer>*//*</viewer>*/ and not disappear when reloading, and can be bookmarked in browser.
  • “Font size (%)” reflects the ViewerOptions.fontSize that can be increase/decrease with “Text: larger/smaller” buttons, and this setting is saved in the new URL parameter fontSize=.

[Viewer UI] Vivliostyle Viewer start page with document URL input and usage description

  • When document URL parameter (#b= or #x=) is not specified, the start page is now displayed.
  • Document URL entered by user is reflected in the URL parameter #b=, and when the Enter key is pressed, the document is loaded.

Render All Pages (On/Off) setting

  • On: for Print (all pages printable, page count works as expected)
  • Off: for Read (quick loading with rough page count) – This mode is necessary for viewing large publication composed of a lot of HTML documents.
  • [Viewer UI] This setting can be specified in setting panel and URL parameter renderAllPages=[true | false].
    • The default setting is renderAllPages=false for #b= (Book view) and renderAllPages=true for #x= (individual (X)HTML document).

Enabled ‘vivliostyle’ media type by default

  • This can be used like ‘print’ media type, and useful for distinguish Vivliostyle specific style sheets from general print style sheets.

Other changes

  • Added style rule h1,h2,h3,h4,h5,h6 { break-after: avoid; } to the default style sheet to avoid page/column breaks after headings by default.
  • Fix bug that media attribute is not honored on <style> element.
  • Improved error messages when document loading failed.
  • Renamed the function corresponding the #b= Viewer parameter, loadEPUB() to loadPublication(), that is now not only for EPUB.

For more details, see Release Notes.


  • Development of this version is supported by Japan Business Press Co., Ltd.