Skip to main content

Editor shortcuts and tips

Power-user techniques to write faster in the block editor.

Keyboard shortcuts​

Inline marks (selected text)​

ShortcutAction
Cmd/Ctrl + BBold
Cmd/Ctrl + IItalic
Cmd/Ctrl + UUnderline
Cmd/Ctrl + EInline code
Cmd/Ctrl + KLink (opens link editor)
Cmd/Ctrl + Shift + SStrike-through
Cmd/Ctrl + .Increase nesting (in lists)

Block creation (typing)​

TypeResult
# then spaceHeading 1
## then spaceHeading 2
### then spaceHeading 3
- then spaceBullet list
1. then spaceOrdered list
> then spaceBlockquote
``` then EnterCode block
--- then EnterHorizontal rule
/ (on empty line)Open inserter

These mirror Markdown shortcuts — handy if you're used to Markdown editors.

Document / publish​

ShortcutAction
Cmd/Ctrl + SSave draft (if focus is in the editor)
Cmd/Ctrl + Z / Cmd/Ctrl + Shift + ZUndo / redo

Block toolbar​

The block toolbar (top-right of each top-level block) is mouse-driven. Hover the block to see it, click the icons:

  • ⬆ — move block up
  • ⬇ — move block down
  • ⎘ — duplicate block
  • 🗑 — delete block

Tips for faster writing​

Paste-to-block conversion​

Pasting content from other apps converts intelligently:

  • Markdown (from another markdown editor, Obsidian, …) → renders as appropriate blocks
  • HTML (from a web page, Google Doc) → preserved structure where possible (paragraphs, headings, lists, tables — though tables aren't a separate block, they appear as a generic block)
  • Plain text → split on blank lines into paragraphs
  • Image URLs (just paste the URL) → image block with the URL pre-filled
  • YouTube / Vimeo / Twitter / Spotify URLs → auto-converted to the matching embed block

Bulk reorder via drag​

When dragging the block toolbar's grip handle (⠿), you can drop the block:

  • Above any block on the page
  • Below the last block on the page

This is faster than the up/down buttons for moving across the document.

Use Custom HTML for one-off layouts​

Don't fight the available blocks if your layout doesn't fit:

  • Need a 4-column layout but only need it in one post → use the Custom HTML block with raw HTML
  • Need an inline notice / callout that no block provides → Custom HTML with a <div class="my-callout"> and inline styles
  • Need a styled pull-quote different from blockquote → same approach

For repeated patterns across many posts, build a theme block (or ask the theme author to). For one-offs, Custom HTML is the right escape hatch.

Templates via duplicate​

There's no template system in v1, but you can:

  1. Write a "template post" with the structure you want — heading, intro paragraph, image placeholder, etc.
  2. Save as draft, never publish
  3. To create a new post from this template: duplicate the draft (via the post list's row menu — implemented via the bulk actions or an explicit Duplicate button if it exists in your version), edit the duplicate.

Future versions may add native templates. For now, the duplicate trick is the workaround.

Markdown export​

Each post's full content is in posts/{id}.contentMarkdown in Firestore. To export a post as Markdown:

  1. Open Firebase Console → Firestore Database → posts → <post id>
  2. Copy the contentMarkdown field's value

For bulk export, write a small Firestore query that iterates posts/ and writes each contentMarkdown to a file. The flexweg-import plugin's parsers (in src/mu-plugins/flexweg-import/parsers) show the format expected for re-import.

Tips for accessibility​

The editor itself is keyboard-friendly (Tab, Shift+Tab, Enter, arrow keys all work as expected). When editing, keep these in mind for the published page:

Always set image alt text​

The Image block's inspector has an Alt text field. Fill it for every image — except purely decorative ones (then set alt to empty string explicitly).

Screen readers and SEO bots both rely on alt text. Skipping it is the most common accessibility miss.

Use proper heading levels​

Don't skip heading levels — H1 → H2 → H3 → H2 is fine, but H1 → H4 is bad. Screen readers use the heading hierarchy to navigate. Themes typically render the post title as H1, so your body content should start with H2.

Don't rely on colour alone​

When using Custom HTML / inline styles, ensure information conveyed by colour is also available via text or icons. E.g. a red error message should also have an "Error:" prefix, not just be coloured.

Test with a screen reader periodically​

Mac: Cmd+F5 toggles VoiceOver. Windows: NVDA (free) or JAWS. Open a published post, listen as VoiceOver reads it. Common issues:

  • Heading levels jumping around
  • Images announced without alt
  • Links labelled "click here" instead of describing the destination

Tips for SEO​

  • Meaningful slug — readable, keyword-rich, hyphen-separated (the auto-slug from the title is usually fine; don't over-optimize)
  • SEO title + description in the Document sidebar — let them differ from the post title / excerpt for better search-result snippets
  • Hero image with alt text — used by OG tags too
  • Internal links between related posts — themes typically render only the body, so internal links from your text help both readers and crawlers find related content
  • No keyword stuffing — write for humans first

Continue​

  • Core blocks — every available block in detail
  • Theme blocks — theme-specific layout primitives
  • Posts — full post workflow including SEO sidebar