Skip to content

Make the Callout Blocks collapsible globally in your HTML document

License

Notifications You must be signed in to change notification settings

shafayetShafee/collapse-callout

Repository files navigation

collapse-callout

A very simple filter extension For Quarto that provides options from document yaml header (i.e. global options) to make the Callout Blocks in your document collapsible. By specifying true or false, you can either make the Callout Blocks collapsed or keep them expanded by default.

And Note that, Callout blocks collapsibility works only for html format.

Installing

quarto install extension shafayetShafee/collapse-callout

This will install the extension under the _extensions subdirectory. If you're using version control, you will want to check in this directory.

Using

Collapsing all types of callout blocks

Add the following to yaml header of your document to make all of the callout blocks in your document collapsed by default.

title: "Collapse-callout Example"
filters:
  - collapse-callout
collapse-callout:
  all: true
format: html
---

here all can be either true or false.

Collapsing specific types of callout blocks

You can also set the collapsibility for specfic types of callout blocks in the following way,

---
title: "Collapse-callout Example"
filters:
  - collapse-callout
collapse-callout:
  tip: true
  note: false
  warning: false
  important: false
  caution: true
---

here tip and caution types Callout blocks will be in collapsed form and rest of the callout blocks will be in expanded form by default.

If you do not want to make a specfic type of Callout Blocks collapsible, simply do not include its name under collapse-callout in the yaml header.

Therefore, the following will not do anything for important type Callout blocks,

---
title: "Collapse-callout Example"
filters:
  - collapse-callout
collapse-callout:
  tip: true
  note: false
  warning: false
  caution: true
---

A few things to note,

  • If you use all option, specific options (i.e. tip, important etc.) will not be used.

  • if you set collapse=false or collapse=true manually in the callout divs in the document source file (that is in the qmd file), this filter will not overwrite that.

Example

Source Files Rendered HTML Output
A minimal example where all Callout Blocks are collapsible and collapsed (with all: true) example_all_true.qmd Rendered Output
A minimal example where all Callout Blocks are collapsible and expanded (with all: false) example_all_false.qmd Rendered Output
A minimal example where some specific types of Callout Blocks are collapsible and collapsed or expanded example_specific.qmd Rendered Output