Outpost Community Demo

The Rich Markdown Editor: Write, Format & Share Visually

By top-outpost-ninja ·

The Rich Markdown Editor: Write, Format & Share Visually

Outpost's editor is built for speed and expression. Whether you're writing a quick reply or a long-form guide, the toolbar, keyboard shortcuts, and visual features make it easy to create polished content without leaving your flow.

The Toolbar

The editor toolbar gives you one-click access to every formatting option:

Group Actions
Text Bold, Italic, Strikethrough, Heading 1, Heading 2
Insert Link, Image Upload, Gallery Upload, Inline Code, Code Block
Blocks Blockquote, Bullet List, Ordered List, Task List, Horizontal Rule
Extras @Mention, Emoji Picker, Preview Toggle

Everything you need is right there � no memorizing syntax required.

Keyboard Shortcuts

For those who prefer to keep their hands on the keyboard, Outpost supports a full set of shortcuts:

Shortcut Action
Ctrl+B Bold
Ctrl+I Italic
Ctrl+Shift+X Strikethrough
Ctrl+K Insert Link
Ctrl+Shift+K Code Block
Ctrl+Enter Submit Reply
Tab Indent list item
Shift+Tab Unindent list item

All shortcuts work with Cmd on Mac.

Smart List Continuation

One of the editor's most satisfying features: lists continue automatically when you press Enter.

  • Start a bullet list with - and hit Enter � the next line gets a bullet too
  • Ordered lists auto-increment: 1., 2., 3....
  • Task lists (- [ ]) continue with new unchecked items
  • Press Enter on an empty list item to stop the list
  • Use Tab and Shift+Tab to indent and unindent nested items

This makes writing structured content fast and natural.

Image Uploads

Adding images to your posts is effortless. You have three ways to upload:

  1. Toolbar button � Click the image icon and select a file
  2. Drag and drop � Drag an image onto the editor and release
  3. Paste from clipboard � Copy an image and Ctrl+V directly into the editor

Supported formats: JPEG, PNG, GIF, and WebP (up to 5MB each). Images are inserted as markdown and rendered inline in your post.

Image Galleries & Slideshow

This is where things get visual. When you want to share multiple images together, use the Gallery feature.

  1. Click the Gallery button in the toolbar (the multi-image icon)
  2. Select multiple images at once from the file picker
  3. Outpost uploads them all and wraps them in a gallery block:

That's it � the :::gallery syntax tells Outpost to render these as a visual grid instead of stacked images.

How Galleries Display

Galleries automatically adapt their layout based on how many images you include:

Images Layout
1 Full-width single image
2 Side-by-side (50/50)
3 Feature layout � one large image spanning two rows, two smaller on the right
4 2�2 grid
5+ 3-column masonry-style grid

Images have a subtle hover zoom effect and are clickable.

Slideshow Lightbox

Click any image in a gallery to open the full-screen lightbox:

  • Navigate between images with left/right arrows or arrow keys
  • See the current position with the image counter (e.g., "3 / 7")
  • Press Escape or click the ? button to close
  • Navigation wraps around � go past the last image and you're back at the first

The lightbox works on both desktop and mobile, making galleries a great way to share screenshots, photos, or step-by-step visual guides.

When a topic contains images, Outpost automatically extracts a preview thumbnail and shows it in the topic list. This gives your community feed a visual, magazine-like feel that draws people in.

@Mentions

Type @ followed by a name to mention another community member:

  • A search dropdown appears as you type, showing matching members
  • Use arrow keys to navigate and Enter to select
  • The mentioned user gets a notification so they don't miss it
  • Results show avatars and display names for easy identification

Mentions are a great way to pull specific people into a conversation.

Emoji Picker

Click the emoji button in the toolbar to open the built-in emoji picker with 32 commonly-used emojis across categories like smileys, gestures, celebrations, and more. Click any emoji to insert it at your cursor position.

Live Preview

Toggle the preview mode (eye icon) to see a side-by-side live preview of your markdown as you type:

  • On desktop: editor on the left, rendered preview on the right
  • Markdown renders in real-time as you type
  • YouTube and Vimeo links automatically embed as playable videos in the preview
  • Gallery markers are hidden � you see the actual image grid
  • Styled with your community's theme colors

This is especially useful when writing longer posts or checking that your formatting looks right before publishing.

Word & Character Count

The bottom-right corner of the editor shows a live word and character count � handy for keeping posts concise or meeting a target length.

Auto-Growing Editor

The editor automatically expands as your content grows. No fixed height box to scroll inside � you can see your full post as you write it.


The editor is designed to get out of your way while giving you the tools to create great content. Whether you're dropping in a quick emoji reaction, building a gallery of product screenshots, or writing a detailed tutorial with code blocks and task lists � it all happens in one place, with no plugins or extensions needed.