HTML slides¶

htmlSlide { } passes raw HTML straight through to reveal.js. Use it when you need precise control over markup or when embedding media that doesn't translate cleanly from Markdown.

Basic usage¶

fun htmlBasic() {
  kslides {
    presentation {
      htmlSlide {
        content {
          """
          <h1>Raw HTML</h1>
          <p>Anything reveal.js accepts as slide markup.</p>
          """
        }
      }
    }
  }
}

Targeting CSS¶

Set classes to add CSS classes onto the slide's <section> element:

fun htmlWithClasses() {
  kslides {
    presentation {
      htmlSlide {
        classes = "intro-slide"
        content {
          """
          <h1>Styled via class</h1>
          <p>Add CSS rules targeting <code>.intro-slide</code>.</p>
          """
        }
      }
    }
  }
}

You can then style it from the presentation's CSS — see Styling.

Mixing with the DSL¶

Need to generate just part of an HTML slide programmatically? Reach for DSL slides instead — the kotlinx.html DSL composes more cleanly than string concatenation.

Angle brackets¶

htmlSlide content is parsed as markup — that is the point of the slide type — so every tag must be closed and a < that is not opening a tag has to be escaped:

htmlSlide {
  content {
    """
    <p>Write generics as List&lt;String&gt;, and close void elements: <br/></p>
    """
  }
}

Ampersands need no such care: &,   and — are repaired for you. If a < does slip through, the build fails with the deck, the offending line and the fix rather than a bare parser error.

Markdown and DSL slides have no such restriction — write List<String> in a markdownSlide and it just works.