Bookmarks
Navigate a PDF with bookmarks generated from its headings.
Format generates PDF bookmarks from h1–h6 headings in a Flow. Bookmarks appear in the PDF viewer's outline and link to their headings.
Bookmarks are generated automatically. Add a <Bookmarks> element only to configure heading numbers and separators in their titles.
Finding PDF bookmarks
In macOS Preview, choose Table of Contents from the sidebar menu next to the window controls, or press ⌥⌘3. Preview's separate Bookmarks view lists the pages you bookmark manually with ⌘D or the ⊕ button.
Acrobat calls the PDF outline Bookmarks and Chrome calls it Document outline.
Heading structure
Bookmarks follow the heading hierarchy, including skipped levels: an h4 immediately after an h2 nests under that h2.
Hidden headings (hidden, display: none, or visibility: hidden) and headings outside Flows are excluded. Visually clipped headings that remain available to screen readers retain their bookmarks.
A heading repeated in Flow scaffolding gets one bookmark at its first visible copy. A heading split across pages also gets one bookmark.
Bookmark titles
Titles use the heading text from your markup. Line breaks become spaces. CSS-generated text and text-transform don't affect titles. Page references resolve to page numbers, and footnote markers are omitted.
Override a title
Set data-bookmark to change a bookmark's title without changing the heading on the page:
<h1 data-bookmark="Fees">Tuition fees and financial support</h1><h1 data-bookmark="Fees">Tuition fees and financial support</h1><h1 data-bookmark="Fees">Tuition fees and financial support</h1>Custom titles retain heading numbers by default. The numbers and separator settings also apply to them.
Exclude a heading
Set data-bookmark="" to omit a bookmark while keeping its heading on the page:
<h1 data-bookmark="">Student handbook</h1><h1 data-bookmark="">Student handbook</h1><h1 data-bookmark="">Student handbook</h1>Heading numbers
Heading numbers added by <Numbering> are included by default, even when hidden with CSS. To omit them from bookmarks, set numbers to false:
<Document title="Student handbook" lang="en">
<Numbering />
<Bookmarks numbers={false} />
{/* ...layouts and content... */}
</Document><template>
<Document title="Student handbook" lang="en">
<Numbering />
<Bookmarks :numbers="false" />
<!-- ...layouts and content... -->
</Document>
</template><template data-type="document" data-title="Student handbook" data-lang="en">
<template data-type="numbering"></template>
<template data-type="bookmarks" data-numbers="false"></template>
<!-- ...layouts and content... -->
</template>This removes generated numbers and their separators from bookmark titles. Digits in heading text and <Counter> values remain. Page headings, tables of contents, and running heads are unchanged.
Change the separator
The default separator is a space. Set separator to change the gap between a heading number and its title:
<Bookmarks separator=". " /><Bookmarks separator=". " /><template data-type="bookmarks" data-separator=". "></template>A bookmark such as "3 Fees" becomes "3. Fees". See the Bookmarks reference for empty separators, numbers after the title, and custom number formats.