README
Adobe Experience League Markdown Authoring
This is a VS Code extension that enhances the built-in Markdown preview feaures with Adobe extensions to the Markdown specification.
Currently this plugin extends the CommonMark specification, which is slightly different from the Git-flavored Markdown described in the Adobe Internal Authoring Guide.
Features
In addition to the standard markdown preview features provided by VS Code that adhere to the CommonMark specification, this extension attempts to provide a high-fidelity representation of Markdown that adheres to the custom Markdown syntax specified in the Adobe Markdown Syntax Style Guide.
Supported Markdown extensions
- Note, Caution, Important, Tip, Warning, Admin, Availability, Prerequisites
- Embedded video
- More Like This
- Various UI tags for localization
Installation
The easiest way to install
Examples
Here are some examples of the Adobe extensions in action. If you have the extension installed, it will format this document in the built-in VSCode preview panel. If you do not have the extension installed, the generic VSCode Markdown Preview will use the CommonMark spec to render the alert extensions as block quotes.
Note
>[!NOTE]
>
>Here is a note component. Notice that it is just a blockquote that has a [!NOTE] label at the beginning of the code.
[!NOTE]
Here is a note component. Notice that it is just a blockquote that has a [!NOTE] label at the beginning of the code.
Caution
>[!CAUTION]
>
>Here is a caution component. Notice that it is just a blockquote and that you can _embed_ inline markdown including `pre-formatted text` and other **chicanery**
[!CAUTION]
Here is a caution component. Notice that it is just a blockquote and that you can embed inline markdown including
pre-formatted text
and other chicanery
[!TIP]
Here is a tip [!TIP] This is after this.
Important
> [!IMPORTANT]
>
> Here is the _IMPORTANT_ component. It's only one line.
[!IMPORTANT]
Here is the IMPORTANT component. It's only one line.
Tip
Video
Exposed Commands
Name | Description | Default key binding |
---|---|---|
md-shortcut.showCommandPalette | Display all commands | ctrl+M ctrl+M |
md-shortcut.toggleBold | Make **bold** | ctrl+B |
md-shortcut.toggleItalic | Make _italic_ | ctrl+I |
md-shortcut.toggleStrikethrough | Make ~~strikethrough~~ | |
md-shortcut.toggleLink | Make [a hyperlink](www.example.org) | ctrl+L |
md-shortcut.toggleImage | Make an image ![](image_url.png) | ctrl+shift+L |
md-shortcut.toggleCodeBlock | Make ```a code block``` | ctrl+M ctrl+C |
md-shortcut.toggleInlineCode | Make `inline code` | ctrl+M ctrl+I |
md-shortcut.toggleBullets | Make * bullet point | ctrl+M ctrl+B |
md-shortcut.toggleNumbers | Make 1. numbered list | ctrl+M ctrl+1 |
md-shortcut.toggleCheckboxes | Make - [ ] check list (Github flavored markdown) | ctrl+M ctrl+X |
md-shortcut.toggleTitleH1 | Toggle # H1 title | |
md-shortcut.toggleTitleH2 | Toggle ## H2 title | |
md-shortcut.toggleTitleH3 | Toggle ### H3 title | |
md-shortcut.toggleTitleH4 | Toggle #### H4 title | |
md-shortcut.toggleTitleH5 | Toggle ##### H5 title | |
md-shortcut.toggleTitleH6 | Toggle ###### H6 title | |
md-shortcut.addTable | Add Tabular values | |
md-shortcut.addTableWithHeader | Add Tabular values with header | |
md-shortcut.toggleNote | Make a [!NOTE] block | ctrl+m ctrl+n |
md-shortcut.toggleTip | Make a [!TIP] block | ctrl+m ctrl+t |
md-shortcut.toggleCaution | Make a [!CAUTION] block | ctrl+m ctrl+c |
md-shortcut.toggleImportant | Make an [!IMPORTANT] block | ctrl+m ctrl+p |
md-shortcut.toggleWarning | Make a [!WARNING] block | ctrl+m ctrl+w |
md-shortcut.toggleMoreLikeThis | Make a [!MORELIKETHIS] block | ctrl+m ctrl+m |
md-shortcut.toggleVideo | Make a [!VIDEO] block | ctrl+m ctrl+v |
md-shortcut.toggleDNL | Make a [!DNL] block | ctrl+m ctrl+d |
md-shortcut.toggleUIControl | Make a [!UICONTROL] block | ctrl+m ctrl+u |
Extension Settings
Since this is an expansion on the built-in VS Code preview extension, any settings applicable to that extension also apply to this one. You can find more information about support for Markdown in Visual Studio Code at in the Visual Studio Code online documentation.