themen-hugo-35c3-reveal/exampleSite/content/home/shortcodes/slide.md

1.4 KiB

+++ weight = 34 +++

Slide

Customize individual slide attributes like id, background color and transition. Use the same keys as Reveal.js but omit the 'data-' prefix.


{{% slide id="custom-1" transition="zoom" transition-speed="fast" %}}

Custom slide 1

{{%/* slide id="custom-1" transition="zoom" transition-speed="fast" */%}}

## Custom slide 1

{{%/* /slide */%}}

{{% /slide %}}


{{% slide id="custom-2" background="#FF4081" %}}

Custom slide 2

{{%/* slide id="custom-2" background="#FF4081" */%}}

## Custom slide 2

{{%/* /slide */%}}

{{% /slide %}}


💡 Tip: Setting a slide's id attribute makes it easy to link to from other parts of the presentation.


```markdown Go to [custom slide 1](#custom-1) ``` Go to [custom slide 1](#custom-1)

Slide attribute possibilities from the Reveal.js docs:

  • autoslide
  • state
  • background
  • background-color
  • background-image
  • background-size
  • background-position
  • background-repeat

  • background-video
  • background-video-loop
  • background-video-muted
  • background-interactive
  • background-iframe
  • background-transition
  • transition (can have different in and out transitions)
  • transition-speed
  • notes (can also use the note shortcode)
  • timing

{{% section %}}

{{% slide content="home.example" /%}}

{{% /section %}}