quarto presentation templates

Beautiful Reports and Presentations with Quarto

Quarto - visual editor.

Static documents

• A static document is your “daily driver” - has the power for a complex table of contents, figure alignment, control of ouptut/code, and other niceties
• Useful as a lab notebook, scratchpad, or the final output for your team
• Most powerful as the combination of written thoughts and observations along with source code

You may have a set of parameters that are used to create different variations of a report. For example:

• Showing results for a specific geographic location.
• Running a report that covers a specific time period.
• Running a single analysis multiple times for different assumptions.

Python - Papermill style

R - YAML style

CLI/Terminal

Render with Parameters

Parameters for modeling

Example adapted from tidymodels docs

Unified Syntax

Quarto’s unified syntax.

Pandoc fenced divs

• Start and end with equal number of : - minimum of 3 :::
• Add curly brackets to indicate the start/end of class {.class} or {sometimes-class}

Split up and flip between sections of a page, alternative to just two columns

Pandoc bracketed spans

This is magic text

• Surround text with [text]

You can create inline footnotes like so: some inline text with a^[footnote]

If you hover your mouse over the citation and footnote in this sentence you’ll see a popup displaying the reference contents:

Unified syntax

Layout image inline with paragraphs

Put image into the “gutter”/column margin

Add footnotes:

Hide all code

Turn back on at individual code-block level:

Turn on at individual code-block level:

Code tools, source

For example, here we specify that we want only “View Source” (no toggling of code visibility) and no caption on the code menu:

Code tools, source repo

In some situations (especially for longer documents), you may prefer to send viewers to the source code on a version-control website rather than the built in viewer.

Code appearance

Code highlighting.

Full highlighting options

Code linking with downlit

The goal of downlit is to provide syntax highlighting and automatic linking of R code

HTML Appearance

Out of the box, Quarto is styled with Bootstrap 5 and opinionated defaults.

Bootstrap is the most popular CSS Framework for responsive websites, where v5 is the latest.

Quarto comes pre-installed with 25 themes from Bootswatch and you can use them like so:

Or you can customize a theme with CSS/SCSS/SASS.

Bootswatch themes

PDF Articles

See more on Journal Articles at https://github.com/quarto-journals/

More PDF + LaTeX templates

Great work from the NFMS Open Science team on “Quarto titlepages”: https://nmfs-opensci.github.io/quarto_titlepages/

The tex templates were written by Eli Holmes and the lua filter along with changes to the Pandoc templates to allow themes was written by Mickaël Canouil .

Presentations

Output types.

Quarto supports a variety of formats for creating presentations, including:

revealjs — reveal.js (HTML)

pptx — PowerPoint (MS Office)

beamer — Beamer (LaTeX/PDF)

Follow-up reading

• Emil Hvitfeldt’s Slidecraft 101: Colors and Fonts
• Meghan Hall’s Quarto Slides

Shared structures

• Incremental reveal/lists
• Multiple columns for layout
• Title/subtitle/author/etc
• Code/Output

Creating slides

Incremental lists.

Controllable via YAML:

Or turn on/off via fenced divs:

Multiple Columns

Presentations with format: revealjs.

Alt + Click to Zoom in to a section

Absolute Position

Absolute position allows for tight control of placement.

output-location: column-fragment

Quarto comes with 10 built-in themes:

beige , blood , dark , default , league , moon , night , serif , simple , sky , solarized

Themes + SCSS/SASS

Footer/logo.

One off footer:

Did you notice the footer?

Slide Background

Changing the background color will modify the font color for better contrast

Background videos

Automatically plays a full size video behind the slide.

r-stack + fragments

Custom classes

From Emil’s article :

Custom Classes

Applying classes

Use bracketed spans: [text to color]{.yellow} or use RStudio’s Visual Editor:

Read all the docs at https://quarto.org/docs/guide/

• Quarto docs: Documents
• Quarto Gallery: Articles + Reports
• Quarto Journal Articles
• “Quarto titlepages”: https://nmfs-opensci.github.io/quarto_titlepages/
• Quarto docs: Presentations
• Quarto Gallery: Presentations
• Andrew Heiss’ Quarto slides on APIs and webscraping with R

thomasmock.quarto.pub/reports-presentations

05 - Presentations

Making slides with code, tom mock | 2022-07-25, quarto presentation formats.

• revealjs - essentially the replacement for xaringan , but with Pandoc-native syntax
• beamer for LaTex slides
• Powerpoint for when you have to collaborate via Office

reveal.js is an open source HTML presentation framework. It’s a tool that enables anyone with a web browser to create fully-featured and beautiful presentations for free.

revealjs for Quarto is a framework for turning Pandoc-friendly markdown + code into beautiful slides

User guide: https://quarto.org/docs/presentations/revealjs/

Core workflow

• Open materials/workshop/05-presentations/revealjs-penguins.qmd
• Explore the code
• Add a new slide with a level 2 header and some text

YAML for these slides

Transitions.

Slide numbering

Presentation preview

• In the latest version of RStudio, Quarto revealjs presentations will open up as a “background job” in the Presentation tab.

• Using RStudio, create a new revealjs Quarto presentation
• author for your name
• titled “My first Quarto Presentation!”
• Add slide numbering (what do the different types mean?)
• Write out what you did this morning (woke up, ate breakfast, walked to this room, etc) in sub-sections
• New sections should have level 2 headers
• Add a code chunk
• Link out to an image with markdown syntax

revealjs vs xaringan

• xaringan for RMarkdown uses only knitr and remark.js , without Pandoc and with some Pandoc-incompatabilities
• revealjs was a lesser known RMarkdown package, but is the primary HTML slide generator for Quarto

If you loved xaringan , you’ll love revealjs !

Presentation Visual Editor

Unlike xaringan , Quarto + revealjs can be edited with the RStudio Visual Editor!

Separate slides

Level 2 header = new slide

Level 1 header = new slide and new section

• --- can also delineate slides via horizontal rules or leave the heading “blank” for untitled slides

Reminder about pandoc div and spans

• Create lists with - or * or 1.

Incrementally reveal elements with:

Or affect globally:

Or turn it off for specific lists

Incremental lists

• Second item

Incremental reveal

Not limited to just bullet points…

Use . . . syntax to indicate a break at an arbitrary location

You can also make a point with fragments

Highlight red

Fade in, then out

Slide up while fading in

Fragments, nesting

Fragments can be nested to affect the same “text” multiple times

Fade in > Turn red > Semi fade out

Fragments, spans

This is an important sentence!

Mind the gap when riding the rail!

Fragments, order

Appears last

Appears first

Appears second

• Open materials/workshop/05-presentation/fragments.qmd
• Make the portions appear in order: top -> bottom and left -> right

Column layout

On the left

On the right

Output location, column-fragment

Output location, column

Output location, fragment

Output location, slide

Column Layout, arbitrary fragment

If you try . . . syntax WITH ::: {.columns} - it won’t be incremental… BUT:

These appear first

You can nest .incremental + .fragment to get your expected behavior.

• Create a new presentation with RStudio> New Quarto Presentation
• Create two columns with the ::: {.columns} and use .fragment tags on the columns for incremental reveal of those columns

Stack layout

Incremental reveal of images/content

Fit Text {.r-fit-text}

Stretch images {.r-stretch}.

Fit to the remaining space - this is the default behavior in revealjs

Title Slide, YAML edition

Title slide, diy, logo and footer.

A footer can also be set by slide with:

https://themockup.blog

Slide alignment

• Heading level one will be center-aligned
• Heading level two will be left-aligned

Right aligned!

• Some bullets
• Another bullet

Slide backgrounds, color

Slide backgrounds, images.

