From 0d7399e14d309ad251b21789a8cdd747adfd1d8e Mon Sep 17 00:00:00 2001 From: George Cushen Date: Fri, 11 Dec 2020 01:40:31 +0000 Subject: feat: add example talk, slides, and project to default tpl As users regularly ask how to get the example content. --- content/slides/example/index.md | 166 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 166 insertions(+) create mode 100644 content/slides/example/index.md (limited to 'content/slides') diff --git a/content/slides/example/index.md b/content/slides/example/index.md new file mode 100644 index 00000000..4809be65 --- /dev/null +++ b/content/slides/example/index.md @@ -0,0 +1,166 @@ +--- +title: Slides +summary: An introduction to using Wowchemy's Slides feature. +authors: [] +tags: [] +categories: [] +date: "2019-02-05T00:00:00Z" +slides: + # Choose a theme from https://github.com/hakimel/reveal.js#theming + 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 + +[Wowchemy](https://wowchemy.com/) | [Documentation](https://owchemy.com/docs/managing-content/#create-slides) + +--- + +## 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` +- [PDF Export](https://github.com/hakimel/reveal.js#pdf-export): `E` + +--- + +## 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! + +{{% fragment %}} One {{% /fragment %}} +{{% fragment %}} **Two** {{% /fragment %}} +{{% fragment %}} Three {{% /fragment %}} + +--- + +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! + +{{< speaker_note >}} +- Only the speaker can read these notes +- Press `S` key to view +{{< /speaker_note >}} + +--- + +## 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 + +--- + +{{< slide background-image="/media/boards.jpg" >}} + +## Custom Slide + +Customize the slide style and background + +```markdown +{{}} +{{}} +{{}} +``` + +--- + +## Custom CSS Example + +Let's make headers navy colored. + +Create `assets/css/reveal_custom.css` with: + +```css +.reveal section h1, +.reveal section h2, +.reveal section h3 { + color: navy; +} +``` + +--- + +# Questions? + +[Ask](https://github.com/wowchemy/wowchemy-hugo-modules/discussions) + +[Documentation](https://wowchemy.com/docs/managing-content/#create-slides) -- cgit v1.2.3