Skip to content

troytop/presentation-template

 
 

Repository files navigation

SUSE-themed reveal.js presentation template

This repo provides a template for presentation slide decks which aims to be virtually identical to the SUSE corporate style template provided in LibreOffice Impress format.

You can view the template slides online here; press Space or n (not the right arrow) to advance 1 slide at a time.

It is based on a template by Florian Haas which uses reveal.js (by Hakim El-Hattab and contributors) as the underlying presentation technology.

Building slides with reveal.js has a number of significant advantages over LibreOffice Impress:

  • Write slides in Markdown!

  • Develop your slide content with git!

    • Collaborate on content via pull requests!

    • Compare versions with git diff!

    • Use branches when creating a new presentation on an existing one, and use tags to mark every "release" version which you use for a public presentation. No more having to hoard many slightly different versions of the same file!

    • For slides which get copied from deck to deck many times over several years, track the source and development history via git blame.

  • Since the browser is the renderer, you can view the slide-deck on any device, anywhere. Want to show it to someone when you're out at lunch? No problem - just use your phone.

  • The content is just HTML, CSS, and Javascript, so the sky is the limit for how it can be extended. Want to switch slides by waving your hands around in the air, or poll the audience and display a slide with a dynamically updating graph of the poll results, or get a tele-prompter via Google Glass? No problem!

  • Dynamically generate QR codes for any URL.

  • (Optionally) publish your presentations via GitHub Pages hosting, or any other web server. In large lecture halls, people far away or with poor eyesight can follow along on their laptops (and even have their slides automatically advance when yours do!)

  • Many keyboard shortcuts for navigation (press ? to see them).

  • Aspect ratio can be easily switched between 16x9 and 4x3, since it's just HTML and CSS.

  • Many cool plugins and other tricks to play around with, e.g.

    • chalkboard - turn your slides into a chalkboard for real-time drawing

    • play recorded screencast demos from within a slide, as pure HTML via TermRecord, or as a video via asciinema

    • shellinabox - do live demos from within a shell embedded in a slide

    • stermie - connect to a QEMU virtual machine from a terminal window embedded in a slide, e.g. start QEMU with -serial websocket:127.0.0.1:45252,server,nowait then add to a slide: <iframe src="https://ddiss.github.io/stermie/#url=ws://127.0.0.1:45252 />

    • Use any Javascript library to dynamically generate content, e.g. git commit graphs

  • Automatic code syntax-highlighting via highlight.js, themed in SUSE colours.

  • Navigation menu to easily jump around between slides (just press the m key)

  • Zoom to 1,000 feet above your presentation to see the whole thing laid out in two dimensions (one column per section), then swoop back in to the slide you want.

It also has feature parity with LibreOffice Impress in many respects, e.g.:

For more information on reveal.js, watch Florian's OSCON 2014 presentation:

Thumbnail of OSCON 2014 presentation video on YouTube

Of course, the slides for that talk use this same approach, so they are hosted here on GitHub Pages, and you can also examine the source code for them.

How to use

See the USAGE.md file.

Feedback

If you find the content in this repo useful, it would be great if you could let Florian and Adam know. You could either star this repo, or even better, send us happiness packets :-)

Also, if you notice any areas for improvement, please submit issues and pull requests via this repository.

Thanks!

About

A skeleton framework for presentations using reveal.js and a few other helpful components.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • SCSS 75.5%
  • HTML 11.0%
  • JavaScript 8.9%
  • Shell 4.6%