Note, you may need to set a background-color to black/white to “force” the text to contrast.

Footnotes in presentations are placed at the bottom of the slide and numbered.

For example, did you know that Howard is a dog 1 ?

He also likes to sleep 2

Asides are like footnotes, but don’t have numbers 1 .

• Create a new revealjs presentation
• Aside/footnote
• Tabset with code and output (two options on how!)
• Code highlighting walking through at least two lines
• A slide with an image as the background

Code line-highlighting

Use #| code-line-numbers: "3" syntax - will highlight line and fade other lines

Sometimes you want to make a point though…

And I often want to “walk through” a set of code!

Themes/Appearance

https://quarto.org/docs/presentations/revealjs/themes.html

Arbitrary HTML + Position absolute

Position = absolute, position = .absolute.

Position .absolute

Auto-animate.

Automatically animate matching elements across slides with Auto-Animate.

Get started with Quarto

quarto-templates

A collection of personal templates for quarto, quarto templates.

This repository contains a collection of personal Quarto PDF templates. The templates share a similar style, using Pandoc Markdown , Libertine and Inconsolata fonts, British English spelling, coloured links, double spacing, back references, and numbered sections. Future updates will include templates for presentations and academic posters.

To compile the PDFs, you need to install Quarto and TinyTex . If you prefer TeX Live, you can find instructions for installing it here: https://tug.org/texlive/ .

The templates require Python and Jupyter for optimal functionality, thus installing these is advised. R users should remove the jupyter: python line from the YAML header within the templates and install both the quarto-r and rmarkdown packages in addition to the Quarto-cli .

Every folder contains a PDF file displaying the template’s output. Check them out to see how the documents look like. A screenshot of the article template is shown below.

Comments and suggestions are most welcome. Feel free to open an issue or submit a pull request. If you find the templates useful, please consider starring the repository. Thank you!

Let’s make a presentation with Quarto

Quarto presentation formats.

revealjs essentially the replacement for xaringan

beamer for LaTex slides

Powerpoint for when you have no choice…

What is revealjs?

reveal.js is an open source HTML presentation framework. It’s a tool that enables anyone with a web browser to create fully-featured and beautiful presentations for free.

There is an R package for RMarkdown

but it is rarely used since xaringan (based on knitr and remark.js , no Pandoc) is more popular

No need to learn new syntax

Render to pptx? set format: pptx Render to beamer? set format: beamer

HTML divs and spans with Pandoc

Pandoc translates this to

Incremental lists

Incremental slides.

Use . . . syntax

This appears first

This second

Fragments, Basics

Highlight red

Fade in, then out

Slide up while fading in

Fragments, More

This is an important sentence!

Fade in > Turn red > Semi fade out

Slide Transition

Slide transition, global, column layout.

Left column

Right column

Output location, column-fragment

Output location, column

Output location, fragment

Output location, slide

Code line-highlighting

Use #| code-line-numbers: "3" syntax - will highlight line 3 and fade others

with a “fragment style”

highlight different line ranges progressively

Stack images

Themes, Colors and other bling

Background color and image.

Background color:

Background image:

see https://quarto.org/docs/presentations/revealjs/themes.html

Themes via custom SASS

custom.scss :

Themes via Extensions

Install Extension ( in the folder of your presentation ):

use in yaml header:

Very creative themes can be found here

Give me more

Automated Reports & Co with Quarto and Markdown

Navigation Menu

Search code, repositories, users, issues, pull requests..., provide feedback.

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly.

To see all available qualifiers, see our documentation .

• Notifications You must be signed in to change notification settings

Templates to make presentations and report in Quarto

tilburgsciencehub/quarto_presentation_template

Folders and files.

Repository files navigation

Quarto templates.

Quarto is a markdown-type language that can be used to make (among others) presentations and reports. More on Quarto and how to install it can be found here .

This template makes it easier to include code and functions in your presentations via markdown. The code is integrated into the slides and you can directly show both the code and it's output on the slides. Quarto allows you to generate html presentations, PowerPoint presentations, or pdf presentations from the same quarto file (this template is optimized for an html presentation using revealJS). This standardized template also ensures you do not have to bother with the formatting every time you need to make a new presentation in a different format.

Contents of the template

The template is made to create presentations in html using quarto for Tilburg University presentations. The templates contains information on how to format the slides and how to insert things like tables and figures.

How to use this template

This template can be used to create presentations with standard formatting and the Tilburg University logo included. To use this template in a new presentation simply run the following line in the command prompt:

This will ask you to specify the name of the folder you want the new presentation to be created in. The name of template.qmd will also be changed to this new name.

The easiest way to edit the content of the template is by opening the qmd file in RStudio or Visual Studio Code here all contents can be changed as preferred.

Customization

You can edit all the content of the template below the yaml specification. Within this specification, you can change the title, author, footer and the name of the .bib file if necessary. You can also choose to use an alternative form of the Tilburg university logo by uncommenting the second logo line and commenting the first one.

Work in progress

More functionalities will be added as examples to this template in the future

Contributors 3

• HTML 100.0%

Revealjs presentations with Quarto: a template

Introduction.

I love blogdown , bookdown , packagedown and other downs ( xaringan not so much). But the new star is Quarto.

The name “Quarto” allegedly comes from the format type used to print the Sibyllenbuch, believed to have been printed by Johannes Gutenberg in 1452–53.

Quarto is a language agnostic CTI tool built on Pandoc that can render our markdown into almost anything (e.g. HTML, PDF, MS Word, Revealjs, ePub, etc.). Just change the extension “ .rmd ” to “ .qmd ” and it will run ( although it is better to fully jump on the Quarto train an embrace the much more elegant settings declarations and chunk options ).

There are many tutorials about Quarto and this will not be one of them. I will just point you to a boilerplate reveal.js presentation ( code in Github ) and add a few tips that I consider very important.

What I use:

Collapse Callout Blocks

Font Awesome Extension for Quarto

To use extensions:

• Install from terminal
• quarto install extension repo/quartoextension
• Add extension to the project you use it in
• quarto add repo/quartoextension

Print to PDF:

Toggle into Print View using the E key (or using the Navigation Menu).

Open the in-browser print dialog (CTRL/CMD+P).

Change the Destination setting to Save as PDF.

Change the Layout to Landscape.

Change the Margins to None.

Enable the Background graphics option.

Github Pages doesn’t render the presentation correctly if it is not self-contained HTML ( looks like this ). To obtain a self-contained HTML we use embed-resources: true but this has some drawbacks.

Embedding video using Quarto default functionality fails when using embed-resources: true ( fixed in Quarto 1.3 , but current version I use is version 1.2.269).External videos (e.g. youtube) embedding work with iframe and data-external="1" .

Chalkboard plugin conflicts with embed-resources: true so it must be disabled.

Claudiu-Cristian Papasteri

Psychologist, psychotherapist, researcher.

• Hugo blogdown posts with in-browser interactive code chunks using webR and Quarto
• Pocket guide to Exploratory and Confirmatory Factor Analysis in R
• Automated systematic literature search using R, litsearchr, and Google Scholar web scraping
• Automated systematic literature search using R, litsearchr and easyPubMed
• Top 5 RStudio Addins for productivity and quality of life

Quarto Templates for Lecturers and Educators

• James Adams
• jmablog.com
• [email protected]

I'm a data scientist, data coach, sports therapist and scientist, former parkour coach, and coding dabbler.

Quarto is a fantastic scientific and technical document publishing tool that I just discovered - it’s basically Rmarkdown, but expanded beyond R to become a standalone document processor, whether that be just for markdown or including R, Python, and JavaScript code 1 .

