I'm a headline

• some

• notes

• Jump to slide 3

headline level 2

I am code

full slide image

image to right

• some notes
• about the image

Speaker notes

• notes are in the comment
• only visible in presenter mode (export to html)

speaker notes everywhere

• notes are in the comment
• only visible in presenter mode (export to html)

Use of html elements is supported

DataPLANT olive

DataPLANT red

DataPLANT yellow

DataPLANT lightblue

Two types of bullet points

Lists with - are rendered as a single slide

- item 1
- item 2
- item 3

Lists with * are rendered into "multiple" slides (in html), building up one per bullet point

* item 1
* item 2
* item 3

asterisk bullets

• item 1
• item 2
• item 3

Styling with css

• Marp supports basically all layouting with combination of html and css
• con: hard to learn
• pro: very flexible and pretty much everything can be googled

Global and local directives

MARP differentiates global (all slides) and local (current slide) "directives" (styles)

https://marpit.marp.app/directives

• CSS global:

<style>
</style>

• CSS local:

<style scoped>
</style>

Do not use global styling in bricks! Otherwise these will mess up styling of slide decks combined from multiple bricks / units.

column-split slides

This is a very very very very very unusually long headline that I want to fit on one line

add <!-- fit --> behind a headline to make it fit into one line

---

# This is a very very very very very unusually long headline that I want to fit on one line <!-- fit -->

Align content in center

align all content

some content

center align image (Incorrect)

Note, this will also center all images on the slide (including those in the footer)!

center align image (Not perfect, but better)

Crop an image

E.g. a figure coming from what used to be a slide with header/footer

Omitting footer from individual slides

e.g. if a footer (logos, page numbers, etc.) is used over all slides

Add caption to figure to right side of image

to bottom of image

Image with caption right, bullet list left

• ok this is
• rather
• annoying
• and a somewhat
• cumbersome
  • workaround