When working with the Amplenote Plugin API, the medium by which note content is retrieved and inserted is markdown. Some of the API methods that facilitate markdown exchange include:

Plus the counterparts in the Note Interface. This page will document useful and/or common tactics for maximizing the potential of Amplenote markdown.

linkMarkdown Basics

The markdown syntax utilized by Amplenote's plugin system is also used by Amplenote's export and import functionality. Thus, if you need a quick peek at how some concept is expressed in Amplenote markdown, put the formatted content in a note, and choose "Download" to see how to write it in markdown:

Choosing "Download Note" will initiate a browser download of a markdown file

The note you download can be dragged into Peek Viewer, to either open the file in Peek Viewer, or open it in your browser, depending on which browser is being used. Either way, you'll be able to see the markdown content of the note you were working in.

Generally speaking, Amplenote markdown support follows the GitHub Flavored Markdown Spec.

linkColored Text and Colored Backgrounds

Color in Amplenote is transmitted by way of an HTML comment within a "highlight" (e.g., ==highlighted text==) element. Generally, color should be communicated as an integer value for the cycleColor or backgroundCycleColor key:

Results in the following output:

Red text

on green background

followed by bold blue on golden background

Note that highlight formatting will not be applied if there are any spaces between the end of the == block that begins the highlight, and the text itself. That is, ==Works<!-- {"cycleColor":"1"} -->== vs == Doesn't work 😞 <!-- {"cycleColor":"1"} -->==.

linkIndex of Cycle Colors

The benefit of using cycle colors is that the colors will automatically transition to appropriate colors in light or dark mode. Below are the indexes of Amplenote's 60 supported colors.

linkLight Mode

open_in_new

linkDark Mode

open_in_new

linkInserting a Rich Footnote

When Rich Footnotes include images or descriptions, those appended to the note content as actual footnotes:

linkInserting a Markdown Table

Amplenote follows the usual markdown syntax for defining a markdown table. However, since Amplenote tables allow many types of complex formatting to be inserted in cells, a custom syntax is used when dealing with such objects residing in table cells.

Would insert the following Rich Footnote-bearing table cell:

open_in_new

With a specific cell width:

The Amplenote table UX sets a colWidth for each cell, so if you fetch a note's table, the HTML comment will be in every column cell. However, to effect the column size, the width declaration only needs to be present in one cell.

linkLine Breaks in Markdown

You can insert line breaks by including a backslash on a line between empty lines. Expressing it via literal Javascript quote:

The above code will create a new note, with the following text:

open_in_new

linkExpressing Markdown in Javascript

Literal quotes are the easiest way to write a block of markdown in Javascript.