This repository is a template for a minimal nord-themed reveal.js presentation.
Firstly, to develop the presentation, you need to have Hugo installed.
brew install hugo
# also install optional Pygments package for syntax highlighting in presentation
pip3 install Pygments
Hugo will serve the presentation as a local static site in your web browser and update as you make changes in the source code of the presentation.
As this is a template repository, the easiest way to get up and running is to click on the 'Use template' button. See further instructions here.
However, if you just want a local presentation without using GitHub then clone this template in a directory (ideally named for your presentation)
presentation="awesome_conference"
git clone https://github.com/mbhall88/reveal-hugo-nord "$presentation"
cd "$presentation"
git submodule update --init
To serve the presentation in your web browser run the following from the root directory of the repository.
hugo serve
In your web browser, navigate to http://localhost:1313/ . Every time you make changes this webpage will auto-reload to reflect those changes.
You should see a screen that looks like this
The reveal-hugo docs have a great tutorial to get you up and running. There is also a thorough blog post here.
The config.toml
is a central place for defining the settings of your presentation.
A full list of configurations can be found here.
The slides themselves are within content/
. _index.md
is the "root" for your slides
and you can also define presentation-wide settings in this file too. You can put all of
your slides in _index.md
if you wish, but you can likewise break them up into sections.
Sections will be vertically stacked within the presentation when placed in content/home/
.
So if we had an _index.md
file that looked like This
+++
title = "My presentation"
outputs = ["Reveal"]
+++
# Hello, world!
This is my first slide.
---
# Hello Mars!
This is my second slide
---
## Mars method
This slide describes the methods and has a pretty plot
We could move the slides about Mars into their own section with the following setup.
content/_index.md
+++
title = "My presentation"
outputs = ["Reveal"]
+++
# Hello world!
This is my first slide.
content/home/mars.md
+++
weight = 10
+++
{{% section %}}
# Hello Mars!
This is my second slide
---
## Mars method
This slide describes the methods and has a pretty plot.
{{% /section %}}
Note: weight
is how you define the order of slides. If you have another .md
file
with weight = 11
it will come after content/home/method.md
. See this for more info.
For more information on sections, see the docs.
Maths rendering with MathJax is supported provided you have access to an internet connection when initially serving the slides.
In short, you write equations in Tex/LaTex format.
An example of adding an equation to a slide
## Cool equations
Displayed equations are wrapped in double-\$
$$\frac{n!}{k!(n-k)!} = \binom{n}{k}$$
Inline equations like $E=mc^2$ are wrapped in single-\$
If you would like to make any changes to the font, colours, style etc. then this can be
done in static/stylesheets/robot-lung-nord.css
. The current stylesheet is a copy of
the robot-lung theme, which I have changed some colours to match the nord
colour scheme.
If you would like to add a logo to your slides then instructions can be found in this short tutorial.