While looking through the Quarto docs, I realised that it also solves another problem I had when I was lecturing as part of my Masters degree last year - generating multiple file formats from a single input file! I didn’t bother blogging about it, but last year I ended up setting up a convoluted Pandoc and Pandocomatic workflow to generate PDF, HTML, and Word / Powerpoint files from a single markdown input.

Why? Well, I believe that providing multiple file formats is better for the student experience, letting them download and use them in a format convenient for them. In particular, a well formatted HTML file is very portable, able to adapt and display nicely on a range of device sizes 2 .

The trouble is, maintaining multiple file formats by hand is a nuisance - you change one thing, and have to update it in three different places. Instead, having a single source of truth - a markdown file, in this case - that the other formats build from is much easier to manage and update.

So, I went ahead and updated my Pandocomatic workflow to use Quarto, and I couldn’t be happier. It’s much simpler and more straightforward, requiring a lot less technical setup to use.

There are two versions of these workflows:

Worksheets - to produce working materials / documents for classes

Presentations - to produce slides for lectures / tutorials

Full details on how to setup and use these workflows are in the GitHub repos linked above. I deliberately kept them simple in style and substance - while Quarto can produce some really nice documents, I used my own templates to strip everything right back to basics, whilst still looking pleasing and clean. Using my own templates did break a bit of Quarto functionality in my testing, so I’ve included my own lua filter 3 to re-implement the things I consider essential, as well as a little extra function in the auto-linking of questions and answers in the Worksheets.

Thanks for reading, I hope these workflows might be even a tiny bit helpful to someone out. Get in touch if you’ve got any writing / document processing tips of your own to share!

• Seriously, it does so much stuff. ↩︎
• Also, giving a nice range of options for use with screen readers and other accessibility tools through semantic HTML. ↩︎
• See my blog post on lua filters for details on how to write your own! ↩︎

📂 Recent posts in Blog :

• Some Animated Joins February 26, 2023
• Tinier 0.5.0 August 18, 2022
• How To Spot Bad Coaching Advice Online March 9, 2022

18   Templates

Presentations

From R Markdown to Quarto

Duke University + Posit

UC Berkeley

Anatomy of a Quarto presentation

Metadata: YAML

Text: Markdown

Code: Executed via knitr or jupyter

Weave it all together , and you have a beautiful, functional slide deck!

Let’s build a presentation together from hello-penguins-slides.qmd and showcase the following features of Quarto presentations:

Hierarchy, headers, and document outline

Incremental lists

Columns and tabsets

Code, output location, code highlighting

Logo and footer

Making things fit on a slide

Publishing your presentation to Quarto Pub

Printing to PDF

Pick up where we left off and

Change the transition style between slides

Change the slide size

Add slide numbers

Let’s continue building our a presentation together from hello-penguins-slides.qmd and showcase the following features of Quarto presentations:

Title slide attributes

Speaker notes

Quarto presentation formats

revealjs for HTML slides

• Essentially the replacement for xaringan , but with Pandoc-native syntax

beamer for LaTeX slides

PowerPoint for when you have to collaborate via MS Office

quarto.org/docs/presentations

Any questions / anything you’d like to review before we wrap up this module?

mine.quarto.pub/quarto-asa-nashville

Making Slides in Quarto with reveal.js

Meghan Hall

My Quarto journey begins

Quarto is a new open-source technical publishing system from RStudio. It is similar in many ways to R Markdown (which isn’t going away, don’t worry!), except that it doesn’t require R, supports more languages, and combines the functionality of many R Markdown packages (e.g., xaringan, bookdown).

I am a devoted R Markdown user, but I want to start exploring the new Quarto features. My first project was slides for a workshop —I would normally use the R Markdown-backed xaringan for HTML presentations, but I decided to try out the Quarto alternative, which uses reveal.js.

The slides I made with Quarto are here , and the code is on GitHub here .

A lot of the functionality is similar to using xaringan or other similar R Markdown HTML formats, but there’s lots of new syntax to learn (as well as plenty of new features!), so I put this post together to compile a few things I learned while making a Quarto presentation for the first time.

Quarto resources

My favorite introduction to the publishing system itself is Alison Hill’s comprehensive post . Mine Çetinkaya-Rundel also has an ongoing blog with a new Quarto tip each day.

For specifics about making presentations with reveal.js in Quarto, the docs , demo presentation , and demo presentation code are all incredibly useful.

First things first—how to use emojis in Quarto?? Thankfully, this was an easy one. By adding the following line to your YAML:

You can reference emojis in text by writing :wave: to get 👋 . The full list of emoji codes is available here .

( This is a good list of what overall YAML options are available.)

Custom elements

There are built-in presentation themes within Quarto, and just like with xaringan, you have the option to customize one of the provided themes or completely build your own. To do so, create a custom.scss file and reference it in your YAML:

My custom.scss file that I used for my slides is here , and in addition to some “common” customizations like specifying background color, font color, link color, etc., there were a few specific aspects I wanted to change or add.

Code block appearance

By default, code blocks in Quarto have the same background color as the slides themselves, with a lightened border (all of the default elements are listed here ). I wanted a lighter background for my code block, with a dark border, so I made the following changes to my .scss file:

Footer text

The default footer in Quarto reveal.js slides has text centered at the bottom of the page, but I wanted my footer to have smaller text that was aligned to the right. This seemed to be a very simple customization, but tinkering with the .footer class in my .scss file was not working and I couldn’t figure out why.

Later, after I had given up 😑 , I was browsing through the reveal.js GitHub issues (another technique I recommend for learning!) and happened to stumble upon one that just so happened to contain the solution to my footer problem! The default footer.css file is part of a reveal.js plugin that loads after any theme or custom files. And that’s how I learned about the !important property! Adding that property to my elements allowed me to finally edit the footer. As JJ wrote in that issue, this is “coloring outside the lines.”

Section header

The slides I developed have different sections, and I wanted to design something to sit in the top-right corner that would indicate the current section. To do so, I created a new class in my .scss file called .sectionhead .

I wish I had a more specific recommendation for learning CSS/SCSS (please share if you have a favorite resource!), but everything I’ve learned I’ve gotten through either googling or by looking through the files of other people’s work that I like. Figuring out how to do this .sectionhead was searching how to make a text box in CSS and lots of playing around with the different elements until I got something I liked.

Finding elements to customize

This is very specific and random, but there is a feature in Quarto slides that fades out text on a click. It appears to fade out by ~50%, but I wanted it to fade out even more. But where do you even start in figuring out how to customize that?

To reference the feature in slides, you use .fragment.semi-fade-out . So I searched the Quarto repo for that exact string and found it here , in the main .scss file for reveal. That file provided the default syntax, which I was able to copy into my custom.scss file and then edit to make the change I wanted to the opacity.

Absolute position

One of the most useful features of Quarto reveal.js slides is absolute position , which allows you to specifically place elements on a slide.

I used this to place images, of course, but I also used it to annotate screenshots and code with text (like in the example above), place my .sectionhead on each slide, and in cases like the slide below, add a little outline for emphasis.

These elements can also be added as fragments, i.e., to show up on a click. The following code places those two boxes (which I created with a new .blackbox class in my .scss file ) on the slide. The . . . at the top of this code chunk indicates that they appear on a click after the rest of the slide code. You could also put a . . . between those two code sections to have the boxes show up on separate clicks.

Code customizations

Code blocks in reveal.js allow for a lot of customizations, and these are the two I found most useful.

Code folding

For some examples while teaching, I want the code available but don’t necessarily need it all on the screen, which could be unwieldy and/or distracting. The code-fold option is great for this, as the code is only available “on demand,” and you can even specify what text should be shown next to the arrow. The code below shows the code-fold and code-summary options in use.

