quarto vignettes

pkgdown effectively uses quarto only to generate HTML and then supplies its own CSS and JS. This means that when quarto introduces new features, pkgdown may lag behind in their support. If you’re trying out something that doesn’t work (and isn’t mentioned explicitly below), please file an issue so we can look into it.

Operation

pkgdown turns your articles directory into a quarto project by temporarily adding a _quarto.yml to your articles. You can also add your own if you want to control options for all quarto articles. If you do so, and you have a mix of .qmd and .Rmd files, you’ll need to include the following yaml so that RMarkdown can continue to handle the .Rmd files:

project:
  render: ['*.qmd']

GitHub actions

Currently, you’ll need to manually install Quarto in your GitHub actions. (Hopefully this will change in the future). Add the following lines to install quarto:

     - name: Set up Quarto
       uses: quarto-dev/quarto-actions/setup@v2

Limitations

Callouts are not currently supported (https://github.com/quarto-dev/quarto-cli/issues/9963).
pkgdown assumes that you’re using quarto vignette style, or more generally an html format with minimal: true. Specifically, only HTML vignettes are currently supported.
You can’t customise mermaid styles with quarto mermaid themes. If you want to change the colours, you’ll need to provide your own custom CSS as shown in the quarto docs.
pkgdown will pass the lang setting on to quarto, but the set of available language is not perfectly matched. Learn more in https://quarto.org/docs/authoring/language.html, including how to supply your own translations.

Supported features

The following sections demonstrate a bunch of useful quarto features so that we can make sure that they work.

Inline formatting

Small caps
Here is a footnote reference¹

Code

1 + 1
#> [1] 2
2 + 2
#> [1] 4

plot(1:3)

Figures

Equations

$\frac{\partial \mathrm C}{ \partial \mathrm t } + \frac{1}{2}\sigma^{2} \mathrm S^{2} \frac{\partial^{2} \mathrm C}{\partial \mathrm C^2} + \mathrm r \mathrm S \frac{\partial \mathrm C}{\partial \mathrm S}\ = \mathrm r \mathrm C \qquad(1)$

Cross references

See Figure 1 for two cute puppies.

Black-Scholes (Equation 1) is a mathematical model that seeks to explain the behavior of financial derivatives, most commonly options.