Return to site

Markdown Wysiwyg

broken image


The editor and preview dual-pane setup typical of desktop Markdown editors are gone; instead, a singular interface makes for a WYSIWYG experience. This streamlines the. Markdown is a Discord feature that enables the stylizing of text. There are a total of six different markdown operators in Discord. WYSIWYG controls. StackEdit provides very handy formatting buttons and shortcuts, thanks to PageDown, the WYSIWYG-style Markdown editor used by Stack Overflow.

  1. Markdown Wysiwyg Js
  2. Markdown To Html


The TOC can be placed anywhere in the page to render the table of contents. Only Markdown headings are considered for TOC (HTML heading tags aren't). All HTML and Markdown tags are stripped from the headings while adding it inside the TOC block. For example: Adding bold and italics to a heading text renders the TOC as follows. A WYSIWYG editor for GitHub. GitHub Writer is a browser extension that changes GitHub's default plain-text Markdown editor to a WYSIWYG rich-text editor. You can use it when creating, editing, or commenting on GitHub issues, pull requests, and wikis.

Unotes gives you a markdown note editor right inside Visual Studio Code. Don't get distracted with noisy markdown syntax. Enjoy your notes with a rich WYSIWYG editor. Take full control of the markdown when needed. Start taking notes in style!

If you find Unotes useful, please write a review.

Unotes is an open-source extension for Visual Studio Code created by Ryan McAlister.

Unotes helps you visualize and manage your markdown notes. Organize your notes in nested folders and edit them with a rich WYSIWYG editor.

Use Visual Studio Code's built-in search and version control features for all your notes.

  • Unotes will reformat your markdown without warning.
  • It will not preserve special formatting.
  • It auto-saves all edits.

It is highly recommended to use unotes with source control to revert any unwanted changes.

WYSIWYG Editor

Split Markdown / Preview View

Color Themes Supported

Note Ordering

Markdown Wysiwyg Js

Editing Toolbar

Paste Images from the Clipboard

By default images are embedded as base64 text objects. Images can optionally be auto-converted to local files when pasted. See Image convertion to local files.

Local, Embedded and URL Images

Local Image Example

Table Support

Customizable Hotkeys

CommandDefault
Heading 1Ctrl + Alt + 1
Heading 2Ctrl + Alt + 2
Heading 3Ctrl + Alt + 3
Heading 4Ctrl + Alt + 4
Heading 5Ctrl + Alt + 5
Heading 6Ctrl + Alt + 6
NormalCtrl + Alt + 0
BoldCtrl + Alt + b
ItalicCtrl + Alt + i
StrikeCtrl + Alt + s
TaskCtrl + Alt + t
Unordered ListCtrl + Alt + u
Ordered ListCtrl + Alt + o
BlockQuoteCtrl + Alt + q
Inline Code (highlight)Ctrl + Alt + h
Code BlockCtrl + Alt + c
Horizontal LineCtrl + Alt + l
Toggle ModeCtrl + Alt + m

Formatting Options (Experimental)

Unotes can automatically reformat your markdown if desired using remark-stringify. To enable this feature, add a 'remark_settings.json' file to the .unotes folder in yourproject directory. All remark-stringify options can be used.

Note - This feature is experimental and has some known issues.

Additional Remark Settings Options

  • listItemSpace
    • sets the number of spaces after a list marker
    • only works when listItemIndent = 'tab'
  • listItemTabSize
    • sets the list item tab size (default = 4)

Example remark_settings.json

YAML Front Matter Support

Wysiwyg

Unotes now supports the YAML front matter sections in tui-editor 2.0. Note this will not work when using markdown reformatting with remark (see above).

Example

Workspace Configuration Options

SettingDescription
unotes.editor.display2XDisplay the button toolbar at twice the size
unotes.editor.convertPastedImagesAutomatically convert pasted images to local image files in a .media folder
unotes.mediaFolderThe folder where pasted or converted images will be saved. Relative to the note.
unotes.noteFileExtensionThe file extension used to filter and save note files. Default = '.md'
unotes.rootPathThe root folder path for the note files.
Setting this value will turn off auto-tracking of external file changes.
If needed you can click the 'Refresh' button on the notes tree.

Custom Colors

Custom colors can be set to override many of the themed or default color values. Note there are separate values for the wysywig, markdown editor and markdown preview panes.

You can set options in the vscode workspace settings.json file:

Color Options

Color NameDescription
wysTextUnotes wysiwyg text
wysH1Unotes wysiwyg heading 1
wysH2Unotes wysiwyg heading 2
wysH3H4Unotes wysiwyg heading 3 and 4
wysH5H6Unotes wysiwyg heading 5 and 6
wysBlockquoteUnotes wysiwyg blockquote
wysCodeBlockBackgroundUnotes wysiwyg code block background
wysCodeBlockTextUnotes wysiwyg code block text
wysHighlightUnotes wysiwyg highlight / inline code
wysTableTextUnotes wysiwyg table text
wysTableTdBorderUnotes wysiwyg table cell border
wysTableThBorderUnotes wysiwyg table header border
wysTableThBackgroundUnotes wysiwyg table header background
wysTableThTextUnotes wysiwyg table header text
wysListUnotes wysiwyg list text
wysLinkUnotes wysiwyg link
wysLinkHoverUnotes wysiwyg hover link
mdTextUnotes markdown text
mdSelectedBackgroundUnotes markdown selected text background
mdHeaderUnotes markdown header
mdListSub1Unotes markdown list sub item 1
mdListSub2Unotes markdown list sub item 2
mdListSub3Unotes markdown list sub item 3
mdCodeBlockTextUnotes markdown codeblock text
mdCodeBlockBackgroundUnotes markdown codeblock background
mdHighlightTextUnotes markdown highlight text
mdCodeBlockTextUnotes markdown codeblock text
mdTableTextUnotes markdown table text
pvCodeCommentUnotes preview code comment
pvCodeTextUnotes preview code text
pvCodeKeywordUnotes preview code keyword
pvCodeNumberUnotes preview code number
pvCodeStringUnotes preview code string
pvCodeTypeUnotes preview code type
pvCodeDeletionUnotes preview code deletion
pvCodeAdditionUnotes preview code addition
pvCodeTitleUnotes preview code title

Syncing Note Files

  • All note files are stored as .md files by default. This is configurable.
  • Sync to a repository using Git or other version control system
  • Folder and Note settings are stored in .unotes/unotes_meta.json
    • Be sure to sync this file to preserve note orderings

Additional Info

Excluded Folders

The following folders are excluded from the Unotes navigation tree:

  • node_modules/**
  • .* (folders starting with '.')

Known Issues

Markdown To Html

No markdown WYSIWYG is perfect and Unotes has its share of issues. Some issues have been inherited from the current dependencies. Hopefully some of these will be resolved in the near future..

Copy and Paste

  • You may not always get the desired results when pasting directly into the WYSIWYG editor. In some cases it may be best to paste into the raw markdown view.

CodeBlocks

  • Some characters are escape encoded undesireably.

Open Workspace Folder

  • Before using Unotes you must have a folder currently opened in the workspace.

Multiple Workspace Folder Not Supported

  • Unotes currently does not support multiple workspace folders open. This may be a future enhancement.

Acknowlegments

Unotes is here largely thanks to

Latest version

Released:

Django markdown support and wysiwyg.

Project description

Django markdown is django application that allows use markdown wysiwyg in flatpages, admin forms and other forms.Documentaton available at pypi or github.

Contents

Installation

Django markdown should be installed using pip:

Setup

Note

‘django_markdown' require ‘django.contrib.staticfiles' in INSTALLED_APPS

  • Add ‘django_markdown' to INSTALLED_APPS

  • Add django_markdown urls to base urls

Use django_markdown

  1. Models:

  2. Custom forms:

  3. Custom admins:

  4. Admin Overrides: (If you don't want to subclass package ModelAdmin's)

  5. Flatpages:

  6. Template tags:

Settings

MARKDOWN_EDITOR_SETTINGS - holds the extra parameters set to be passed to textarea.markItUp()

MARKDOWN_EDITOR_SKIN - skin option, default value is markitup

Example: settings.py

MARKDOWN_EXTENSIONS - optional list of extensions passed to Markdown, discussed at https://pythonhosted.org/Markdown/extensions/index.html#officially-supported-extensions

Example: settings.py

MARKDOWN_EXTENSION_CONFIGS - Configure extensions, discussed at https://pythonhosted.org/Markdown/reference.html#extension_configs

MARKDOWN_PREVIEW_TEMPLATE - Template for preview a markdown. By default django_markdown/preview.css

MARKDOWN_STYLE - path to preview styles. By default django_markdown/preview.css

MARKDOWN_SET_PATH - path to folder with sets. By default django_markdown/sets

MARKDOWN_SET_NAME - name for current set. By default markdown.

MARKDOWN_PROTECT_PREVIEW - protect preview url for staff only

Examples

Execute make run in sources directory. Open http://127.0.0.1:8000 in yourbrowser. For admin access use ‘root:root' credentials.

Changes

Make sure you`ve read the following document if you are upgrading from previous versions:

Bug tracker

If you have any suggestions, bug reports orannoyances please report them to the issue trackerat https://github.com/klen/django_markdown/issues

Contributing

Development of django-markdown happens at github: https://github.com/klen/django_markdown

Contributors

  • klen (Kirill Klenov)
  • yavorskiy (Sergii Iavorskyi)

License

Licensed under a GNU lesser general public license.

Copyright

Copyright (c) 2011 Kirill Klenov (horneds@gmail.com)

Markitup:
(c) 2008 Jay Salvathttp://markitup.jaysalvat.com/

Release historyRelease notifications | RSS feed

0.8.4

0.8.3

0.8.1

0.8.0

0.7.1

0.7.0

0.6.1 Proencryptor 1 3.

0.6.0

0.5.4

0.4.0

0.3.0

0.2.5

0.2.4

0.2.3

0.2.2

0.2.1

0.2.0

0.1.0

0.0.9

0.0.8

0.0.7

0.0.6

0.0.5

0.0.4

0.0.3

0.0.2

0.0.1

0.0.0

Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Files for django-markdown, version 0.8.4
Filename, sizeFile typePython versionUpload dateHashes
Filename, size django_markdown-0.8.4-py2.py3-none-any.whl (97.0 kB) File type Wheel Python version py2.py3 Upload dateHashes
Filename, size django-markdown-0.8.4.tar.gz (68.5 kB) File type Source Python version None Upload dateHashes
Close

Hashes for django_markdown-0.8.4-py2.py3-none-any.whl

Hashes for django_markdown-0.8.4-py2.py3-none-any.whl
AlgorithmHash digest
SHA256118d3a3b0dda0279785c007720fe594ccf9fa4cc1d6cee878bb81d36a02dd668
MD59de75e296c5a0b8c9065611a650f23f3
BLAKE2-25621fbdd7837fdf86012a657df79aea607a2d701e89c5549342c2bb74b33cb6219
Close

Hashes for django-markdown-0.8.4.tar.gz

Hashes for django-markdown-0.8.4.tar.gz
AlgorithmHash digest
SHA256bab6719cac47c7139c9f489816a99fd656caa56d364a2b7d2137db698219b402
MD546b002d24797c7274e3b3106ecd1982e
BLAKE2-256130912aa1b161620da511bdde3b664d8d6479d42e18d04d34d64f82f384dbf37




broken image