⚠️ Moved to new organization

Go to https://github.com/sanity-io/sanity-plugin-markdown for the new version!

sanity-plugin-markdown

Markdown input component and schema type for Sanity

Installing

In your Sanity studio folder, run:

sanity install markdown

Features

• Auto-growing input area
• Preview mode
• Keyboard shortcuts for formatting

Basic usage

TL;DR: Just use type: 'markdown' on a field in your schema!

Long version: In your schema definitions (think schemas/blogPost.js):

export default {
  name: 'blogPost',
  title: 'Blog Post',
  type: 'document',
  fields: [
    // ... other fields ...
    {
      name: 'body',
      title: 'Body',
      type: 'markdown',
      options: {
        minRows: 20
      }
    }
  ]
}

Options

• editorClassName - string The class name to use for the editor.
• minRows - number Minimum number of rows to show for the text area input (default: 10)
• autoGrow - boolean Whether or not to automatically grow the text area on input (default: true)
• usePreview - boolean Whether or not to use the preview functionality (default: true)
• previewOptions - object Object of props passed to react-markdown for rendering (default: {skipHtml: true})
• renderPreview - function React component used to render Markdown preview (default: react-markdown)
  • Looking to render full-blown HTML? You may import sanity-plugin-markdown/html-preview for a renderer that parses HTML. Be careful, input is not filtered.

Default option values

See options table. Can be retrieved programatically from the defaultOptions property on the input:

import MarkdownInput from 'sanity-plugin-markdown'

console.log(defaultOptions)

Keyboard shortcuts

Based on GitHub + Google Docs keyboard shortcuts.

Mac:

Key	Action
⌘ + ⇧ + P	Toggle write/preview mode
⌘ + B	Toggle bold
⌘ + I	Toggle italic
⌘ + K	Toggle link
⌘ + ⇧ + 7	Toggle ordered list
⌘ + ⇧ + 8	Toggle unordered list
⌘ + ⇧ + 7	Toggle ordered list
⌘ + ⌥ + 1-5	Toggle heading

Window/Linux:

Key	Action
⌃ + ⇧ + P	Toggle write/preview mode
⌃ + B	Toggle bold
⌃ + I	Toggle italic
⌃ + K	Toggle link
⌃ + ⇧ + 7	Toggle ordered list
⌃ + ⇧ + 8	Toggle unordered list
⌃ + ⇧ + 7	Toggle ordered list
⌃ + Alt + 1-5	Toggle heading

License

MIT © Espen Hovlandsdal