Notion-Style Editor

Hudu's rich text editor has been rebuilt from the ground up on TipTap, a modern, block based editing engine. It powers the Knowledge Base article editor and every rich text field across Hudu, and it keeps all the formatting options you already use while adding new ways to build and organize content, including drag and drop blocks, floating menus, and slash commands.

Formatting text

Select any text to reveal a floating toolbar right where you're working — italicize, add color, drop in a link, or highlight, all without leaving your place in the document. Additional formatting options are nested within the toolbar’s “More” icon button if needed.

Using slash commands

Type / at the start of a line to open the slash command menu. This gives you a quick way to insert headings, lists, tables, callout boxes, code blocks, and images without leaving the keyboard.

Adding callout boxes

Type /callout to insert a callout box. Four styles are available: info, tip, warning, and danger, matching the same callout types used throughout Hudu's own documentation.

Rearranging and editing content

Hover near any block and a small context handle (⠿) appears. Use this to drag and drop the block to another location on the page. Click it to open a menu to duplicate, delete, or convert the block to something else.

Working with tables

Tables in the editor come with a full set of tools for adding, resizing, rearranging, and formatting rows, columns, and cells.

• Add a row or column: Hover near the edge of the table until a + button appears on the side you want to add to, then click it.

• Resize a column or row: Click and drag the vertical divider between two columns to adjust column width, or the horizontal divider between two rows to adjust row height.

• Rearrange a column or row: Hover over a column or row to reveal its drag handle (...), then click and drag it to a new position.

• Open row or column options: Left-click a drag handle without dragging to open a menu with options including header row, insert above/below, move, sort, color, alignment, clear contents, duplicate, and delete.

• Format selected cells: With a single cell active, or multiple cells highlighted, click the small dot that appears at the right of the selection to open formatting settings for those cells.

• Open table-wide options: Left-click the six-dot handle to the left of the table to open a menu with color, alignment, fit to width, clear all contents, duplicate, copy anchor link, and delete.

Finding and replacing text

Use Ctrl+F (Windows) or Cmd+F (Mac) while editing to open find and replace. Enter a search term to jump between matches, or enter replacement text to update them one at a time or all at once.

Adding images

Paste, drag in, or upload an image directly into the article body. Images can be placed inline with text or on their own line. Hover over the image to reveal the resize handles. Drag to resize as needed.

   Adding an image directly inside a bulleted or numbered list isn't supported yet. The image will be placed below the list instead.

Helpful Keyboard Shortcuts

• Type ``` (three backticks and a space) or ∼∼∼ (three tildes and a space) to instantly add a code block. Specify a language before the space to see the language auto applied.
• Add inline code snippets easily by typing `your text here` or highlight existing text and hit Cmd+E (Mac) Ctl+E (Windows).
• Type three dashes (---) or three underscores and a space (___ ) at the beginning of a new line to add a separator.
• Type [ ] or [x] at the beginning of a new line to auto insert a task list. Reminder: tasks can be checked/unchecked in edit mode but not in view mode.
• Type >  at the beginning of a new line to insert a blockquote.

Tools

Autosave drafts

While editing, your changes are periodically saved as a draft so in progress work isn't lost if you navigate away or your session is interrupted.

Light and dark mode

The editor follows your selected Hudu theme, so formatting and callouts stay readable in both light and dark mode.

Markdown paste and import

You can pasting markdown directly into the rich text editor, or import/export markdown files using the icon buttons in the top right of the text menu.

FAQ

Troubleshooting