Reveal.js Tabset

Quarto Extension

Mickaël CANOUIL, Ph.D.

Introduction

What is Reveal.js Tabset?

This extension brings proper tabset support to Reveal.js presentations.

  • Navigate through tabs using arrow keys or space bar.
  • Tabs are treated as fragments.
  • PDF export support.

How it works

The plugin automatically detects panel tabsets in your slides and enables fragment-based navigation.

Installation

Install the extension using:

quarto add mcanouil/quarto-revealjs-tabset@1.0.1

Basic Setup

Add to your document YAML:

format:
  revealjs: default
revealjs-plugins:
  - tabset

For PDF export with separate slides per tab:

format:
  revealjs:
    pdf-separate-fragments: true

Basic Example

Simple Tabset

This is the content of the first tab.

  • Point 1.
  • Point 2.
  • Point 3.

This is the content of the second tab.

  • Different point 1.
  • Different point 2.
  • Different point 3.

This is the content of the third tab.

Bold text and italic text.

Advanced Example

Tabset with Fragments

This tab contains fragments.

First fragment appears.

Second fragment appears.

More detailed information here.

  • Item 1.
  • Item 2.
  • Item 3.

Summary of the topic.

Features

Key Features

  1. Fragment Navigation: Tabs are treated as fragments, allowing smooth navigation.
  2. PDF Export: Correct tab state is preserved in PDF exports.
  3. Multiple Tabsets: Support for multiple tabsets per slide.
  4. Nested Fragments: Fragments within tabs are properly indexed.

Usage Tips

  • Use arrow keys or space to navigate through tabs.
  • Going backwards (left arrow) returns to the previous tab.
  • Works seamlessly with Quarto’s native tabset syntax.

Thank You

Questions?

Feel free to ask any questions about the Reveal.js Tabset extension.