# Marp plug : markdown presentation rendering
**URL:** https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145
**Category:** Plugs and Libraries
**Created:** [September 5, 2025, 9:50am UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145 "2025-09-05T09:50:14Z")
**Posts on this page:** 13
**Page:** 1
### Author:  [@malys](https://community.silverbullet.md/u/malys)
#### Post date: [September 5, 2025, 9:50am UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/1 "2025-09-05T09:50:14Z")
I have created a basic [Marp](https://marp.app/) lua plugin to render md to slides.
This plugin adds a command “Marp Preview: Toggle” for rendering slides on side.
```lua
local LOG_ENABLE = false
local function debug_log(message)
if LOG_ENABLE then
js.log("[DEBUG] " .. message)
end
end
local is_panel_visible = false
local current_panel_id = "rhs"
-- Function to render Marp slides
local function render_marp_slides(mode)
debug_log(mode)
if (not is_panel_visible and mode) or (not mode and is_panel_visible) then
-- Get the current page content
local page_content = editor.getText()
debug_log(page_content)
local panel_html = ''
local contentBase64=encoding.base64Encode(page_content)
local marp_js = [[
const script = document.createElement("script");
script.type = "module";
script.textContent = `
import { Marp } from 'https://esm.sh/@marp-team/marp-core?bundle'
function b64DecodeUnicode(str) {
// Going backwards: from bytestream, to percent-encoding, to original string.
return decodeURIComponent(atob(str).split('').map(function(c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join(''));
}
const marp = new Marp();
const { html, css } = marp.render(b64DecodeUnicode("]]..contentBase64..[["));
render.innerHTML = \`\${html}\`;
`
document.documentElement.appendChild(script);
]]
debug_log(marp_js)
editor.showPanel(current_panel_id,1, panel_html, marp_js)
is_panel_visible = true
else
-- Hide the panel if it's visible
editor.hidePanel(current_panel_id)
is_panel_visible = false
end
end
-- Define the command
command.define({
name = "Marp Preview: Toggle",
description = "Toggle Marp slides render in a panel",
run = function(e)
render_marp_slides(true)
end
})
-- Listen for page modifications
event.listen({
name = "editor:pageModified",
run = function(e)
render_marp_slides(false)
end
})
```
It will be fine to support:
- export
- presentation mode
but it’s a difficult stuff …
Help wanted…
---
### Author:  [@malys](https://community.silverbullet.md/u/malys)
#### Post date: [October 17, 2025, 11:46am UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/2 "2025-10-17T11:46:11Z")
Currently, it’s supporting export to HTML file.
See [source code](https://github.com/malys/silverbullet-libraries/blob/main/src/MarpSlides.md)
---
### Author:  [@malys](https://community.silverbullet.md/u/malys)
#### Post date: [December 30, 2025, 5:59pm UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/3 "2025-12-30T17:59:42Z")
Dependency is installed automatically.
No more configuration is mandatory.
Update your code
---
### Author:  [@malys](https://community.silverbullet.md/u/malys)
#### Post date: [December 31, 2025, 9:54am UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/4 "2025-12-31T09:54:42Z")
Updated:
refresh on pageSaved instead of pageModified
remove “use default value” message
---
### Author:  [@bau](https://community.silverbullet.md/u/bau)
#### Post date: [December 31, 2025, 3:15pm UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/5 "2025-12-31T15:15:31Z")
Interesting !
I like the html export, however the content of the slides is truncated compared to the md pages. I don’t have time right now to explore Marp’s code. Also, if you had some advice, I would appreciate it!
Thanks !
---
### Author:  [@malys](https://community.silverbullet.md/u/malys)
#### Post date: [December 31, 2025, 5:28pm UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/6 "2025-12-31T17:28:43Z")
Export part is not the easy one.
Html template must be improved to be full featured. (Theme, customization…)
If you want to contribute to improve it, I will be happy to integrate it.
I have created a dynamic code import mechanism to manage html, Js templates.
Known issue:
Custom Html tags are not well managed by exported file
---
### Author:  [@bau](https://community.silverbullet.md/u/bau)
#### Post date: [December 31, 2025, 6:51pm UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/7 "2025-12-31T18:51:14Z")
ok. Sorry, i can’t contribute at that moment.
However, being able to generate “slides” seems like a nice feature. But, this may be beyond my skills (given the code already produced).
However, I am surprised by the size of the files generated. This probably comes from Marp. To be continued… Thanks for sharing !
---
### Author:  [@malys](https://community.silverbullet.md/u/malys)
#### Post date: [January 1, 2026, 1:11am UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/8 "2026-01-01T01:11:46Z")
Marp code embed in html offline file is heavyweight
---
### Author:  [@malys](https://community.silverbullet.md/u/malys)
#### Post date: [January 15, 2026, 12:38pm UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/9 "2026-01-15T12:38:10Z")
Improve code and library managemement
---
### Author:  [@malys](https://community.silverbullet.md/u/malys)
#### Post date: [February 4, 2026, 7:29pm UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/10 "2026-02-04T19:29:03Z")
update panel management @bau please, could you validate it?
---
### Author:  [@bau](https://community.silverbullet.md/u/bau)
#### Post date: [February 4, 2026, 10:30pm UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/11 "2026-02-04T22:30:56Z")
Same thing as:
> [@Mindmap with markmap.js](https://community.silverbullet.md/t/mindmap-with-markmap-js/1556/30):
>
> Bug is not corrected. Document Explorer or Task Explorer in panel rhs. When page saved: editor:pageSaved =\> update(false) =\> update=function(mode) [(not mode) = true] + [isVisible() = true if MindMap is in panel] ==\> false =\> hide =\> editor.hidePanel(current\_panel\_id) ==\> panel rhs hided I would like to make an additional comment: Wouldn't it be better to plug in event.listen only once MindMap is loaded in the panel? It is illogical to listen to this event continuously when MindMap will o…
---
### Author:  [@sara1](https://community.silverbullet.md/u/sara1)
#### Post date: [February 10, 2026, 10:46am UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/12 "2026-02-10T10:46:07Z")
The solution is to hook into the slide information of marp-core and maintain a live DOM state rather than rebuilding everything on each input if you want appropriate "presentation mode," such as full-screen slides with keyboard navigation. Your toggle is now functional, however it completely re-renders on `pageModified`, which eliminates fluid transitions but is OK for previews.
In order to provide users with a stand-alone HTML slide deck without requiring them to alter any editor internals, you may also put the `html` + `css` straight into a blob and initiate a download for export. All of the slide objects in `marp.slides` are really exposed by marp-core, allowing you to loop over them and add custom event listeners for a little "presentation controller" in JS.
Basically, divide your panel into _preview_ and _runtime_ modes. Runtime is the single-page DOM with keyboard/arrow handlers, and preview is your current toggle. Export + presentation mode will automatically be activated when you do that.
---
### Author:  [@malys](https://community.silverbullet.md/u/malys)
#### Post date: [February 10, 2026, 10:54am UTC](https://community.silverbullet.md/t/marp-plug-markdown-presentation-rendering/3145/13 "2026-02-10T10:54:34Z")
That sounds fantastic. If it's clear for you, please create PR, i will be happy to merge it. @sara1