Marginal Note

A marginal note contains additional important but nonessential information. It explains some context, sheds light on a detail or speculates on a given topic etc.

A marginal note should accompany the main text without interrupting it. If the view-port is big enough, it’s placed in the right margin. On mobile view-ports it appears in a box of limited height.

Syntax

The marginal note follows after the content block it belongs to and this is the usual layout order on mobile view-ports. But the note will also be placed besides the next block on large view-ports and that is usually not intended.

To let it float besides the block before, we need to change the layout of this block with the attribute .inline to make room in the right margin.

Longer Paragraph …
{.inline}

{{< mnote >}}
**Public junk dwarves** hug my quartz fox. Zack Gappow saved the job requirement
list for the six boys. Bored? Craving a pub quiz fix? Why, just come to the
Royal Oak! Cozy sphinx waves quart jug of bad milk. Quads of blowzy fjord 
ignite map vex’d chicks.
{{< /mnote >}}

The shortcode is called mnote and needs an opening and closing tag around the note. The note can contain only inline styling and no headings etc.

The shortcode has four named parameters:

star
Number of stars to show at the beginning of the note. 1 or 2 are possible.
dagger
Kind of dagger to show at the beginning of the note. 1 or 2 crossings are possible.
up
Number of units (1rem) to push the note up. The default line height for this theme is three units. We can move the note up in case we can’t use {.inline}.
down
Number of units (1rem) to push the note down. This is the way to make room for absolute positionend layout elements (like the featured image) in the margin before the current note.

Optional stars or daggers should be matched by similar signs in the main text. They are used to reference notes which can’t be placed in the vincinity of the text they are referring to because other layout elements got in the way.

A star is the usual asterisk * on the keyboard. A dagger † corresponds to the entity &dagger; and a double dagger ‡ to &Dagger;.

Layout

The theme distinguishes between short and long marginal notes. On screens with a right margin, their layout is identical. On smaller ones, the long notes are partly hidden and can be expanded.

Short Note

The quick brown fox jumps over the lazy dog. The lazy major was fixing Cupid’s broken quiver. Five quacking zephyrs jolt my wax bed.* Bawds jog, flick quartz, vex nymph. Jacky can now give six big tips from the old quiz. Five hexing wizard bots jump quickly. Jackie will budget for the most expensive zoology equipment. Quick wafting zephyrs vex bold Jim.

Long Note

Who packed five dozen old quart jugs in my box? The wizard quickly jinxed the gnomes before they vaporized. A very bad quack might jinx zippy fowls. Public junk dwarves hug my quartz fox. How quickly daft jumping zebras vex. Five hexing wizard bots jump quickly. Fix problem quickly with galvanized jets.† A very big box sailed up then whizzed quickly from Japan. Jack, love my big wad of sphinx quartz! Glib jocks quiz nymph to vex dwarf. Joaquin Phoenix was gazed by MTV for luck. When zombies arrive, quickly fax judge Pat. The quick onyx goblin jumps over the lazy dwarf. Waltz, bad nymph, for quick jigs vex! Zelda might fix the job growth plans very quickly on Monday. A quick movement of the enemy will jeopardize six gunboats.

See Also