Obnotion

Bring Notion-style block semantics to Obsidian. Obnotion wraps every Markdown block – including Dataview query results – with draggable handles so you can reorganise content fluidly while keeping the underlying Markdown tidy and portable.

Features

• Six-dot block handles for headings, paragraphs, lists, callouts, tables, embeds, and Dataview outputs.
• Drag-and-drop reordering that writes changes back to the Markdown source and immediately refreshes the preview so metadata stays accurate.
• Dataview aware blocks so query results can be positioned alongside native content without breaking the query definition.
• Drop indicators & drag ghosts inspired by Notion to make it obvious where the block will land.
• Notion-inspired styling via lightweight CSS that keeps the Obsidian theme intact.

Installation

1. Install dependencies and build the plugin bundle:

   npm install
   npm run build

2. Create a new folder inside your vault at <vault>/.obsidian/plugins/obnotion.
3. Copy the generated main.js, manifest.json, and styles.css files into that folder.
4. Reload Obsidian or use the Community Plugins → Reload plugins command, then enable Obnotion.

Usage

1. Open a note in Reading view or Live Preview.
2. Hover a block to reveal the six-dot handle on the left. Click and drag the handle to move the block above or below other content.
3. Drop the block once the blue indicator line shows the desired position. Obnotion updates the Markdown document so the change persists across views.
4. Dataview query results behave like any other block. Drag them to sit beside headings, lists, or other queries without altering the query syntax itself.
5. After a drop the preview refreshes automatically, so handles stay aligned even when Dataview re-renders.

Tips & Limitations

• Columns and canvas-style layouts are not yet supported; reordering is vertical only.
• Obnotion skips YAML frontmatter and document headers to avoid breaking metadata.
• After heavy Dataview rendering, Obnotion triggers a soft rerender automatically; you can still use View → Force reload if something looks out of sync.

Development

• npm run dev – build in watch mode.
• npm run build – create the production bundle (main.js).

The plugin ships as TypeScript bundled with esbuild. Modify the files in src/, run a build, and reload the plugin inside Obsidian to test changes.