Skip to main content
  1. Knowledge Base/
  2. Applications/

Revealjs

Table of Contents

Revealjs is a framework for producing nice looking HTML presentations.

Here you can find the source code and here the direct link to the presentation to illustrate Revealjs.

Frontmatter
#

---
title: Revealjs Introduction
theme : "moon"
transition: "zoom"
highlightTheme: "darkula"
slidenumber: true
separator: ^---
verticalSeparator: ^--
showNotes: true ## Export notes in pdf
## showNotes: "separate-page" for longer notes
---

Image formatting
#

for reveal-md

![](bad.jpg) <!-- .element height="65%" width="65%" -->

for pandoc

![](image.png){#id .class width=65% height=65%}

Slide background
#

for reveal-md

<!-- .slide: data-background="./background.png" -->
<!-- .slide: style="color:yellow" -->

for pandoc

# {data-background-image="background.jpg"}

Bulletpoints animation
#

- Emacs, VS Code, Vim <!-- .element: class="fragment" -->
- R Studio, Jupyter <!-- .element: class="fragment" -->
- reveal-md Pandoc <!-- .element: class="fragment" -->

Generate static HTML files
#

with reveal-md

reveal-md -css custom.css presentation.md --static public

with pandoc

pandoc -t revealjs -s -o public/index.html presentation.md -V revealjs-url=reveal.js --css=custom.css --slide-level=2 [--self-contained]