Editor
A full block editor with slash commands, inline formatting, tables, code blocks, images, and auto-save.
Overview
Swashbuckler's editor is a rich block editor built for flexible writing. It supports slash commands for inserting blocks, a floating toolbar for inline formatting, drag-and-drop reordering, tables with hover menus, syntax-highlighted code blocks, and images. Your work saves automatically.
Slash Menu
Type / anywhere in the editor to open the slash menu. It shows all available block types, organized by category. Start typing to filter — for example, /head narrows to heading options.
Block Types
| Block | Description |
|---|---|
| Paragraph | Default text block |
| Heading 1 | Large section heading |
| Heading 2 | Medium section heading |
| Heading 3 | Small section heading |
| Blockquote | Indented quote block |
| Callout | Highlighted box for notes, warnings, or tips |
| Bullet List | Unordered list (also start a line with - or *) |
| Numbered List | Ordered list (also start a line with 1.) |
| Toggle List | Collapsible list with expand/collapse |
| Code Block | Syntax-highlighted code (see below) |
| Table | Grid with rows and columns (see below) |
| Image | Upload or embed an image (see below) |
| Mention | Reference another entry (see Relations & Linking) |
| Private | Owner-only content block (see Private Content) |
Inline Formatting
Select text to reveal the floating formatting toolbar. You can also use keyboard shortcuts:
| Format | Shortcut | Description |
|---|---|---|
| Bold | Cmd+B | Bold text |
| Italic | Cmd+I | Italic text |
| Code | Cmd+E | Inline code |
| Link | Cmd+K | Hyperlink |
| Underline | Cmd+U | Underlined text |
| Strikethrough | Cmd+Shift+S | Strikethrough text |
| Highlight | Cmd+Shift+H | Highlighted text |
| Spoiler | — | Click-to-reveal hidden text |
| Private | Cmd+Shift+P | Owner-only inline text (see Private Content) |
Images
Insert images in three ways:
- Slash menu — type
/imageand select Image - Paste — paste an image from your clipboard directly into the editor
- Drag and drop — drag an image file onto the editor
Uploaded images have a 3 MB size limit and support JPEG, PNG, GIF, WebP, and SVG formats. Hover over an image to see a toolbar with Replace and Delete actions.
Guest users can embed images by URL only (no file upload).
Tables
Insert a table from the slash menu (/table). Tables support:
- Hover menus — hover over the left edge of a row or the top edge of a column to see a handle. Click it to open a dropdown with:
- Insert row above / below
- Insert column left / right
- Delete row / column
- Delete table
- Tab navigation — press Tab to move between cells
Code Blocks
Insert a code block from the slash menu (/code). Code blocks support syntax highlighting for:
JavaScript, TypeScript, HTML, CSS, JSON, Python, SQL, Go, and Rust.
Select the language from the dropdown in the top-right corner of the code block.
Auto-Save
Your work saves automatically — there's no save button. In solo mode, the editor saves 1 second after you stop typing. During real-time collaboration, saves happen every 3 seconds and are coordinated by a leader election system.
A status indicator in the entry header shows the current save state. If you close the browser tab with unsaved changes, you'll see a confirmation prompt.
Drag and Drop
Hover over any block to see a drag handle on the left side. Grab it to reorder blocks within the entry. You can drag headings, paragraphs, lists, images, tables, and any other block type.
Keyboard Navigation
The editor supports standard keyboard navigation — arrow keys to move between blocks, Enter to create new blocks, Backspace to merge with the previous block, and Tab/Shift+Tab to indent and outdent list items.