1. This slideshow is written in Markdown, a plain text format.
   • view the slideshow in markdown
2. Converted into an HTML5, revealjs document using Pandoc.

Yes, it really is that easy.

Aren't some steps missing?

Everything else just happens once you have it set up.

• Pandoc uses a template to convert the Markdown to HTML5.
• The HTML5 document is automatically formatted for use with and linked to reveal.js by the template.
• Reveal is a feature-rich javascript library that displays the slideshow.

Plain text, formatted

Markdown is plain text with formatting syntax designed so that it can be converted to HTML and many other formats. Markdown is often used to format readme files, for writing messages in online discussion forums, and to create rich text using a plain text editor.

Learn more

• Markdown Cheatsheet
• Markdown Basics
• Markdown Tutorial

What software is needed?

• Markdown may be created using any plain text editor. If you are doing a lot a plain text work, a good text editor is a must.
• My favorite is the free and open source Atom.

What is it?

• Universal document converter
• Convert markdown documents (and others) to many other formats
• Pandoc

Installation

There is a download file just for you at: Pandoc Install

• Windows
• OSX
• Linux
• BSD
• Source

Output to PDF

Output to PDF requires LaTeX.

• Windows: MiKTeX
• OSX: Basic TeX
• Linux: TeX Live
  • apt-get install texlive

Command line

Pandoc is run from the command line. This is not a tutorial on how to use the command line. If you are unsure of your command line skills, try one of the many excellent tutorials available though a Google search.

I happen to be running this via Windows PowerShell but the commands are identical to a Linux BASH.

Commands to create this slideshow are:

cd my_working_directory
pandoc -t html5 --template=templatecdn_revealjs.html --standalone --section-divs  pandoc_reveal.md -o pandoc_reveal.html

Pandoc has many options, see pandoc --help.

Let's break it down

• cd my_working_directory: Change directory to my_working_directory. my_working_directory is where my files and templates are stored.

• pandoc arguments: Calls Pandoc with the specified arguments

Arguments

• -t FORMAT: Specify the output FORMAT as HTML5
• --template=FILE: Selects the conversion template as templatecdn_revealjs.html. (More on this later)
• --standalone: Produce output with an appropriate header and footer and not just a snippet

More arguments

• --section-divs: For HTML5 it wraps sections in <section> tags
• pandoc_reveal.md: This is the input file. Its format is automatically determined from the file extension
• -o FILE: Write output to the FILE pandoc_reveal.html

Display HTML slideshows

Create excellent presentation slides using HTML. The easiest way to understand what it does is to see the demonstration.

REVEAL.JS demonstration

How to use?

• Fork it from GitHub to have a locally run version
• Use content delivery network (CDN) files for Internet version
  • I typically use CDN
  • CDN links
• Set your template to either local or CDN files

Default

Pandoc comes with a default reveal.js template, called with the output FORMAT set to revealjs. Example:

pandoc -t revealjs --standalone input.md -o output.html

Custom

I prefer to use my own custom template. This template is available in the repository as template_revealjs.html.

Why? The custom template adds many new variables, i.e. the GitHub variables, outputs HTML5, and increases the configuration coverage for reveal.js.

pandoc -t html5 --standalone --section-divs --template=template_revealjs.html pandoc_reveal.md -o pandoc_reveal.html

Usage

The custom template is intended for use with an appropriate markdown file that includes YAML variables.

Use template_md_reveal.md gist as your starting point markdown file.

YAML is basically a variable: value format that may be used to set configuration values for pandoc and reveal.js.

---
# THIS IS YAML
title: Main Title
subtitle: Subtitle
author: Author Name
date: 10 July 2015
license: Apache License, Version 2.0
---

There may be more than one YAML block in a document. Each YAML block must start and end with 3 dashes. See Extension: yaml_metadata_block. Each variable that you set in YAML is available for use in the template.

Usage

My template_md_reveal.md uses 2 YAML blocks, one at the top and one at the bottom of the file. The top YAML sets some generic variables. The bottom YAML sets configuration values for reveal.js.