Integrate Markdown Viewer
Integrate our Markdown editor into any website — one line of HTML
The same live-preview editor you see on this site — drop it into your docs, blog, course, support article, or internal wiki. No signup, no API key, no customization to maintain. Just paste the shortcode.
The shortcode
Paste this anywhere HTML is allowed
One snippet. Drop it into a blog post, a docs page, an MDX file, a CMS HTML block, a Notion embed — wherever your content lives. You get the same editor as ours.
<iframe src="https://trymarkdownviewer.com/integrate/editor" width="100%" height="640" loading="lazy" title="Markdown editor by Markdown Viewer" style="border:1px solid #e5e7eb;border-radius:12px;width:100%;" ></iframe>
Tip: adjust height to fit your layout. Leave the rest as-is.
One line of HTML
Copy, paste, ship — no SDK install, no build step.
Same as our editor
Live preview, GFM, autosave, format, exports — nothing trimmed.
Private by default
Content stays in the iframe. We never log or store what your users type.
Light / dark / auto
Matches your visitor's OS theme out of the box.
Use cases
What teams use the integration for
Documentation sandboxes
Drop a live Markdown editor on every syntax explanation. Readers learn 3× faster when they can try it inline.
Course platforms
Integrate under any lesson teaching technical writing. Students practice without leaving the page.
Tech blogs
Demos beat screenshots. Replace static code blocks with a hands-on editor for posts about Markdown, GitHub, or developer tooling.
Support articles
Let authors paste a 'try this' example inline so readers immediately see what the answer looks like.
Internal wikis
A fast Markdown composer in a form, comment box, or status update — no plugin to install.
Developer portals
API references with a try-it editor for request bodies, schema examples, or runnable Markdown snippets.
Why integrate a Markdown editor?
Markdown is the lingua franca of technical writing — READMEs, blog posts, documentation, internal wikis, support tickets, knowledge bases. But getting a great editor into your own product usually means installing an open-source library, theming it, and shipping the bundle to every visitor. That's days of work for a feature you can ship in a minute.
This integration solves it with one line of HTML.
Same editor — drop it in
You get exactly what you see at our editor — no simplified variant, no feature gating, no different code path:
- Live preview of GitHub Flavored Markdown with tables, task lists, fenced code, and syntax highlighting
- Autosave to localStorage so users don't lose work to an accidental tab close
- Format, find/replace, share, export to HTML / PDF / Markdown
- Light / dark / auto theme — picks up the user's OS preference
- Mobile-friendly — same responsive behavior as the main app
The only addition is a small non-removable "Powered by Markdown Viewer" badge in the bottom-right corner. Clicking it opens our editor in a new top-level window so visitors who like the integration can find the full experience.
How it stacks up
| Approach | Setup time | Live preview | Exports | Maintenance |
|---|---|---|---|---|
| Roll your own (CodeMirror + remark) | 1–3 days | Yes | Custom | Ongoing |
| Hosted SaaS Markdown editor | Hours | Yes | Varies | Vendor-managed |
| This integration | Under a minute | Yes | HTML / PDF / Markdown | None — we host it |
| Static "code block" component | Minutes | No | No | None |
Who this is for
- Documentation teams that want a sandbox under every Markdown explanation — readers learn faster when they can try syntax in place.
- Course platforms teaching technical writing or developer onboarding. Integrate under any lesson; students practice without leaving the page.
- Tech blogs and indie hackers writing about Markdown, GitHub, or developer tooling. A live demo always beats a screenshot.
- Support and customer-success teams that want help-article authors to paste a "try this" example inline.
- Internal wikis and intranets that need a quick Markdown composer in a form, comment box, or status update.
Performance
- Lazy-loaded iframe (
loading="lazy"in the shortcode) — never blocks the host page's render. - Code-split preview engine — the heavy markdown rendering library only loads when the preview pane is visible.
- No third-party trackers inside the iframe — no analytics, no font CDN, no extras.
- Edge-cached static assets — the integration loads from a CDN globally.
Privacy & security
The integration runs entirely in your visitor's browser:
- Content typed into the editor never leaves the iframe.
- We do not log iframe renders or user input on the server.
- The same security headers (HSTS, X-Content-Type-Options, Referrer-Policy) that protect our main app protect the integration.
- The iframe inherits a sandbox boundary from the browser — strong isolation from your page's DOM and cookies.
Plain answers to common worries
"Will this break my page's layout?" No. The iframe stays inside the dimensions you give it. The editor inside is fully responsive and won't push your layout around.
"What if your service goes down?" The iframe falls back gracefully — visitors see the iframe's "can't connect" placeholder while the rest of your page renders normally.
"Can I self-host this?" The project is open source under the MIT license — clone the repo, deploy on your own domain, and point your integration URLs there.
Ready to integrate?
Copy the shortcode at the top of the page, paste it into your site, ship it. Open an issue on GitHub if you hit any rough edges.
Frequently asked questions
- The exact same editor you see at /editor — live preview, GitHub Flavored Markdown, syntax-highlighted fenced code, tables, task lists, autosave, exports (HTML / PDF / Markdown), find-and-replace, format-on-save, dark/light theme. Nothing is stripped or scaled down.
- Copy the shortcode above and paste it anywhere HTML is allowed — a blog post, a documentation page, an MDX file, a Notion-style embed block, a custom-HTML widget in your CMS. The editor loads in roughly a second and starts working immediately.
- Yes. The integration is free for any site — personal, commercial, internal. The small "Powered by Markdown Viewer" badge in the bottom-right corner stays on; it's how attribution works and how we keep the integration free. The badge cannot be hidden via URL parameters.
- No — and that's intentional. One shortcode, one experience, zero version drift across sites that integrate it. You always get the latest editor we ship at /editor. If you need deep customization (custom themes, save destinations, no-badge), that's an enterprise conversation — reach out via GitHub.
- Yes. Everything happens inside the iframe — typing, preview rendering, autosave to localStorage. No content is sent to our servers. We never see what your users type.
- WordPress (Custom HTML block), Ghost, Hugo, Astro, Next.js MDX, Docusaurus, Hashnode, dev.to embeds, Substack code blocks, Notion (Embed block), Confluence (HTML macro) — yes. If your platform strips raw <iframe> tags, you'll need a plugin or custom-HTML block.
- Some sites set a strict Content Security Policy that blocks all iframes by default. If the editor doesn't appear, check your CSP for a `frame-src` directive and add `https://trymarkdownviewer.com` to the allowed list.
- First load is roughly the same as a single hi-res image. The iframe defaults to `loading="lazy"` in our shortcode, so it only loads when scrolled into view — zero impact on the host page's initial render.
- The integration always reflects whatever we ship on /editor. We don't ship breaking visual changes without warning, but new features (e.g., a new toolbar button) will appear automatically — your visitors get the upgrade for free.
- They work the same as in our main editor. Share generates a self-contained URL; downloads write a file to the user's device; PDF print opens the browser print dialog. All of this happens inside the iframe and won't affect your host page.
What does the integration include?
How do I integrate it?
Is it really free?
Can I customize the editor?
Is content typed into the editor private?
Will it work in Notion, Confluence, WordPress, or my CMS?
Why might my site block the integration?
How heavy is the iframe?
Will the integration change without warning?
What about the share or export buttons inside the editor?
One line of HTML. The full editor anywhere.
Free for any site. Same editor as ours. No signup, no API key.