Display Modes (Non-Interactive)

Control how details blocks appear in PDF, Word, and other non-interactive formats.

Display Modes

Set the display attribute to control content visibility within non-interactive formats using one of the following modes:

Mode	Description
"show"	Display full content in a callout (default)
"placeholder"	Show callout with placeholder text
"remove"	Remove the block entirely

Global Configuration

Set the default display mode for all non-interactive formats either in document metadata or _quarto.yml.

For example, to set the default to placeholder mode in the Quarto document:

---
extensions:
  details:
    non-interactive:
      display: "placeholder"
      non-interactive-summary: "Details"
      placeholder-text: "Interactive content not available."
      callout-type: "note"
---

Per-Element Configuration

Override the global setting for individual details blocks using the display attribute inside the details Div.

Show Mode (Default)

The show mode displays the full content of a details Div inside a callout block. That is, the content is fully visible in non-interactive formats.

::: {.details summary="Full Content" display="show"}
This content appears in full.
:::

Gives:

Full Content

This content appears in full in non-interactive formats as a callout block.

Placeholder Mode

For non-interactive formats, we can show a callout with placeholder text instead of the full content.

::: {.details summary="Interactive Widget" display="placeholder" placeholder-text="See online version for interactive demo."}
<iframe src="demo.html"></iframe>
:::

This gives:

Interactive Widget

This interactive content is replaced with placeholder text in PDF/Word.

Remove Mode

Under this mode, the entire details block is omitted from non-interactive outputs.

::: {.details summary="HTML Only" display="remove"}
This disappears in PDF/Word.
:::

Gives:

Web-Only Feature

This entire block is removed from non-interactive output.

(This block will not appear in non-interactive formats.)

Alternative Summary Text

Specify different summary text for non-interactive formats using non-interactive-summary attribute:

::: {.details summary="Click to expand" non-interactive-summary="Additional Information"}
Content here.
:::

Gives:

Click to expand

Content here.

Callout Types

The callout type for non-interactive formats can be customized using the callout-type attribute. For example, with tip and warning types:

::: {.details summary="Tip" callout-type="tip"}
:::

::: {.details summary="Warning" callout-type="warning"}
:::

Available types: note, tip, warning, caution, and important.