Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/keshann93/markdown-live
📝 Real-time Markdown Editor & Previewer for VS Code
https://github.com/keshann93/markdown-live
markdown-editor markdown-previewer tui-editor vscode-extension
Last synced: 3 months ago
JSON representation
📝 Real-time Markdown Editor & Previewer for VS Code
- Host: GitHub
- URL: https://github.com/keshann93/markdown-live
- Owner: keshann93
- License: mit
- Created: 2019-07-05T09:49:29.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2020-08-10T08:06:36.000Z (over 4 years ago)
- Last Synced: 2024-04-14T03:26:58.043Z (10 months ago)
- Topics: markdown-editor, markdown-previewer, tui-editor, vscode-extension
- Language: CSS
- Homepage: https://marketplace.visualstudio.com/items?itemName=keshan.markdown-live
- Size: 59.7 MB
- Stars: 19
- Watchers: 1
- Forks: 1
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: contributing.md
- License: LICENSE
Awesome Lists containing this project
README
📝 Markdown Editor & Previewer
##### Markdown-live introduces a Markdown editor & previewer into Visual Studio Code.
## Introduction
- Markdown Live is an extension that provides you with many useful functionalities including a live editor with useful options
- A lot of its ideas are inspired by [Markdown Preview Style](https://github.com/mjbvz/vscode-github-markdown-preview-style) and [Unotes](https://github.com/ryanmcalister/unotes).
- Feel free to ask questions, [post issues](https://github.com/keshann93/issues), submit pull request, and request new features.
- For more information about this project and how to use this extension, please check out our Functionalities section⬇︎
## Features
Markdown-live supports the followings
- 💅 Renders instantly any `markdown/.md` document with its content.
- 🎨 markdown-live editor comes with supportive tools/extension accompanied to edit markdown content in an efficient manner
- 🌈 Supports rendering of multiple `.md` files
- 🌏 Instantly syncs the changes made in either of two panels (markdown editor and text-document) across seamlessly
- 🌟 Editor supports shortcut keys for the toolbar, please check the Keybindgs section for more information
- 🌟 Editor supports set a configurations defined, please check the Workspace configuration section for more information
- 🌟 auto scroll syn support is been added
- 🌟 copy & paste of image support is been additionally added along with other functionalities that comes with tui-editor
- 💥 lightweight custom editor extension for markdown: [](https://github.com/keshann93/markdown-live/blob/master/markdown-live-1.2.1.vsix)
- ⚡️ Check [tui.editor](https://github.com/nhn/tui.editor) for more information and config changes.
## Getting started
- Install the [Markdown-live](https://marketplace.visualstudio.com/items?itemName=keshan.markdown-live) extension in VS Code
- After opening a `markdown/.md` file, click on the 
icon to toggle the side-bar
- Place your cursor in the markdown content
- You should see the sidebar tries to render the markdown content
###### Functionality Demo
###### Themes Demo
###### Multi Document Render Demo
## Command Configurations
| Command | Description |
| ------------------ | ----------------------- |
| `showMarkdown` | Toggle Markdown panel |
| `toggleScrollSync` | Toggle Scroll Sync Mode |
- can be executed by opening the command pallete (ctr+shift+p) and type the command to select it and execute
## Workspace Configurations
| Name | Description | Default value |
| ------------------------------------ | ------------------------------------------------------------------------------ | -------------- |
| `automaticallyShowPreviewOfMarkdown` | Automatically shows preview once the markdown/.md file gets opened up | true(boolean) |
| `syncScroll` | Automatically sync the scroll of both editor and doc | true(booelan) |
| `display2X` | Display toolbar buttons of the editor at 2X size | false(boolean) |
| `convertPastedImages` | Convert pasted images to local files, if not it will show in base64 format | true(boolean) |
| `mediaFolder` | The folder where images are saved relative to the markdown file project folder | .media(string) |
- above values are easily configurable through `File -> Preferrences -> settings`
## Keybindings
| Shortcuts | Functionality |
| ------------------------------------------------------ | ----------------------- |
| ctrl + alt + 1/
cmd + alt + 1 | Heading 1 |
| ctrl + alt + 2/
cmd + alt + 2 | Heading 2 |
| ctrl + alt + 3/
cmd + alt + 3 | Heading 3 |
| ctrl + alt + 4/
cmd + alt + 4 | Heading 4 |
| ctrl + alt + 5/
cmd + alt + 5 | Heading 5 |
| ctrl + alt + 6/
cmd + alt + 6 | Heading 6 |
| ctrl + alt + 0/
cmd + alt + 0 | Normal |
| ctrl + alt + b/
cmd + alt + b | Bold |
| ctrl + alt + i/
cmd + alt + i | Italic |
| ctrl + alt + r/
cmd + alt + r | Strike |
| ctrl + alt + t/
cmd + alt + r | Task |
| ctrl + alt + u/
cmd + alt + u | Unordered List |
| ctrl + alt + o/
cmd + alt + o | Ordered List |
| ctrl + alt + q/
cmd + alt + q | BlockQuote |
| ctrl + alt + h/
cmd + alt + h | Inline Code (highlight) |
| ctrl + alt + c/
cmd + alt + c | Code Block |
| ctrl + alt + l/
cmd + alt + l | Horizontal Line |
| ctrl + alt + n/
cmd + alt + n | Indent |
| ctrl + alt + m/
cmd + alt + m | Outdent |
## Acknowledgment
[tui.editor](https://github.com/nhn/tui.editor) is integrated as the markdown editor
## Changelog
Please check the [Releases](./CHANGELOG.md) \| [Github](https://github.com/keshann93/releases) page of this project.
## Contributing
Have a look at our [contribution guide](./contributing.md).
## Contributors
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
## License
[MIT License](./LICENSE)