Side note: I like how the chunk options here are in the chunk itself, preceded by #| , instead of in the {r} brackets—it’s much more readable.

Incremental code highlighting

Code highlighting isn’t a new feature in and of itself (you could definitely highlight code lines in xaringan), but here it’s very easy to “step through” code by highlighting various lines on a click. This is super useful for focusing attention during teaching and explaining code line-by-line.

The following option would start by highlighting lines 1 and 2 of the code block, then line 3 on a click, then line 4 on a click: #| code-line-numbers: "1-2|3|4"

Styling text

Figuring out how to style text was a bit of a learning curve for me—not because it’s difficult, it’s just different from xaringan and I couldn’t find it well-explained in the docs (though the docs are so comprehensive, I probably just missed it somewhere). The code for the demo presentation was useful for picking up some styling examples. My best overall tip is to keep up with other people’s work and when you spot something you like, find the GitHub file and figure out how they did it!

If you want, for example, red words , you’d type [red words]{style="color:#cc0000"} .

Larger chunks

If instead you wanted to adjust the style of a larger chunk of text, indicate the section with ::: (which needs to be echoed at the end) and use the same {style} syntax.

R Without Statistics

10 reproducible reporting with quarto.

Quarto, the next-generation version of R Markdown, offers a few advantages over R Markdown. First, the syntax it uses across output types is more consistent. As you’ve seen in this book, R Markdown documents might use a variety of conventions; for example, the distill package has layout options that don’t work in xaringan , and xaringan uses three dashes to indicate new slides, while three dashes in other output formats would create a horizontal line.

Quarto also supports more languages than does R Markdown, as well as multiple code editors. While R Markdown is designed to work in the RStudio IDE, Quarto works in RStudio as well as code editors such as VS Code and JupyterLab, making it easy to use with multiple languages.

This chapter focuses on the benefits of using Quarto as an R user. It explains how to set up Quarto, then covers some of the most important differences between Quarto and R Markdown. Lastly, you’ll learn how to make the parameterized reports, presentations, and websites covered in previous chapters using Quarto.

Creating a Quarto Document

Versions of RStudio starting with 2022.07.1 come with Quarto installed. To check your RStudio version, click RStudio in the top menu bar, then click About RStudio . If you have an older version of RStudio, update it now by reinstalling it, as outlined in Chapter 1 . Quarto should then be installed for you.

Once you’ve installed Quarto, create a document by clicking File > New File > Quarto Document . You should see a menu, shown in Figure 10.1 , that looks like the one used to create an R Markdown document.

Figure 10.1: The RStudio menu for creating a new Quarto document

Give your document a title and choose an output format. The Engine option allows you to select a different way to render documents. By default, it uses Knitr, the same rendering tool used by R Markdown. The Use visual markdown editor option provides an interface that looks more like Microsoft Word, but it can be finicky, so we won’t cover it here.

The resulting Quarto document should contain default content, as do R Markdown documents:

Although R Markdown and Quarto have many things in common, they also have differences. Let’s explore them.

Comparing R Markdown and Quarto

Quarto and R Markdown documents have the same basic structure: YAML metadata, followed by a combination of Markdown text and code chunks. Despite the similarities between the formats, there are some variations in their syntax.

The format and execute YAML Fields

Quarto uses slightly different options in its YAML. It replaces the output field with the format field and uses the value html instead of html_document :

Other Quarto formats also use slightly different names than their R Markdown counterparts: docx instead of word_document and pdf instead of pdf_document , for example.

A second difference between R Markdown and Quarto is that Quarto doesn’t use a setup code chunk to set default options about things like whether to show code, charts, and other elements in the rendered versions of the document. In Quarto, these options are set in the execute field of the YAML. For example, the following would hide code, as well as all warnings and messages, from the rendered document:

Quarto also allows you to write true and false in lower case.

Individual Code Chunk Options

In R Markdown, we override options at the individual code chunk level by adding the new option within the curly brackets that start a code chunk. For example, the following would show both the code 2 * 2 as well as its output:

Quarto instead uses the following syntax to set individual code chunk-level options:

You can see that the option is set within the code chunk itself. The characters #| (known as the hash pipe ) at the start of a line indicate that we are setting options.

Dashes in Option Names

Another difference you’re likely to see if you switch from R Markdown to Quarto is that option names consisting of two words are separated by a dash rather than a period. R Markdown, for example, uses the code chunk option fig.height to determine the height of plots. In contrast, Quarto uses fig-height , as follows:

Helpfully for those of us coming from R Markdown, fig.height and similar options with periods in them will continue to work if you forget to make the switch. A list of all code chunk options can be found on the Quarto website at https://quarto.org/docs/reference/cells/cells-knitr.html .

The Render Button

You can follow the same process to render your Quarto document as in R Markdown, but in Quarto the button is called Render rather than Knit. Figure 10.2 shows the Render button.

Figure 10.2: The Render button

Clicking the Render button will turn the Quarto document into an HTML file, Word document, or any other output format you select, just as we did when working with R Markdown.

Parameterized Reporting

Now that you’ve learned how Quarto works, let’s make a few different documents with it, starting with a parameterized report. The process of making parameterized reports with Quarto is nearly identical to doing so with R Markdown. In fact, you can take the R Markdown document used to make the Urban Institute COVID Report in Chapter 7 and adapt it for Quarto by copying the .Rmd file and changing its extension to .qmd , then making a few changes:

In this code, we’ve switched output: html_document to format: html in the YAML, We’ve also removed the setup code chunk and put the options that were there in the YAML. Lastly, we’ve switched the fig.height option in the last code chunk to fig-height and used the hash pipe to label it as an option.

Next, to create one report for each state, we must tweak the render.R script file we used to make parameterized reports in Chapter 7 :

This updated render.R file loads the quarto package instead of the rmarkdown package and changes the input file to urban-covid-budget-report.qmd . In the reports tibble, we use execute_params instead of params because this is the argument that the quarto_render() function expects. To render the reports, we use the quarto_render() function instead of the render() function from the markdown package. As in Chapter 7 , running this code should produce one report for each state.

Making Presentations

Quarto can produce presentations like those you made in Chapter 8 with the xaringan package. To make a presentation with Quarto, click File > New File > Quarto Presentation . Choose Reveal JS to make your slides and leave the Engine and Editor options untouched, as shown in Figure 10.3 .

Figure 10.3: The RStudio menu to make a new Quarto presentation

The slides we’ll make use the reveal.js JavaScript library under the hood, a technique similar to making slides with xaringan . The following code updates the presentation made in Chapter 8 so it works with Quarto:

In the YAML, we set format: revealjs to make a presentation and add several global code chunk options in the execute section. We remove the three dashes used to make slide breaks, because in Quarto, first- or second-level headings make new slides (though you can use three dashes to manually add slide breaks). When you render this code, you should get an HTML file with your slides. The output should look similar to the default xaringan slides we made.

Incrementally Revealing Content

Quarto slides can incrementally reveal content. To reveal bulleted and numbered lists one item at a time by default, add incremental: true to the document’s YAML:

As a result, the content in all lists in the presentation should appear on the slide one item at a time. You can also set just some lists to incrementally reveal using this format:

Using ::: to start and end a segment of the document creates a section in the resulting HTML file known as a <div> . The HTML <div> tag allows you to define properties within that section. In this code, adding {.incremental} sets a custom CSS class that makes the list reveal incrementally.

Aligning Content and Adding Background Images

to create columns in Quarto slides, too. Let’s say we want to create a slide with content in two columns, as in Figure 10.4 .

Figure 10.4: A slide with two columns

The following code created this two-column slide:

