## Outline * hattip * submodule * setting up layout * frontmatter * markdown (sections vs straight markdown files) * separators * css * print to pdf tool #### Title: A master in the art of living draws no sharp distinction between his work and his play; his labor and his leisure; his mind and his body; his education and his recreation. He hardly knows which is which. He simply pursues his vision of excellence through whatever he is doing, and leaves others to determine whether he is working or playing. To himself, he always appears to be doing both. ## Sub-title Here is some content... Note: This will only display in the notes window. # basement hi # /hattip * [Luu Gia Thuy](http://luugiathuy.com) / [@luugiathuy](http://twitter.com/luugiathuy) * [reveal.js](https://github.com/hakimel/reveal.js/) enables you to create
## Overview [reveal.js](https://github.com/hakimel/reveal.js/) enables you to create beautiful interactive slide decks using HTML. This presentation will show you how to integrate it with [Jekyll](http://jekyllrb.com/)
## reveal.js Clone reveal.js to your site's root folder: ``` git clone https://github.com/hakimel/reveal.js.git ``` Or, add it as your site's submodule: ``` git submodule add https://github.com/hakimel/reveal.js.git ```
## Slide Layout Create a layout file, call `slide.html` in `_layouts` folder. And use this gist for the content of the file https://gist.github.com/luugiathuy/c07ac5608addadb642e5.
## Slide Now, in your page/post YAML front matter, use `slide` for the layout. You can define *title*, *author*, *description* as well as the slide's *theme* and *transition*: ```yaml --- layout: slide title: Jekyll: Make presentation page with reveal.js description: A presentation slide for how to use reveal.js in Jekyll theme: black transition: slide --- ```
## Slide Each slide is enclosed in a `<section>` tag: ```html <section data-markdown> ## Overview beautiful interactive slide decks using HTML. This presentation will show you how to integrate it with [Jekyll](http://jekyllrb.com/) </section> ```
## Fin