CMS-like editing for Markdown with contenteditable and 100 lines of JS
Most static site generators use Markdown, but editing content usually means jumping between your browser and a text editor.
I wanted something smoother:
- Click any text on the page
- Edit it inline
- Automatically save back to the
.md
source file
I couldn’t find anything that did this cleanly. Most solutions were either too complex, required changing my whole stack, or didn’t preserve the same editing/preview flow.
So I built inlinecms — a minimal dev-only CMS using contenteditable
, Markdown, and ~100 lines of JavaScript.
Here’s how it works:
- Finds rendered Markdown blocks and makes them editable
- Tracks changes and updates the DOM for a smooth editing experience
- On blur, uses Turndown to convert HTML back to Markdown
- Sends the Markdown to a local dev server that writes it back to the source file
The code is rough and the system isn’t production-grade, but it’s:
- Easy to set up
- Just good enough to stay out of your way
PRs welcome!