—
title: Slides
summary: An introduction to using Wowchemy’s Slides feature.
authors: []
categories: []
date: ‘2019-02-05T00:00:00Z’
slides:
theme: black
# Choose a code highlighting style (if highlighting enabled in params.toml
)
# Light style: github. Dark style: dracula (default).
highlight_style: dracula
—
# Create slides in Markdown with Wowchemy
—
## Features
- Efficiently write slides in Markdown
- 3-in-1: Create, Present, and Publish your slides
- Supports speaker notes
- Mobile friendly slides
—
## Controls
- Next: Right Arrow
or Space
- Previous: Left Arrow
- Start: Home
- Finish: End
- Overview: Esc
- Speaker notes: S
- Fullscreen: F
- Zoom: Alt + Click
—
## Code Highlighting
Inline code: variable
Code block:
```python
porridge = “blueberry”
if porridge == “blueberry”:
print(“Eating…”)
```
—
## Math
In-line math: $x + y = z$
Block math:
$$
f\left( x \right) = ;\frac{{2\left( {x + 4} \right)\left( {x - 4} \right)}}{{\left( {x + 4} \right)\left( {x + 1} \right)}}
$$
—
## Fragments
Make content appear incrementally
```
{{% fragment %}} One {{% /fragment %}}
{{% fragment %}} Two {{% /fragment %}}
{{% fragment %}} Three {{% /fragment %}}
```
Press Space
to play!
One
Two
Three
—
A fragment can accept two optional parameters:
- class
: use a custom style (requires definition in custom CSS)
- weight
: sets the order in which a fragment appears
—
## Speaker Notes
Add speaker notes to your presentation
```markdown
{{% speaker_note %}}
- Only the speaker can read these notes
- Press S
key to view
{{% /speaker_note %}}
```
Press the S
key to view the speaker notes!
—
## Themes
- black: Black background, white text, blue links (default)
- white: White background, black text, blue links
- league: Gray background, white text, blue links
- beige: Beige background, dark text, brown links
- sky: Blue background, thin dark text, blue links
—
- night: Black background, thick white text, orange links
- serif: Cappuccino background, gray text, brown links
- simple: White background, black text, blue links
- solarized: Cream-colored background, dark green text, blue links
—
## Custom Slide
Customize the slide style and background
```markdown
{{< slide background-color="#0000FF" >}}
{{< slide class=“my-style” >}}
```
—
## Custom CSS Example
Create assets/css/reveal_custom.css
with:
```css
.reveal section h1,
.reveal section h2,
.reveal section h3 {
color: navy;
}
```
—
# Questions?