Markdown Explored

Markdown is a fairly simple "language" to learn. For many people, just typing and using a handful of control characters will be sufficient. However, it has become a very feature-rich format supporting things like outlines, images, tables, linking, etc., perhaps even some things surprising to you.

Over time multiple "flavors" of Markdown have been introduced. DEVONthink Markdown utilizes standard Markdown but also supports features from some other flavors: MultiMarkdown, CommonMark, CriticMarkup, and GitHub Flavored Markdown (GFM). Here you can read about many possible features, but also realize it's not exhaustive. There many be extra features for an element, but we'll leave the deeper investigation to you!

Basic formatting: Get started by simply typing, creating paragraphs. These will usually be your most common element. But as you write, you may want to add some emphasis to certain content. To add formatting, surround the content with control characters showing the Markdown parser the words should be rendered with specific formatting. Here are the three most common styles you'll use:

With these basics, you can quickly capture ideas or write longer-form content in plain text, but with some extra flair. However, the possibilities only increase from here.

Extended Formatting and Elements: Often used in academic or professional writing, some specialized formatting is also supported. The first two are standard Markdown; the remainder are CriticMarkup.

Lists: Whether for an outline, shopping list, taxonomies, or record your top ten movies, creating lists is easily done. These are the supported types:

As you type each line item, pressing the ↩︎ Return key will add a new line item ready to enter the next one. Press the key twice to close the list. Lists can be indented to create nested lists by pressing the ⇥︎ Tab key or adding one space per-level at the beginning of a line. To outdent a list, remove spaces from the line's beginning.

Tables: Creating tables is supported, even building them in a semi-visual manner. The cells of the table are separated by the pipe | character. (A pipe at the beginning and end is optional.) The top of a table is defined the header line: the number of columns denoted by pipes, usually with column header names, e.g., Name|Location||Age. The next line is the column alignment line: three hyphens, again separated by a pipe, like :---|:---|---|:---:. The colons : control if the cell content is left, right, or center justified. Then you enter each row's cell's content, e.g., Jason|Marana|AZ|48, on separate lines. You can also include an optional table caption in square brackets immediately before or after the table, like [Friends and Family].

Sections: As your content becomes more complex, you may want to split the content into sections. Create a section by typing # followed by a space and the title of the section, e.g., # Milky Way. This creates an "h1" heading. Sections up to six levels deep are made by using the requisite number of hashtag symbols. So your first subsection would be ## Planets, creating an "h2" heading. You can use these headers to navigate the document in the Table of Contents inspector. Additionally, you can include a table of contents in the document by entering {{TOC}} where you want it to appear. You'll also find more information in the Cross-Reference Linking section below.

Everyday Extras: Here are a few more common elements you may find useful in your writing:

Advanced Markdown

DEVONthink Markdown also supports some "advanced" features found in some other Markdown flavors. From academia to design to business uses and more, these give you some specialized tools to work with.

Footnotes: Footnotes are supported in our parser and automatically insert a numbered footnote link in the text. These are two of the supported footnote styles:

Callouts: A feature found in GitHub Flavored Markdown, a callout or admonition is a specially styled blockquote element to call attention to some text, e.g., a tip or warning. The syntax is >[!Type]Optional Title followed by the message, preceded by the greater than symbol. The supported types are: INFO, NOTE, TIP, IMPORTANT, CAUTION, WARNING, DANGER, QUESTION, EXAMPLE, QUOTE, SUCCESS, FAILURE, and BUG. The callout's text can contain rich content, like formatting, links, lists, etc.

Callouts can be collapsible and have an initial state when the document is viewed., opened or closed. After the closing square bracket, include a plus + for open or a minus - for closed, e.g., >[!INFO]-What is subzero?.

The MkDocs and Python-Markdown callout syntax is also supported.

Abbreviations: Abbreviations are content appearing in tooltips when you hover over words with definitions. To define the abbreviation text, use the syntax: *[Word]: tooltip text. Create the abbreviation *[NASA]: National Aeronautics and Space Administration and the full title will appear when you hover over NASA in the preview.

Metadata: DEVONthink Markdown supports MultiMarkdown-style metadata headers as well as YAML/frontmatter. With it you can add non-displaying information about the document, like authors, dates, and even linked stylesheets as metadata.

To use the feature, format the first line of the document with a colon, e.g., Author: DEVONtechnologies. Add as many metadata fields as you wish but they must be in a block at the top of the document. Pre-defined fields in the Info > Properties inspector can be populated with this metadata, e.g., keywords: support,markdown. If you're not using metadata and want the first line of your document to contain a colon, add a single blank line at the top of the document and the subsequent lines will be treated as normal paragraphs.

Metadata can also be used as variables in the content of the document by entering the attribute's name prefixed with a percent sign, inside square brackets. So if you enter product: widget-002 in the metadata, you would type [%product] in the text and it will render as widget-002 in the preview.

Markdown Extensions

DEVONthink supports some Markdown extensions to provide a few specialized features in the output. These can be toggled in the Files > Markdown > Extensions settings.

MathJax: Markdown is often used in academic situations, many using mathematical equations in their writing. DEVONthink supports the Mathjax extension that will beautifully render coded equations.

Mermaid: Diagrams can be created in Markdown documents using the Mermaid extension. Add a line of three backticks as shown```mermaid. Add the diagram code as needed and close the diagram with another line of three backticks. There are several diagram types available and the syntax is discussed on their website.

Prism: For those writing code in their Markdown, DEVONthink supports Lea Verou's Prism extension. Just add a line of three backticks ```language- and the language you're using, for example, ```language-applescript. Remember to add a line of three backticks under the code to close it. This displays syntax highlighting of code blocks in the rendered output.

Styling

There is a default style built into DEVONthink and it's usually good for quick and easy composition. If you want to make some changes, adjust margins, line width and spacing, and choose a specific Markdown font via the Editing > Format settings.

More complex styling is done with CSS (Cascading Style Sheets), using either internal styling or externally referenced stylesheets. If you have a specific stylesheet you'd like to use globally, you can specify one in the Files > Markdown > Style Sheet settings. This will apply the style to all your Markdown documents. If you're creating documents for different purposes or building a style you like, here are options for in-document styling:

You can also search online to find thousands of tutorials on CSS, as well as many styles. Do note many of the styles are very complex and often made specifically for certain types of web layouts. It's often better to investigate how to style specific things, e.g., tables, as the need arises.