Turn Your Sublime Test Into a Markdown Editor

Markdown language is the new favourite for all the blog writers. It is great to create formatted content without learning a new language with hundreds of syntax and tags. The text remains free of any markup tags or instructions which allows it to be published as simple plain text also. The philosophy of Markdown is to make it easy to write and easy to read.

One of the best Markdown packages available for Sublime Test is “MarkdownEditing”. It is available for both ST2 and ST3. Installing any package in ST requires package control feature in Sublime Text. To install package control in Sublime Text you can refer the page here.

Once you have the package control installed on your ST, you can install “MarkdownEditing” by following the below basic steps.

• Open command palette by typing cmd+shift+p (mac) or ctrl+shift+p (win).
• Type Install and it will show the option “Package Control: Install Package”. Choose this option and press enter.
• It will take some seconds and then will display the available packages available to install. Now type markdown in the command box. ST will display all the packages availabewith the term markdown. Now select “MarkdownEditing” in the list and press enter.

• It will take couple of seconds to install the package.
• Now restart ST to see the new package installed in effect.
• Save text file with .md extension which stands for markdown to see how the package works.

“MarkdownEditing” supports 3 flavours of Markdown: Standard Markdown, GitHub flavoured Markdown, MultiMarkdown. You can change the default Markdown flavour at “Preferences > Package Settings > Markdown Editing". standard markdown is the default markdown flavour supported by this package.

MarkdownEditing changes the default color scheme for .md files. You can change it to dark theme. You can also enable spell check in markdown file.

• Go to:  “Preferences > Settings - more > Syntax Specific - user"
• This opens the setting file for MarkdownEditing package.
• Add the below line.
  "color_scheme": "Packages/MarkdownEditing/MarkdownEditor-Dark.tmTheme"
• Or you can enable other color schemes of ST as below.
  “color_scheme”: “Packages/Color Scheme – Default/Monokai.tmTheme”
• Enable spell check by inserting the below line.
  “spell_check”: true

Now we have a editor to write and edit markdown files. But still we are not able to compile and preview it in html format. ST doesn’t provide preview of Markdown in a side by side window. But preview can be done in a web browser using the “Markdown Preview” Package. Install the “Markdown Preview” package using package control.

• Open command palette.
• Type install and select “Package Control: Install Package”.
• Type Markdown and select “Markdown Preview” package to install it.

You can view the Markdown preview by using the Command Palette. You type control+shift+p to open Command Palette. Then type “Preview“, select “Markdown Preview: Python Markdown: Preview in Browser”, and hit enter to view the preview in browser. Type Markdown Preview in command palette to view all the available options for this package as below:

• Markdown Preview: Preview in Browser
• Markdown Preview: Export HTML in Sublime Text
• Markdown Preview: Copy to Clipboard
• Markdown Preview: Open Markdown Cheat sheet

By default it supports the standard markdown flavour. You can change the behaviour to support Github Flavoured markdown at “Preferences > Package Settings > Markdown Preview > Settings-Default“. You can build the html file by using ‘ctrl + b’ (win) or ‘cmd + b’ (mac).

You can add a key combination for preview of markdown file in browser.

• Go to:  “Preferences > Key Bindings - User". Add the below code block.

 { 
   "keys": ["alt+m"], 
   "command": "markdown_preview", 
   "args": {
     "target": "browser", 
     "parser":"markdown"
   } 
}

• By pressing [alt + m] you can get the preview of the markdown file in your default browser.

P.S. You can update the browser preview of markdown file automatically using LiveReload plugin.

Now your Sublime Text is ready to be used as a Markdown editor. Hope this information will help you all. Provide your valuable feedback.