This is a "theme" for jekyll bootstrap(JB) that makes it easy to add presentations made with the awesome reveal.js library by Hakim El Hattab to your github-pages. It's really just a copy of the reveal-library packaged according to JB's theme api so it plays along nicely with pages made with JB.
As jekyll parses markdown and nicely handles the section tags there is no need for reveal's own on-the-fly markdown parser.
For information on how to use reveal.js
see the README.md in
assets/themes/reveal/
.
See it in action on http://kjarnet.no/jb-theme-reveal/.
The theme is packaged to be installed with JekyllBootstrap's rake script. See instructions on the JekyllBootstrap page. The url to the git-repo is https://github.com/kjarnet/jb-theme-reveal.git Alternatively, if you don't have ruby/rake, just merge the _includes and assets folders into the ones on your JekyllBootstrap site.
NB:
Appearently, github's default markdown parser
doesn't parse markdown between <section>
tags,
so you have to use redcarpet instead:
In your _config.yml file,
add a line "markdown: redcarpet
"
somewhere at the top (at the root level).
You can use the theme for the whole page,
if you don't need any "normal" web-pages.
Then you'd activate it as usual with
rake theme:switch name="reveal"
and write your index-page as pure slides
(using markdown if you wish)
like so:
---
layout: page
title: Header Title
description: Description for meta tag
---
<section>
# Title-Slide header #
Title-Slide sub-title
</section>
<section>
## Slide 2 header ##
Slide 2 content
</section>
...
(you only need layout in the front matter as all other fields (title, tagline etc.) are ignored. It doesn't matter if you use page- or post-layout as they are identical).
A more likely scenario is
that you'd like a slideshow
as a sub-page of your site
along with normal jekyll-pages
that use another theme.
To accoplish this,
use a normal theme for your site in general
(you can switch to a normal theme with e.g.
rake theme:switch name="twitter"
).
Then add a custom layout
by adding something like
these two pages in the _layouts folder:
presdefault.html:
---
theme :
name : reveal
---
{% include JB/setup %}
{% include themes/reveal/default.html %}
presentation.html:
---
layout: presdefault
---
{% include JB/setup %}
{% include themes/reveal/page.html %}
Your presentation-page (e.g. mycoolpres.md) would then be something like this instead:
---
layout: presentation
title: Header Title
description: Description for meta tag
---
<section>
# Title-Slide header #
Title-Slide sub-title
</section>
<section>
## Slide 2 header ##
Slide 2 content
</section>
...
i.e. it would use the "presentation" layout you just defined.
All design and code by Hakim El Hattab.
For the license of reveal.js
see the README.md in
assets/themes/reveal/
.
This includes everything under that folder
as well as the file
_includes/themes/reveal/default.html
(i.e. nearly all code in this repository).
The rest is MIT license.