over 8 years ago

To writing Markdown in Sublime Text 3, two plugins are needed to:

  1. Enable Markdown syntax highlighting
  2. Convert Markdown document to HTML and preview it in a web browser

To accomplish these, install these two plugins:

  1. Markdown Editing: This plugin enables syntax highlighting for standard Markdown, Github Flavoured Markdown(GFM) and MultiMarkdown

  2. Markdown Preview: as the name suggests, it converts your MD file to HTML and opens it in your system default browser

  3. LiveReload(optional): This is a standalone plugin (i.e. has nothing to do with Sublime Text 3) that automatically refreshes a webpage if its source (HTML,CSS,JS, etc.) has changed. With this plugin, you don't have to click on refresh or F5 everytime you make changes in the Markdown document.

How to use these plugins:

  • Markdown Editing: once installed, open a Markdown document, set the syntax to either Markdown, GFM, or MultiMarkdown by either click at the bottom right corner and select or use command + shift + p > Set Syntax: Markdown

  • Markdown Preview: once installed, open a Markdown document, press ** Command + Shift + p ** > Preview in browser > select the markdown option (You will see two options presented here. GitHub or Mardown. The github option means to use Github's online API for parsing the MD file, this can take sometime due to your connection speed. It also has a 60 calls/day limitaion. But the upside is you get a GFM with syntax highlighting and EMOJI support for free)

If selecting parser becomes anonying everytime you preview a MD file, you can always set a hotkey in your Keybindings - User file:

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

A "better" alternative: Github has released a text editor named Atom. It looks and works almost exactly like Sublime Text (most of the hotkeys are the same too). The best part is that it is FREE.

The reason I mentioned it is because Atom offers default Markdown support. It can open a split window with your MD file on the left and a live HTML preview on the right all in the text editor. There is no need to install any plugins or opening the web browser.

← Useful Sublime Text 3 Settings Visualize the relationships of Django models using Django extensions →
comments powered by Disqus