Skip to content

Instantly share code, notes, and snippets.

@rmed

rmed/README

Created April 25, 2015 09:12
Show Gist options
  • Save rmed/c35292929d4e821a645c to your computer and use it in GitHub Desktop.
Save rmed/c35292929d4e821a645c to your computer and use it in GitHub Desktop.
Download ZIP
reveal.js slides with pandoc
Raw
README
How to use:
- Copy default.revealjs into ~/.pandoc/templates
- Place build.sh in the same directory as your slides (e.g. slides.md)
- Download reveal.js from here: https://github.com/hakimel/reveal.js/releases/tag/3.0.0
- Place the reveal.js directory in the same directory where your compiled slides will be (can be different with Pandoc's flags)
- Modify the build.sh script to your likings
- Compile with ./build.sh
Raw
build.sh
#!/bin/bash
# Configuration variables
# Themes
#
# beige
# black
# blood
# league
# moon
# night
# serif
# simple
# sky
# solarized
# white
theme="night"
# Transitions
#
# none
# fade
# slide
# convex
# concave
# zoom
transition="slide"
# Show controls in bottom right
controls="true"
# Display progress of the presentation at the bottom
progress="true"
# Display slide number
slidenum="false"
# Push each slide change to browser history
hist="false"
# Enable keyboard shortcuts for navigation
keyboard="true"
# Enable slide overview mode
overview="true"
# Vertically center the slides
center="true"
# Enable touch navigation in mobile devices
toucher="true"
# Loop the presentation
loop="false"
# Right to left presentation
rtl="false"
# Slides file
input="slides.md"
# Output
output="slides.html"
# Build
function build() {
echo "Building slides to out/$output..."
pandoc -t revealjs \
-V theme=$theme \
-V transition=$transition \
-V controls=$controls \
-V progress=$progress \
-V slidenum=$slidenum \
-V history=$hist \
-V keyboard=$keyboard \
-V overview=$overview \
-V center=$center \
-V touch=$toucher \
-V loop=$loop \
-V rtl=$rtl \
-s $input -o out/$output
sed -i s/h1\>/h2\>/g out/$output
sed -i s/\>\<h2/\>\<h1/g out/$output
sed -i s/\\/h2\>\</\\/h1\>\</g out/$output
}
# Clean
function clean() {
echo "Cleaning..."
rm -rf out/$output
}
# Magic starts here
case "$1" in
"build" )
build
;;
"clean" )
clean
;;
* )
build
;;
esac
Raw
default.revealjs
<!DOCTYPE html>
<html$if(lang)$ lang="$lang$"$endif$>
<head>
<meta charset="utf-8">
<meta name="generator" content="pandoc">
$for(author-meta)$
<meta name="author" content="$author-meta$" />
$endfor$
$if(date-meta)$
<meta name="dcterms.date" content="$date-meta$" />
$endif$
<title>$if(title-prefix)$$title-prefix$ - $endif$$pagetitle$</title>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="$revealjs-url$/css/reveal.css"/>
<style type="text/css">code{white-space: pre;}</style>
$if(highlighting-css)$
<style type="text/css">
$highlighting-css$
</style>
$endif$
$for(css)$
<link rel="stylesheet" href="$css$"/>
$endfor$
$if(theme)$
<link rel="stylesheet" href="$revealjs-url$/css/theme/$theme$.css" id="theme">
$else$
<link rel="stylesheet" href="$revealjs-url$/css/theme/black.css" id="theme">
$endif$
<!-- If the query includes 'print-pdf', include the PDF print sheet -->
<script>
if( window.location.search.match( /print-pdf/gi ) ) {
var link = document.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = '$revealjs-url$/css/print/pdf.css';
document.getElementsByTagName( 'head' )[0].appendChild( link );
}
</script>
<!--[if lt IE 9]>
<script src="$revealjs-url$/lib/js/html5shiv.js"></script>
<![endif]-->
$if(math)$
$math$
$endif$
$for(header-includes)$
$header-includes$
$endfor$
</head>
<body>
$for(include-before)$
$include-before$
$endfor$
<div class="reveal">
<div class="slides">
$if(title)$
<section>
<h1 class="title">$title$</h1>
$if(subtitle)$
<h1 class="subtitle">$subtitle$</h1>
$endif$
$for(author)$
<h2 class="author">$author$</h2>
$endfor$
<h3 class="date">$date$</h3>
</section>
$endif$
$if(toc)$
<section id="$idprefix$TOC">
$toc$
</section>
$endif$
$body$
</div>
</div>
<script src="$revealjs-url$/lib/js/head.min.js"></script>
<script src="$revealjs-url$/js/reveal.js"></script>
<script>
// Full list of configuration options available here:
// https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
controls: $if(controls)$$controls$$else$true$endif$,
progress: $if(progress)$$progress$$else$true$endif$,
slideNumber: $if(slidenum)$$slidenum$$else$false$endif$,
history: $if(history)$$history$$else$false$endif$,
keyboard: $if(keyboard)$$keyboard$$else$true$endif$,
overview: $if(overview)$$overview$$else$true$endif$,
center: $if(center)$$center$$else$true$endif$,
touch: $if(touch)$$touch$$else$true$endif$,
loop: $if(loop)$$loop$$else$false$endif$,
rtl: $if(rtl)$$rtl$$else$false$endif$,
theme: $if(theme)$'$theme$'$else$Reveal.getQueryHash().theme$endif$, // available themes are in /css/theme
transition: $if(transition)$'$transition$'$else$Reveal.getQueryHash().transition || 'default'$endif$, // default/cube/page/concave/zoom/linear/fade/none
// Optional libraries used to extend on reveal.js
dependencies: [
{ src: '$revealjs-url$/lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: '$revealjs-url$/plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },
{ src: '$revealjs-url$/plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } },
// { src: '$revealjs-url$/plugin/search/search.js', async: true, condition: function() { return !!document.body.classList; }, }
// { src: '$revealjs-url$/plugin/remotes/remotes.js', async: true, condition: function() { return !!document.body.classList; } }
]});
</script>
$for(include-after)$
$include-after$
$endfor$
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment