I created this blog more than half a year ago and a lot of convetion I tried to introduce was lost in memory. This document will help to remember what’s possible and how it will look like.

It should also help to quickly test if formatting would break with any future updates of the site.

TL;DR

This heading is not part of the TOC. All headings can be linked via their short name: this heading.

Formatting

• Belonging words should have   between to prevent wrapping: Papp Róbert.
• Long list of alternatives should have <wbr> between them to allow wrapping: this one/that one/other thing
• Use <samp> for sample output: Exit code: 1.
• Use <samp> for math: 4 people × 5 days = 20 man hours.
• Use <var> for something representing a number: your age times.
• Use <mark> for callout Grammar Nazis
• Use <mark> for UI elements: Press Next to proceed.
• Use <abbr> to show an abbreviation: shot, but it’s not necessary if the abbr is defined in markdown
• Custom colors when referencing something highlighted on an image: Save button.

Code

• File extensions with <code>: .css, .js, .html
• Paths and file names with <samp>: lib/code/path/file.name
• Liquid-like code may need some escaping: {{tag}}
• Fencing code blocks’ ticks can be output like this: <code>```</code> → ```.
• Don’t be lazy with alternative/code/formatting.

Normal code block

/** Comment */
public void method();

Some extra explanation to help understand the code.

Code block with title

/** Comment */
public void method();

Code block with Liquid code

{% for tag in site.data.tags %}<li>{{ tag.name }}{% unless forloop.last %}, {% endunless %}</li>{% endfor %}

Code block for shell

me@laptop$ command args "more args"
output text from command
though output may be highlighted weirdly

Quotes

Here’s a short quotation which is in the middle of a sentence.

This is a long quotation by someone, normal markdown formatting rules apply:
strong, em, em, strong em, html bold, code, kbd, samp, ins, del TWiStErRob

Program output text output from file.name in library

Alerts

All alerts support markdown and their names are all lowercase, because they’re used as CSS classes, for example TODO is alert todo=. The TODO: prefix is not automatically inserted, it’s for name calling only here.