Quarto: Presentations

FAIR & Reproducible Teaching with Quarto & Git
Course at University of Hamburg
Slides | Source

10:30

Schedule

Day 1

Day	Date	Time	Title
1	2026-03-20	09:30 - 10:00	Welcome & Introduction
1	2026-03-20	10:00 - 10:30	Quarto: Introduction
1	2026-03-20	10:30 - 10:45	Quarto: Presentations
1	2026-03-20	10:45 - 11:00	Git: Setup & Configuration
1	2026-03-20	11:00 - 11:15	Command Line
1	2026-03-20	11:15 - 12:00	Git: Basics
1	2026-03-20	12:00 - 13:00	Lunch Break
1	2026-03-20	13:00 - 14:00	Git: Remotes
1	2026-03-20	14:00 - 15:00	Git: Collaboration
1	2026-03-20	15:00 - 15:30	Quarto: Publication to GitHub Pages
1	2026-03-20	15:30 - 16:00	Git: Tags & Releases

Objectives

💡 You can create a Quarto presentation using the reveal.js format.
💡 You can write slides using Markdown syntax (headings, text, images, code).
💡 You can use fragments to reveal content step-by-step.
💡 You can add speaker notes to your slides.
💡 You can customize your presentation with themes and layout options.

Tasks

In this session, you will work on the following tasks:

Reading: Read the chapter(s) Reveal.js Presentations in the Version Control Book.
Implementation: Try out the commands in the chapter.
Exercises: Work on the exercises.

As always:

Try out the commands of this session and play around with them.
Check whether you have achieved the learning objectives.
Ask questions!

What are Quarto Presentations?

Quarto allows you to create beautiful presentations using Markdown and the Reveal.js framework.

Write slides in plain text using Markdown
Render to interactive HTML presentations
Customize with themes, transitions, and more

1 Getting Started

Features of Quarto presentations

taken from this Quarto demo presentation (Source)

Create a New Quarto Presentation

Create a new .qmd file (e.g., slides.qmd)
Add a YAML header specifying format: revealjs

---
title: "My Presentation"
format: revealjs
---

Write Slides with Markdown

Use # for slide titles
Use ## for slide sections
Separate slides with a horizontal rule (---)

Example:

Code

# Slide 1 Title

Content for slide 1.

---

# Slide 2 Title

Content for slide 2.

Themes and Appearance

Use the theme option in YAML to change appearance:

format:
    revealjs:
        theme: solarized

Other options: dark, simple, serif, etc.

Adding Images and Code

Embed images with Markdown: ![](path/to/image.png)
Add code blocks:

print("Hello, Quarto!")

Speaker Notes

Add speaker notes using ::: notes blocks:

::: notes
These are speaker notes for this slide.
:::

Fragments

Reveal content step-by-step using fragments:

- Item 1
- Item 2 {.fragment}
- Item 3 {.fragment}

Resources

Exercises

Create a Quarto Presentation

In your my-project folder, create a new file called slides.qmd.
Add a YAML header specifying format: revealjs and a title of your choice.
Write at least three slides using ## headings with some content on each slide.
Render the presentation to HTML using quarto preview or the Render button in RStudio.

Customize Your Slides

Add a code block or image to one of your slides.
Use the ::: {.fragment} syntax to make at least one element appear step-by-step.
Add speaker notes to one slide using ::: notes.
🚀 Optional: Change the presentation theme (e.g., theme: solarized) and observe the effect.