Notice the ::: , as well as :::: , which creates nested <div> sections. We first use a columns class, which tells the HTML that all content within the :::: should be laid out as columns. Then, we use ::: {.column width="50%"} to start a <div> that takes up half the width of the slide. With use closing :::: and ::: to indicate the end of the section.

When using xaringan , we easily centered content on a slide by surrounding it with .center[] . Doing the same thing in Quarto is slightly more complicated. Quarto has no built-in CSS class to center content, so we need to create one ourselves. Begin a CSS code chunk and a custom class called center-slide :

Using CSS, we center-align all content. (The text-align property aligns images, too, not just text.) We then apply the new center-slide class by putting it next to the title of the slide, as follows:

With the custom CSS applied, the slide should now center all content.

Lastly, when working in xaringan , we added a background image to a slide. We can do the same thing in Quarto by applying the background-image attribute to a slide, as follows:

This should add a slide with the text Penguins in front of the selected image.

Customizing Your Slides with Themes and CSS

We’ve started making some changes to the look-and-feel of the Quarto slides. As with xaringan , there are two main ways to further customize your slides: using existing themes and changing the CSS.

Themes are the easiest way to change what your slides look like. Quarto has many themes you can apply by adding their name to your YAML, as follows:

Using this option should change the theme from the default of light to a dark theme. You can see the title slide with the dark theme applied in Figure 10.5 . To see the full list of available themes, go to https://quarto.org/docs/presentations/revealjs/themes.html .

Figure 10.5: A slide with the dark theme applied

You can also write custom CSS to change your slides further. Quarto uses a type of CSS called Sass that lets us include variables in the CSS. These variables resemble those from the xaringanthemer package, which allowed us to set values for header formatting using header_h2_font_size and header_color .

Go to File > New File > New Text File , create a Sass file called theme.scss , and add the following two mandatory sections to it as follows:

In the scss:defaults section, we can use the Quarto Sass variables. For example, to change the color and size of first-level headers, add this code:

All Quarto Sass variables start with a dollar sign, followed by a name. To apply these tweaks to your slides, adjust your YAML to tell Quarto use the custom theme.scss file:

Figure 10.6 shows the changes applied to the rendered slides.

Figure 10.6: A slide with custom CSS applied to it

All pre-defined variables should go in the scss:defaults section, and you can find the full list of variables at https://quarto.org/docs/presentations/revealjs/themes.html#sass-variables . In the sass:rules section, you can add additional CSS tweaks for which there are no existing variables. For example, you could place the code you wrote to center the slide’s content in this section:

Because rendered Quarto slides are HTML documents, you can tweak them however you would like with custom CSS. What’s more, because the slides use reveal.js under the hood, any features built into that JavaScript library work in Quarto. This library includes easy ways to add transitions, animations, interactive content, and much more. The demo Quarto presentation available at https://quarto.org/docs/presentations/revealjs/demo/ shows many of these features in action.

Making Websites

Quarto can make websites without requiring the use of an external package like distill . To create a Quarto website, go to File > New Project . Select New Directory , then Quarto website . You’ll be prompted to choose a directory in which to place your project. Keep the default engine (Knitr), check Create a git repository (which should show up only if you’ve already installed git). and leave everything else unchecked. Your screen should look like Figure 10.7 .

Figure 10.7: The RStudio menu to create a Quarto website

Click Create Project , which should create a series of files: index.qmd , about.qmd , *_quarto.yml , and styles.css . These files resemble those created by the distill package. The .qmd files are where we’ll add content, the _quarto.yml* file is where we’ll set options for the entire website, and the styles.css file is where we’ll add CSS to customize the website’s appearance.

Building the Website

Let’s start by modifying the .qmd files. Open the home page file, index.qmd , delete the default content below the YAML and replace it with the content from website you made in Chapter 9. Remove the layout = "l-page" element, which we used to widen the layout. We’ll discuss how to change the page’s layout in Quarto later in this section:

To render a Quarto website, look for the Build tab in the top right of RStudio and click Render Website . The rendered website should now appear in the Viewer pane on the bottom-right panel of RStudio. If you navigate to the Files pane on the same panel, you should also see that a _site folder has been created to hold the content of the rendered site. Try opening the index.html file in your web browser. You should see the website in Figure 10.8 .

Figure 10.8: The Quarto website with warnings and messages

As you can see, the web page includes many warnings and messages that we don’t want to show. In R Markdown, we removed these in our setup code chunk; in Quarto, we can do this in the YAML. Add the following code to the index.qmd YAML to remove all code, warnings, and messages from the output:

Note, however, that these options will make changes to only one file. Next, we discuss how to set these options for the entire website.

Setting Options for the Website

When using distill , we modified the *_site.yml* file to make changes to all files in the website. In Quarto, we use the *_quarto.yml* file for the same purpose. If you open it, you should see three sections:

The top section sets the project type (in this case, a website). The middle section defines the website’s title and determines the options for its navigation bar. The bottom section modifies the site’s appearance.

Let’s start from the bottom. To remove code, warnings, and messages for all pages in our website, add the portion of the YAML we created above to the _quarto.yml file. The bottom section should now look like this:

If you build the website again, you should now see just the content, as in Figure 10.9 .

Figure 10.9: The website with warnings and messages removed

In this section of the *_quarto.yml* file, you can add any options you would otherwise place in a single .qmd file to apply them across all pages of your website.

Changing the Appearance of the Website with Themes and CSS

