Uh oh!
There was an error while loading.Please reload this page.
- Notifications
You must be signed in to change notification settings - Fork0
Hotkey/MarkdownEditor
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Download this extension from theVS Galleryor get theCI build.
A full featured Markdown editor with live preview and syntax highlighting.Supports GitHub flavored Markdown.
See thechange log for changes and road map.
- Powered byMarkdig - the best markdown parser
- Syntax highlighting
- Live preview window with scroll sync
- Mermaid chart support
- CommonMark and GitHub flavored Markdown
- High-DPI support
- Drag 'n drop of images supported
- Paste image from clipboard directly onto document
- Outlining/folding of code blocks
- Keyboard shortcuts
- Light Bulbs
- Brace completion with type-through
- Lightning fast
- Auto-generate HTML files
All fonts can be changed inTools -> Options -> Environment -> Fonts and Colorsdialog.
Advanced markdown extensions are supported to give more features tothe syntax. This includes pipe tables, emoji, mathematics and a lotmore.
The preview window opens up on the right side of the document whenit opens.
Every time the markdown document is modified, the preview windowwill update.
Any code blocks receives full syntax highlighting in the previewwindow. Here's an example of JavaScript code rendered.
The preview window is automatically scrolled to match the scrollposition of the document. As the document is scrolled up and down,the preview window will follow.
Live preview can be disabled in thesettings.
The syntax highlighter is powered byPrism
The preview window supports loading of custom stylesheets. It willlook for a file calledmd-styles.css in the same directory asthe currently opened markdown file or any parent directory.
If nomd-styles.css file is found it will look for it in%userprofile%. If it still isn't found it will use the built instylesheet.
To generate a custom stylesheet, simply right-click inside themarkdown editor document and selectAdd Custom Stylesheet...
The name of the custom stylesheet can be changed in the settings.
The preview window also supports loading of HTML template,which will be detailed inAuto-generate HTML files section.
When the markdown document is updated, the markdown editor willcallonMarkdownUpdate function if it exists. With this feature,you can support your own scripts, for example KaTeX for LaTeX.
Drag an image directly from Solution Explorer onto the document toinsert the appropriate markdown that will render the image.
This is really helpful for copying images from a browser or forinserting screen shots. Simply copy an image into the clipboard andpaste it directly into the document. This will prompt you for a filename relative to the document and then it inserts the appropriatemarkdown.
It will even parse the file name and make a friendly name to usefor the alt text.
Any fenced code and HTML blocks can be collapsed, so that this:
...can be collapsed into this:
Ctrl+B makes the selected text bold by wrapping it with**.
Ctrl+I makes the selected text italic by wrapping it with_.
Ctrl+Shift+C wraps the selected text in a code block.
Ctrl+Space checks and unchecks task list items.
-[x] task list item
Tab increases indentation of list items.
Shift+Tab decreases indentation of list items.
Ctrl+K,C wraps the selection with HTML comments.
Ctrl+K,U removes HTML comments surrounding the selection/caret.
Ctrl+PgUp moves caret to previous heading
Ctrl+PgDown moves caret to next heading
The suggested actions shown in light bulbs makes it easier toperform common tasks.
For instance, converting the selected text to a link will resultin this:
By right-clicking any Markdown file in Solution Explorer,you can turn on automatic generation of a HTML file.
It will wrap the output rendered markdown in a HTML templatethat looks like this:
<!DOCTYPE html><html><head><title>[title]</title></head><body> [content]</body></html>
You can provide your own HTML template by dropping a file withthe namemd-template.html in the same or parent folder tothe markdown file. If not found, it will search%userprofile%.
Just make sure to include the[content] token in the template.And the[title] token is optional if you need a title.
Control the settings for this extension underTools -> Options -> Text Editor -> Markdown
Check out thecontribution guidelinesif you want to contribute to this project.
For cloning and building this project yourself, make sureto install theExtensibility Tools 2015extension for Visual Studio which enables some featuresused by this project.
About
A Visual Studio extension
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Releases
Sponsor this project
Uh oh!
There was an error while loading.Please reload this page.
Packages0
Languages
- C#79.3%
- HTML12.0%
- CSS8.7%