BookStack Code Mirror - website/blob - content/docs/user/markdown-editor.md

   1 +++
   2 title = "Markdown Editor"
   3 description = "Details on using the markdown editor in BookStack"
   4 date = "2017-07-28"
   5 type = "user-doc"
   6 +++
   7
   8 If you prefer to write in a simpler format, a Markdown editor is available in BookStack. Markdown compatibility generally follows that of [CommonMark](https://commonmark.org/), along with a few extensions including tables and task-lists.
   9 This is an alternative to the default [WYSIWYG Editor](/docs/user/wysiwyg-editor/).
  10
  11
  12 ### Switching to the Markdown Editor
  13
  14 The default editor option, for when creating a new page, can be configured by an admin within the "Settings > Customization" area of BookStack.
  15
  16 You can change to the markdown editor at a page-level while within the page editor.
  17 Simply click the draft status, located above the page name input, and you'll be presented a drop-down with options which include those to change the editor. If you don't see these options, you may not have the relevant "Change page editor" system permission on one of your assigned system roles.
  18
  19 ![Editor Switch Menu Options](/images/docs/user/editor-switch-dropdown.png)
  20
  21 For switching to Markdown, from the WYSIWYG editor, you'll see a couple of options:
  22
  23 - **Clean Content** - This is a system-cleaned markdown output, which is much nicer but has potential for formatting loss and potential functionality breaks (Things depending on HTML attributes/IDs for example).
  24 - **Stable Content** - This retains existing HTML content in Markdown to avoid any potential functionality breakages or loss of formatting.
  25
  26 When you choose either option, there is risk of losing certain content details or formatting. BookStack will warn you of this when switching.
  27
  28 ### Editor Shortcuts
  29
  30 The following shortcuts are available in the Markdown Editor:
  31
  32 <table>
  33   <thead>
  34     <tr>
  35       <th>Shortcut (Windows &amp; Linux/Mac)</th>
  36       <th>Description</th>
  37     </tr>
  38   </thead>
  39   <tbody>
  40     <tr>
  41       <td><code>Ctrl+S</code> / <code>Cmd+S</code></td>
  42       <td>Save Draft</td>
  43     </tr>
  44     <tr>
  45       <td><code>Ctrl+Enter</code> / <code>Cmd+Enter</code></td>
  46       <td>Save Page &amp; Continue</td>
  47     </tr>
  48     <tr>
  49       <td>
  50         <code>Ctrl+1</code> / <code>Cmd+1</code> <br>
  51         <code>Ctrl+2</code> / <code>Cmd+2</code> <br>
  52         <code>Ctrl+3</code> / <code>Cmd+3</code> <br>
  53         <code>Ctrl+4</code> / <code>Cmd+4</code>
  54       </td>
  55       <td>
  56         Header Large (h2)<br>
  57         Header Medium (h3)<br>
  58         Header Small (h4)<br>
  59         Header Tiny (h5)
  60       </td>
  61     </tr>
  62     <tr>
  63       <td><code>Ctrl+5</code> / <code>Cmd+5</code><br><code>Ctrl+D</code> / <code>Cmd+D</code></td>
  64       <td>Normal Paragraph</td>
  65     </tr>
  66     <tr>
  67       <td><code>Ctrl+6</code> / <code>Cmd+6</code><br><code>Ctrl+Q</code> / <code>Cmd+Q</code></td>
  68       <td>Blockquote</td>
  69     </tr>
  70     <tr>
  71       <td><code>Ctrl+7</code> / <code>Cmd+7</code><br><code>Ctrl+E</code> / <code>Cmd+E</code></td>
  72       <td>Code Block</td>
  73     </tr>
  74     <tr>
  75       <td><code>Ctrl+8</code> / <code>Cmd+8</code><br><code>Ctrl+Shift+E</code> / <code>Cmd+Shift+E</code></td>
  76       <td>Inline Code</td>
  77     </tr>
  78     <tr>
  79       <td><code>Ctrl+9</code> / <code>Cmd+9</code></td>
  80       <td>Callout <br> <small><em>(Keep pressing to toggle through styles)</em></small></td>
  81     </tr>
  82     <tr>
  83       <td>
  84         <code>Ctrl+O</code> / <code>Cmd+O</code> <br>
  85         <code>Ctrl+P</code> / <code>Cmd+P</code>
  86       </td>
  87       <td>Ordered List <br> Bullet List</td>
  88     </tr>
  89     <tr>
  90       <td><code>Ctrl+K</code> / <code>Cmd+K</code></td>
  91       <td>Insert Link</td>
  92     </tr>
  93     <tr>
  94       <td><code>Ctrl+Shift+K</code> / <code>Cmd+Shift+K</code></td>
  95       <td>Link to BookStack content</td>
  96     </tr>
  97     <tr>
  98       <td><code>Ctrl+Shift+I</code> / <code>Cmd+Shift+I</code></td>
  99       <td>Insert Image via URL</td>
 100     </tr>
 101   </tbody>
 102 </table>