Toggle

Give your readers control over what they see

Ever wished readers could hide verbose output while keeping the code visible? The toggle extension adds a button to your code blocks that shows or hides the output on demand.

Think of it as the opposite of Quarto’s code-fold. Instead of hiding code and showing output, Toggle hides output and shows code.

Installation

To install the toggle extension, follow these steps:

  1. Open your terminal.

  2. Execute the following command:

quarto add coatless-quarto/toggle

This command will download and install the extension under the _extensions subdirectory of your Quarto project. If you are using version control, ensure that you include this directory in your repository.

Requirements

  • Quarto >= 1.7.0

Usage

  1. Add the filter to your document’s YAML header:
---
title: "My Document"
format: html
filters:
  - toggle
---
  1. Enable toggle for specific code cells by adding toggle: true:
```{python}
#| toggle: true
print("Hello, Python world!")
```

That’s it! A toggle button will now appear when you hover over the code block.

Want toggle on every cell? Add output-toggle: true at the document level:

extensions:
  toggle:
    output-toggle: true
filters:
  - toggle

Options

Set these under extensions.toggle or per-cell with #| comments:

Option Default Purpose
output-toggle false Add toggle buttons to all cells
output-hidden false Start with outputs collapsed
output-sync false Sync all outputs in a cell together
global-toggle false Floating button to toggle everything
persist false Remember state across page reloads
button-text "Output" Label shown on the button

Check out the guides in the sidebar to see each of these in action.

Questions?

  • FAQ — Quick answers to common questions
  • GitHub Issues — Found a bug? Let us know