The format section of the *_quarto.yml* file determines the appearance of rendered files. By default, Quarto applies a theme called cosmo , but there are many themes available. (You can see the full list at https://quarto.org/docs/output-formats/html-themes.html .) Let’s apply a different theme to see how it affects the output:

Using the minty theme changes the colors and fonts on the website, as shown in Figure 10.10 .

Figure 10.10: The website with the minty theme

In addition to using pre-built themes, you can customize your website with CSS. The css: styles.css section in the *_quarto.yml* file indicates that Quarto will use any CSS in the styles.css file when rendering. Try adding the following CSS to styles.css to make first-level headers red and 50 pixels large:

The re-rendered index.html, shown in Figure 10.11 , now has large red headings.

Figure 10.11: The website with custom CSS applied

An alternative approach to customizing your website is to use Sass variables in a .scss file, as you did in your presentation. For example, create a file called styles.scss and add a line like this one to make the body background bright yellow:

To get Quarto to use the styles.scss file, adjust the theme line as follows:

This syntax tells Quarto to use the minty theme, then make additional tweaks based on the styles.scss file. If you render the website again, you should see the bright yellow background throughout (Figure 10.12 ).

Figure 10.12: The website with custom CSS applied through styles.scss

Note that when you add a .scss file, the tweaks made in styles.css no longer apply. If you wanted to use those, you’d need to add them to the styles.scss file.

The line toc: true creates a table of contents on the right side of the web pages that you can see in the previous screenshots. You can remove it by changing true to false . Add any additional options, such as figure height, to the bottom section of the *_quarto.yml* file.

Adjusting the Website Title and Navigation Bar

The middle section of the *_quarto.yml* file sets the website’s title and navigation. Here, we change the title and the text for the About page link:

Changing the title requires adjusting the title line. The navbar section functions nearly identically to how it does when working with distill . The href line lists the files the navigation bar should link to. The optional text line specifies the text that should show up for that link. Figure 10.13 shows these changes applied to the website.

Figure 10.13: The website with changes to the navigation bar

The title on the home page is still covid-website-quarto , but you could change this in the index.qmd file.

Creating Wider Layouts

When we made a website with distill , we used the line layout = "l-page" to widen the map on the web page. We can accomplish the same thing with Quarto by using the ::: syntax to add HTML <div> tags:

We add :::{.column-screen-inset} to the beginning of the code chunk that makes the map and ::: to the end of the code chunk. We also add the line #| out-width: 100% in the code chunk. This is because we need to specify that the map should take up all of the available width. Without this line, the map would take up only a portion of the window. There are a number of different output widths you can use. The full list is available at https://quarto.org/docs/authoring/article-layout.html .

Hosting Your Website on GitHub Pages and Quarto Pub

You can host your Quarto website using GitHub Pages, just as you did with your distill website. Recall that GitHub Pages requires you to save the website’s files in the docs folder. Change the *_quarto.yml* file so that the site outputs to this folder:

Now, when you render the site, the HTML and other files should show up in the docs directory. At this point, you can push your repository to GitHub, adjust the GitHub Pages settings as you did in Chapter 9, and receive a URL at which your Quarto website will live.

In addition to using GitHub Pages, Quarto has a free service called Quarto Pub that makes it easy to get your materials online. If you’re not a GitHub user, this is a great way to publish your work. To see how it works, let’s publish the website we just made to it. Click the Terminal tab on the bottom-left panel of RStudio. At the prompt, enter the text quarto publish and hit Enter . Doing so should bring up a list of ways you can publish your website, as in Figure 10.14 .

Figure 10.14: The list of providers to publish your Quarto website

Press Enter to select Quarto Pub. You’ll then be asked to authorize RStudio to publish to Quarto Pub. Enter Y to do so, which should take you to https://quartopub.com/ . Sign up for an account (or sign in if you already have one). You should see a screen indicating that you have successfully signed in and authorized RStudio to connect with Quarto Pub. From there, you can return to RStudio, which should prompt you to select a name for your website. The easiest thing is to use your project’s name. Once you enter the name, Quarto Pub should publish the site and take you to it, as shown in Figure 10.15 .

Figure 10.15: The website published on Quarto Pub

When you make updates to your site, you can republish it to Quarto Pub using the same steps. Quarto Pub is probably the easiest way to publish HTML files made with Quarto.

As you’ve seen in this chapter, you can do everything you did in R Markdown using Quarto without loading any external packages. In addition, Quarto’s different output formats use a more consistent syntax. For example, because you can make new slides in Quarto by adding first- or second-level headers, the Quarto documents you use to create reports should translate easily to presentations.

You’re probably wondering at this point whether you should use R Markdown or Quarto. It’s a big question, and one many in the R community are thinking about. The first thing to know is that R Markdown isn’t going away, so if you already use R Markdown, you don’t need to switch. If you’re new to R, however, you may be a good candidate for Quarto, as the R Markdown team has promised to continue its development, and its future features may not be backported to R Markdown.

Ultimately, the differences between R Markdown and Quarto are relatively small, and the impact of switching between tools should be minor. Both R Markdown and Quarto can help you become more efficient, avoid manual errors, and share results in a wide variety of formats.

Consult the following resources to learn the fundamentals of Quarto:

Get Started with Quarto , workshop materials by Tom Mock (2022), https://jthomasmock.github.io/quarto-in-two-hours/

From R Markdown to Quarto , workshop materials by Andrew Bray, Rebecca Barter, Silvia Canelón, Christophe Dervieu, Devin Pastor, and Tatsu Shigeta (2022), https://rstudio-conf-2022.github.io/rmd-to-quarto/

Some Quarto Tips for Academic Presentation

• Show All Code
• Hide All Code
• View Source

Kazuharu Yanagimoto

December 28, 2022

Are You a Beamer Fan?

The other day, I used slides made with Quarto in a presentation at a conference. In the Economics community, 98% of people use Beamer of \(\LaTeX\) , and about 2% use PowerPoint for their presentations. I personally don’t like Beamer’s design, and I think PowerPoint has a problem with maintainability (i.e., can it be easily changed) in case of ongoing projects. I like Quarto for the following reasons:

• Reasonably good design . And highly customizable.
• Time saving . Slides are written in the markdown notation, so you can make it with the same amount of effort as Beamer (unless you care about the design😉)
• Easily maintainable . Variables can be used in the text, so the numbers are automatically updated even if the model or analysis is slightly changed.

Here, I write some tips on Quarto for academic presentations. For the basic slide creation in Quarto, please refer to the official documentation or Tom Mock’s slides at the RStudio conference. The slides used at the conference presentation are not yet ready for public release, so I prepare these example slides

Slides   PDF   Code

I render tables and plots inside of slides. In other words, I am not using the image files for the article. This is because

• Proper font sizes in the article are too small in presentation slides
• Highlighting is not easy. You need to create another figure/table or use complicated TikZ
• I want to unify the design of slides and figures&tables

Hence, I create and save a data frame in a separate file and load it just before plotting it.

You can use this data frame to refer to its values in a slide text.

This is convenient in case you change your analysis slightly and the values in tb_hoge.rds change. 1 The values will be updated by re-rendering slides.

There are 11 built-in themes provided for Reveal presentations. These are good designs, but to match them with figures&tables, I write custom.scss and make my own theme. Currently, it is like xaringanthemer ’s style_mono_accent() theme. You can check about the customizable parts in the official document .

I write frequently used CSS settings in custom.css , but sometimes I want to use a CSS environment on an ad-hoc basis (for example, to change the font size slightly.)

In these cases, you can write them in style= environment:

Quarto (or Reveal.js) allows some complicated animation. If you are interested, you might want to see Tom Mock’s this part of the slides.

Apart from this, as discussed here , the original fragment separator . . . does not correctly work in environments like columns . From my experience, fragment environment solves them.

Minimizing elements is a starting point of slide design. For that purpose, it is important to use the same fonts and colors for figures (and tables) as the slides. This is the reason why I used to use xaringanthemer , which automatically generates the ggplot2 theme corresponding to the slides’ theme. Unfortunately, there have been no packages for Quarto slides (as far as I know), I declare this theme_quarto() function.

While the original xaringanthemer::theme_xaringan() redefines the primary color of ggplot2::geom_* by ggplot2::update_geom_defaults , my function does not. I did not overwrite it because color palettes must be specified manually for 2+ color cases, anyway. You can use it like:

Highlighting

The most famous way to highlight plots should be gghighlight . You can proceed with your stories smoothly and clearly by

markdown vs.  kableExtra vs.  gt ?

I think they are three popular ways to create tables in HTML slides. while each of them has pros and cons, I am using gt because

Markdown Table

• No highlighting
• No multirow nor multicol from \(\LaTeX\)
• Syntax is a little more complicated than gt (e.g., need to mutate a string column for percentages.)
• Highlighting is slightly more complicated than gt

Note that I use kableExtra for tables in an article due to the following problem.

Problems with Mathematic Expressions

Unfortunately, it is difficult to use mathematical expressions in a table in Quarto. gt does not support \(\LaTeX\) notation. 2 Also, mathematical expressions of kableExtra are not rendered in Quarto ( GitHub Issue ). You can solve it by

but it contains the abovementioned disadvantages of markdown tables.

Then, I compromise by using

• Unicode Greek letters (θ, τ, δ, etc.)
• HTML tags ( <sup> and <sub> )

and evaluating them by gt::fmt_markdown() . Mathematical expressions in tables are usually simple, so I don’t have any problems so far.

The gt package itself can also highlight cells in a table with the function tab_style() . However, this requires redundant writing, so gtExtras::gt_highlight_rows() and gtExtras::gt_highlight_cols() are useful if you want to highlight row/column-wise.

HTML or PDF?

Although I think you use a prepared PC for your presentation, since it is difficult to imagine a PC without a browser, the HTML format is also acceptable. If you write the following in the YAML header, only one self-contained HTML file will be output. So you can easily carry it around like a PDF file. 3

However, you will be asked to submit your slides in PDF format in various situations. And whether or not you actually present your presentation in PDF format, it is a good idea to have PDF slides on hand for insurance purposes.

• Open the HTML file in your browser and press E
• Click “Print” on the browser, then “Save as PDF”

If you want to separate fragments, specify pdf-separate-fragments: true in YAML.

Problems with Hyperlink

A hyperlink that jumps to each slide is essentially a reference to an <h2> tag, so the link can be written as:

However, as far as I know, the link is not reflected in the above PDF output. If anyone knows a solution to this problem, I would appreciate it if you could let me know.

These are some of my ideas for using Quarto for academic presentations. I think that Quarto’s slides are quite suitable for academic presentations, because of their simple syntax, high degree of freedom in design, and high maintainability in numbers. I hope this is useful for you.

In economics, changing the age group of the sample or the parameters of the model sometimes lead to changes in the results. In addition, we sometimes found mistakes in cleaning the data. ↩︎

This issue has been raised in 2019, but it does not seem to be solved quickly. ↩︎

The option self-contained: true produces a deprecated warning. ↩︎

Source Code

VisualStory®

• Duarte DataStory®
• Presentation Principles™

Slide:ology®

Slide Design

• Speaker Coaching
• Presenting Virtually™
• Illuminate™
• Adaptive Listening™
• Team training
• Learning journeys
• Brand and product storytelling
• Keynotes and events
• Sales enablement
• Communication systems
• Accelerator Lab™
• Our culture
• Our leaders
• Case studies
• Media mentions

Guides and tools

• Learner support

6 signs your organization needs a better presentation template

Josh Storie

A good presentation template can work wonders. It can save your people time. It can boost your brand. It can help everyday presentations look clean and professional. It can also make it easy to convey an idea clearly and memorably.

But a bad template? It can do exactly the opposite. It can take up valuable employee time. It can dilute and harm your brand. It can make your presentations look, as the kids say, “cringe.” And it can harm the clarity of your message .

At Duarte, we’ve made thousands of presentations over our 35+ year history for some of the world’s biggest brands. From internal corporate decks, investor pitches , walking decks , sales enablement decks, conference keynote presentations … the list goes on.

Today we’re going to dive into the use cases of a presentation template, and when a company might need or want one.

What is a presentation template?

A presentation template is a set of pre-designed slides already made with a branded, professional look that can be lightly customized for a specific purpose. They typically are made for the purpose of scaling efforts, and in a corporate setting, are used for sales enablement , sales pitches, corporate internal decks, branding and marketing decks, and more.

These templates usually include on-brand design elements like backgrounds, effects, color palettes, layouts, fonts, icon libraries, asset libraries, chart libraries, boilerplate messaging and sample slides for different use cases. They save an organization an immense amount of time as individuals won’t need to design every presentation they make from scratch. They can just select from their pre-determined template the slides and options they want to use for their individual use case.

The best presentation templates are also audience-first . Meaning, they’re designed with the end user in mind so that they are engaging, relatable, and even accessible so all can feel included and welcome during any presentation.

6 signs to know if your organization needs a presentation template

1. people don’t use the template you already have..

If you hear people in your organization say that using your current template is “too hard” or that “it doesn’t have what I need,” you need a better template. Or maybe people use it, but only halfway. If you see people Frankenstein-ing presentations together by inserting their own icons and pictures, using all kinds of different fonts, or pulling slides from a variety of other decks because the current template doesn’t give them the slide layouts or assets they need, it’s time for a better deck.

Why this matters: This is a huge time waster. One example, if your sales team is constantly reinventing the wheel and making a new sales pitch deck for every other sales demo, this is costing you and them valuable time. It’s less time on the phone, and more time working on something that could’ve been handed to them already done, and in a clean, professional, and scalable way, like what we did with Veeam .

2. You need consistency that scales.

Think about if you were running a big conference or event with lots of breakouts, like Dreamforce . It would take an internal design team hundreds of hours to make all those presentations. But the flipside is if your speakers are in charge of making their own slides, it’s tough to ensure consistency across every breakout, as well.

Why this matters: If you had a great slide template that can scale, it would ensure every audience in every room is receiving the same level of quality and user experience with your brand and event.

3. It’s clear your sales team isn’t comfortable with graphic design.

Great salespeople adapt their sales pitch to the needs of the customers. But adapting the pitch oftentimes means adapting the slides. And since your sales team wasn’t hired for their graphic design skills, the new slides can detract from the pitch itself (and probably make their marketing counterparts cringe in disbelief.)

Why this matters: Meeting with potential clients is another touchpoint with your brand. Sales meetings (and the decks within them) should match the professional look of your website, the first-class feeling they’ll receive from your product and service, and the professional experience they’ll receive from your sales team by being a part of your sales funnel. A professional sales deck that doesn’t look like a default PowerPoint template is imperative to not just stand out, but get the point across that your companies cares about details.

4. New technology is limiting technical abilities.

Let’s say you’re making the switch to or from a new slide software like PowerPoint, Google Slides, Apple Keynote , or Canva. There’s always a learning curve when a new technology is introduced. And if there’s not a template that helps users produce quality presentations regardless of their familiarity with the new software, it won’t take long to realize you’re in need of a better template.

Why this matters: Our world-class presentation designers make slide templates in whatever presentation software tool your company prefers. Trust us; we know a thing or two about converting fonts, colors, aspect ratios, and more when it comes to slide presentations built on different platforms. Let us save you the headache and time.

5. Your unique brand needs to stand out.

Whether you sell chocolate or medical devices , your presentation template systems need to be the perfect combination of consistent, business-specific design and ease of use. This means it needs to be on-brand, in your color palette, catered to your audience, and it should include simple rules to follow and easily adaptable templates. One way we help with this is by including icon and asset libraries.

Asset libraries

Great presentations use a variety of visual elements to support content. Our presentation designers will make, and stock your asset library with beautiful, clever, and effective illustrations and images. This way, everyone who will make presentations with your slide template can easily access approved visual elements.

Icon libraries

Our presentation designers are artists. And they often make custom icons for our clients, including custom icon libraries. We take the time to understand the needs of your presentation deck, your business, and your customers, and we tailor everything we do accordingly.

Why this matters: Never send your employees to hunt for a perfect icon or image again, especially when they don’t exist! Equip them with everything they need for all business use cases in advance.

6. Your employees need template training.

You can arm your company with a wonderful presentation template, but that is half the battle. Now, you need to make sure they are oriented on where to find everything they need and how to use it. This will ensure faster adoption.

We provide presentation guidelines, walkthroughs, and mini-tutorials when we hand over our presentation templates to our clients. Sometimes we’ll even do a quick sales enablement training live .

Why this matters: We ensure that our template systems are fool-proof. They can stand up to the worst of conditions, like bad lighting, meeting accessibility standards , projection system variations, and inexperienced users.

How to make perfect presentations every time

Your unique industry requires a presentation ecosystem. This usually includes:

• Audience needs
• Calls to action

We are the experts in presentation structure and have a highly-rated workshop designed to help you become a persuasive communicator . At the conclusion of the workshop, you’ll know how to check that all your presentations have the ingredients needed to be successful. If you want to train a marketing or graphic design team on our presentation expertise, we recommend a learning journey that includes:

• Slide:ology ®

But what if you don’t have time to train yourself or your team to be presentation masters? Well, we have an Agency team for that. Whether you need a quick audit of your template , or a full presentation system complete with icon libraries, image libraries, chart examples, and built-in user instruction, Duarte can help.

Talk to a Solution Architect today to discover what hundreds of clients have already: Our presentations are world-class, and we’ve tested them across every type of delivery channel you can think of. Try the Duarte white-glove experience for yourself.

Check out these related courses

Structure and storyboard a talk

Analyze your audience and organize your ideas into a story structure that will move them. Transform content into visual concepts and build a storyboard for your presentation.

Craft a persuasive talk

Learn how the world’s greatest speakers use story to persuade. Develop a story structure that powerfully expresses your ideas, applying the principles of empathy, contrast, and variety.

Presentation Principles™

Learn presentation basics

Follow a step-by-step method to write compelling stories, amplify ideas visually, and present with confidence while learning at your own pace.

Turn ideas into visuals

Use visual thinking and design principles to transform information into effective and memorable graphics for presentations.

Build effective slides

Create attractive slide decks using presentation software, even if you’re not a designer. Our training, tips, and tricks will help you work smarter, faster, and more efficiently.

Create “skimmable” documents

Build helpful pre-reads and impactful leave-behinds with presentation software to support knowledge sharing and decision-making.

Check out these related resources

What sets a top presentation design agency apart from the rest?

The presentation design agencies do more than just “clean up your slides.” Learn the difference between hiring a presentation designer, a basic presentation design company, and a premium presentation design agency.

Slide Design course overview

Create attractive slide decks using presentation software, even if you’re not ​a designer. Our training, tips, and tricks ​will help you work smarter, faster, and more efficiently.​

Slide:ology ® workshop overview

Use visual thinking and design principles ​to transform information into effective and memorable graphics for presentations.​

Presentation Principles™ course overview

Follow a step-by-step method tell compelling stories, amplify your ideas visually, and present with confidence while learning at your own pace. ​

17 rhetorical devices that will make you sound like Steve Jobs

Want to communicate like Steve Jobs? Join us in an analysis of one of his most famous speeches and how he employed rhetorical devices to make it memorable and moving.

The ultimate guide to contrast: What your presentation is missing

Need to deliver a great presentation? Master the art of contrast to make sure it’s unforgettable and met with success, every time.

Article Templates

Journal article formats often require fine grained control of generated output as well as the ability to use Journal-specific commands and directives. This can be achieved for Quarto formats by providing custom Pandoc templates (LaTeX and/or HTML). Often these templates are a mix of Journal-specific LaTeX and standard directives required by Pandoc. This article describes how to create custom Journal templates that behave well with Pandoc and produce high-fidelity publisher ready output.

Quarto uses Pandoc templates to generate the rendered output from a markdown file. A Pandoc template is a mix of format specific content and variables. The variables will be replaced with their values from a rendered document. For example, the most basic template looks like:

In the above template, the $body$ variable will be replaced with the LaTeX that is generated from the body of the document. If the body text is  Hello **world**!  in Markdown, the value of  $body$  will be  Hello \textbf{world}! .

By providing your own custom template used when rendering, you have complete control of the final output. You can provide this custom template to be used when rendering like this:

For more complete information about template syntax, see Template syntax .

Template Partials

Replacing an entire template gives you complete control of the rendered output, but many features of Pandoc and Quarto depend upon code and variables that appear in the built in templates. If you replace the entire template and omit these variables, features will not work properly.

It’s therefore recommended that you take one of two approaches when authoring templates:

Selectively replace partials that exist within the master LaTeX or HTML template.

Replace the entire LaTeX or HTML template, but then include partials provided with Quarto to ensure that your template takes advantage of all Pandoc and Quarto features.

Below we’ll cover both of these approaches. Note that after reviewing this documentation you may also want to check out the source code of formats published on quarto-journals for additional examples.

Replacing Partials

For LaTeX / PDF and HTML output, Quarto provides built in templates that are composed of a set of ‘partial’ template files. For these formats, you may replace portions of Quarto’s built in template, allowing you to customize just a portion of the template without needing to replace the whole thing. A simple partial to provide custom handling of the document title in LaTeX looks like:

You provide this partial to Quarto like:

When Quarto renders a document with a partial, it will use the built in template but replace a portion of the template with the provided partial. In the above case, the LaTeX title will be replaced with the implementation provided as the partial, while the rest of the built in template will be used.

Note that the name of the partial files is important. You choose which portion of the template to replace by providing a partial with that name. You can see the list of partials available in HTML Partials and LaTeX Partials below.

Including Partials

In addition to replacing built in partials with your own, you may also choose to use built in partials when composing your own template. This allows you to create a template that takes advantage of the capabilities and options provided by Quarto and Pandoc without copying and maintaining the entire template code. For example, you can use the $pandoc.tex()$ partial to include pandoc configuration for text highlighting, tables, graphics, tight lists, citations, and header includes:

This modular approach means that is easier to implement templates that:

Include required elements of Pandoc templates

Support general Pandoc features and options

Provide only the minimal LaTeX or HTML rather than being required to provide all of it

LaTeX Partials

View the Quarto LaTeX template and partials source code here . Note that latex.template is a copy of the complete Pandoc template that the Quarto template and partials is based upon.

The core LaTeX template which includes the basic document skeleton plus the following partials. This can’t be replaced as a partial , instead use the template option to provide your own template.

Contains the document class declaration and options. By default we provide the identical document class that Pandoc provides, implementing many features. If you override this (which will be common), you will need to either implement support for the document class options or be aware that those options (e.g. font-size, paper-size, classoption, etc…) will not be supported in your output.

Appears in the document premable just before the title block. By default, this partial is empty.

Provides configuration of document metadata for writing the title block. Note that in addition to these templates and partials, Quarto will also make normalized authors and affiliations data available to the template, making is easy to write custom title blocks against a standard schema.

Implements the frontmatter, title page, and abstract.

Provides a placeholder to attach content at the end of the body.

Creates the table of contents, list of figures, and list of tables.

Placed after the content of the document, but before the bibliography. By default contains nothing.

Creates the bibliography.

This includes configuration for text highlighting, tables, graphics, tight lists, citations, and header includes. In general, this partial must always be included within your custom template. In some circumstances, you may know that certain capabilities will not be needed, so you this partial is further composed of the following partials, which could be used if sensible:

Provides the tight list command.

Provides configuration for the output of tables, table captioning, and footnotes within tables.

Provides image scaling and placement configuration.

When using CSL references, provides configuration and commands for outputting the bibliography.

See the full source code for the Quarto LaTeX template to see how these partials are invoked by default.

Typst Partials

View the Quarto Typst template and partials source code here .

The core Typst template file which includes the basic document skeleton plus the following partials. This can’t be replaced as a partial , instead use the template option to provide your own template.

Definitions for Pandoc and Quarto features like block quotes, callouts, subfloats etc. In general, this partial must always be included within your custom template.

The definition of the Typst template function that will be called on the entire document contents. In the default template this function is called article() and generates a title block and author list, followed by the document content, optionally laid out in columns.

A show rule for the entire document that captures document metadata and passes it to the function defined in typst-template.typ .

Creates footnotes.

HTML Partials

View the Quarto html template and partials source code here . Note that html.template is a copy of the complete Pandoc template that the Quarto template and partials is based upon.

Quarto’s HTML template is broken down into the following components:

The core HTML template which includes the basic document skeleton plus the following partials. This can’t be replaced as a partial , instead use the template option to provide your own template.

Populates basic document metadata into the HTML document head. More advanced metadata elements are not currently implemented within this template (e.g. social media, academic metadata) but are implemented as post processors.

Provides the title block for the document. 

Provide the table of contents target for the document

Revealjs Partials

View the Quarto Revealjs template and partials source code here . Note that revealjs.template is a copy of the complete Pandoc template that the Quarto template and partials is based upon.

The core Revealjs templates which includes the basic presentation skeleton plus the following partials. This can’t be replaced as a partial , instead use the template option to provide your own template.

HTML used for the presentation title slide.

HTML used for the presentation table of contents.