Org Mode and Reveal.js

Menu

This is very similar to what I have described in a previous post Org Mode and Shower.

Exporting to Reveal.js

Generating slides in the Reveal.js format from Org Mode file is rather easy. There is the original ox-reveal package and its more recent fork ox-re-reveal.

Both packages come with various options to exploit the different features Reveal provides.

Using the standard HTML export function for Reveal.js

It turns out, however, that you can generate Reveal.js slides from an Org Mode file using the Org Mode’s default HTML export function. With a little extra-markup, in fact, you get the basic slide machinery up and running.

Why would you want to do that? Three reasons:

  1. Reduce dependencies from external packages. I very seldom had issues with ox-reveal and ox-re-reveal, but the one time I had them (and it was most likely an installation issue on my side), I was stuck with an Org Mode file I could not use.
  2. Simplify integration of Reveal.js slides in a Org Mode website. If you manage your website with Org Mode and wish to mix “regular” Org Mode pages with Reveal.js presentations, you need to customize the exporting function, so that the correct engine is activated when you export slides. 1 If you use a plain template, there is not need for such a customization, which can make things simpler.
  3. No indirections. The only syntax you need is that of Org Mode and that of Reveal.js and there is no need to learn the way in which Reveal.js features are made available through ox-(re-)reveal. This is most evident for the activation of plugins, which you do like you would do in HTML, namely by adding an option to the JavaScript initialization of Reveal.

Why you might still want to use ox(-re)-reveal? Two main reason:

  1. ox-(re-)reveal provides various specific properties (e.g., to specify slide backgrounds), which allow for customizations otherwise (impossible?) with the vanilla version. Background images, for instance, rely on using a data- attributes, which I believe cannot be generated using the regular Org Mode export function.
  2. By using ox-(re-)reveal you still get the option of exporting the same document to Reveal.js and plain HTML, since the standard export function ignores all properties defined by ox-(re-)reveal. In my experience, however, exporting to plain HTML Org Mode files written with Reveal.js in mind does not yield great results.

Go on… show me how!

You can:

  1. view a very simple example
  2. download the Org Mode source file

Footnotes:

1

This is, in fact, what I do this on this website. Look for the avm/org-publish-html-or-reveal function on Project Specification page.