I’ve been using Reveal.js for my course slide decks and for most presentations I’ve been giving of late. I like writing my presentation in markdown – quickly banging out ideas – and then feeding that markdown into Reveal. This has the added benefit that I can use Pandoc to create handouts or whatever super duper quickly.

If you write your slidedeck for Reveal.js in html from the word go, you can of course do a whole lot more and take full advantage of what Reveal offers. Perhaps you can do this in a markdown source file too, but for my needs, basic slides with either full screen images or centred images is all I need.

Here’s how I do it.

Begin by forking my presentations repository, (make sure your fork is a gh-pages branch). Then, rename one of my html files to your presentation name. 

Take for instance https://github.com/shawngraham/presentations/blob/gh-pages/bash.html

Rename it ‘my-cool-presentation.html’ or whatever. Check to make sure this loads up by going to <yourusername>.github.io/presentations/my-cool-presentation.html.

Then, at line 45, change the name of the markdown file between the quotes to your own file: 

so, data-markdown="bash.md" is telling Reveal to use bash.md as the source file. The next two lines (46 & 47) separate your content in your source markdown file; slides you want to go off to the right you mark off with --- and slides that go down the page are marked off with --. You can put your speaking notes in the slide by making sure Note: starts a new line; everything that follows will not be displayed (but can be seen if you use the speaker’s view whilst presenting).

To see  all this in action, go to:

http://shawngraham.github.io/presentations/bash.html#/

And hit esc – you’ll see that the slides extend out to the right, and down to the bottom. (Hit s and you’ll see any notes I’ve left in there). If you look at the source md RAW,

https://raw.githubusercontent.com/shawngraham/presentations/gh-pages/bash.md

you’ll see how those separators work out in practice. You’ll also note that you can mix a bit of html into the markdown as well to do things like full-screen backgrounds, movies, etc. Now, if you’re making a whole bunch of changes and working directly in github, it sometimes takes a while for your changes to show up and/or your browser cache might not show your latest changes. What I do is make all my changes locally, and spin up a server to display my changes to me as I make them with

`$ python -m SimpleHTTPServer 8000`

Then I commit and push my changes. Knock yourself out.