{"id":13426785,"url":"https://github.com/webpro/reveal-md","last_synced_at":"2025-05-11T05:45:40.206Z","repository":{"id":9121091,"uuid":"10906757","full_name":"webpro/reveal-md","owner":"webpro","description":"reveal.js on steroids! Get beautiful reveal.js presentations from any Markdown file","archived":false,"fork":false,"pushed_at":"2025-03-28T22:12:50.000Z","size":1240,"stargazers_count":3826,"open_issues_count":1,"forks_count":420,"subscribers_count":40,"default_branch":"main","last_synced_at":"2025-05-11T05:45:31.944Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/webpro.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":".github/CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2013-06-24T11:49:43.000Z","updated_at":"2025-05-09T16:19:24.000Z","dependencies_parsed_at":"2023-01-13T15:10:58.036Z","dependency_job_id":"0d09fa18-07b4-4a8c-960b-27c60bcb0cb3","html_url":"https://github.com/webpro/reveal-md","commit_stats":{"total_commits":483,"total_committers":77,"mean_commits":"6.2727272727272725","dds":"0.25672877846790887","last_synced_commit":"653b71bceff7927b195cbfcf1054961179019c5b"},"previous_names":[],"tags_count":143,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpro%2Freveal-md","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpro%2Freveal-md/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpro%2Freveal-md/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpro%2Freveal-md/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/webpro","download_url":"https://codeload.github.com/webpro/reveal-md/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253523720,"owners_count":21921818,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-31T00:01:44.539Z","updated_at":"2025-05-11T05:45:40.184Z","avatar_url":"https://github.com/webpro.png","language":"JavaScript","readme":"# reveal-md\n\n[reveal.js][1] on steroids! Get beautiful reveal.js presentations from Markdown files.\n\n\u003e [!WARNING]\n\u003e\n\u003e reveal-md is no longer in active development.\n\nNo new features will be added. Pull requests for bug and documentation fixes will be considered. Occasional dependency\nupgrades and CVEs might happen.\n\nThanks for using reveal-md! Please consider these Markdown-based alternatives:\n\n- [MkSlides](https://martenbe.github.io/mkslides/) (successor to reveal-md)\n- [Slidev](https://sli.dev)\n\n---\n\n## Installation\n\n```console\nnpm install -g reveal-md\n```\n\n## Usage\n\n```console\nreveal-md slides.md\n```\n\nThis starts a local server and opens any Markdown file as a reveal.js presentation in the default browser.\n\n## Docker\n\nYou can use Docker to run this tool without needing Node.js installed on your machine. Run the public Docker image,\nproviding your markdown slides as a volume. A few examples:\n\n```console\ndocker run --rm -p 1948:1948 -v \u003cpath-to-your-slides\u003e:/slides webpronl/reveal-md:latest\ndocker run --rm -p 1948:1948 -v \u003cpath-to-your-slides\u003e:/slides webpronl/reveal-md:latest --help\n```\n\nThe service is now running at [http://localhost:1948][2].\n\nTo enable live reload in the container, port 35729 should be mapped as well:\n\n```console\ndocker run --rm -p 1948:1948 -p 35729:35729 -v \u003cpath-to-your-slides\u003e:/slides webpronl/reveal-md:latest /slides --watch\n```\n\n## Features\n\n- [Installation][3]\n- [Usage][4]\n- [Docker][6]\n- [Features][7]\n  - [Markdown][8]\n    - [Code Section][59]\n  - [Theme][9]\n  - [Highlight Theme][10]\n  - [Custom Slide Separators][11]\n  - [Custom Slide Attributes][12]\n  - [reveal-md Options][13]\n  - [Reveal.js Options][14]\n  - [Speaker Notes][15]\n  - [YAML Front matter][16]\n  - [Live Reload][17]\n  - [Custom Scripts][18]\n  - [Custom CSS][19]\n  - [Custom Favicon][20]\n  - [Pre-process Markdown][21]\n  - [Print to PDF][22]\n    - [1. Using Puppeteer][23]\n    - [2. Using Docker \u0026 DeckTape][24]\n  - [Static Website][25]\n  - [Disable Auto-open Browser][26]\n  - [Directory Listing][27]\n  - [Custom Port][28]\n  - [Custom Template][29]\n- [Scripts, Preprocessors and Plugins][30]\n- [Related Projects \u0026 Alternatives][31]\n- [Thank You][32]\n- [License][33]\n\n### Markdown\n\nThe Markdown feature of reveal.js is awesome, and has an easy (and configurable) syntax to separate slides. Use three\ndashes surrounded by two blank lines (`\\n---\\n`). Example:\n\n```markdown\n# Title\n\n- Point 1\n- Point 2\n\n---\n\n## Second slide\n\n\u003e Best quote ever.\n\nNote: speaker notes FTW!\n```\n\n#### Code section\n\n##### Syntax highlighting\n\n````markdown\n```js\nconsole.log('Hello world!');\n```\n````\n\n##### Highlight some lines\n\nYou can highlight one line, multiple lines or both.\n\n````markdown\n```python [1|3-6]\nn = 0\nwhile n \u003c 10:\n  if n % 2 == 0:\n    print(f\"{n} is even\")\n  else:\n    print(f\"{n} is odd\")\n  n += 1\n```\n````\n\n### Theme\n\nOverride theme (default: `black`):\n\n```console\nreveal-md slides.md --theme solarized\n```\n\nSee [available themes][34].\n\nOverride reveal theme with a custom one. In this example, the file is at `./theme/my-custom.css`:\n\n```console\nreveal-md slides.md --theme theme/my-custom.css\n```\n\nOverride reveal theme with a remote one (use rawgit.com because the url must allow cross-site access):\n\n```console\nreveal-md slides.md --theme https://rawgit.com/puzzle/pitc-revealjs-theme/master/theme/puzzle.css\n```\n\n### Highlight Theme\n\nOverride highlight theme (default: `zenburn`):\n\n```console\nreveal-md slides.md --highlight-theme github\n```\n\nSee [available themes][35].\n\n### Custom Slide Separators\n\nOverride slide separator (default: `\\n---\\n`):\n\n```console\nreveal-md slides.md --separator \"^\\n\\n\\n\"\n```\n\nOverride vertical/nested slide separator (default: `\\n----\\n`):\n\n```console\nreveal-md slides.md --vertical-separator \"^\\n\\n\"\n```\n\n### Custom Slide Attributes\n\nUse the [reveal.js slide attributes][36] functionality to add HTML attributes, e.g. custom backgrounds. Alternatively,\nadd an HTML `id` attribute to a specific slide and style it with CSS.\n\nExample: set the second slide to have a PNG image as background:\n\n```markdown\n# slide1\n\nThis slide has no background image.\n\n---\n\n\u003c!-- .slide: data-background=\"./image1.png\" --\u003e\n\n# slide2\n\nThis one does!\n```\n\n### reveal-md Options\n\nDefine options similar to command-line options in a `reveal-md.json` file that must be located at the root of the\nMarkdown files. They'll be picked up automatically. Example:\n\n```json\n{\n  \"separator\": \"^\\n\\n\\n\",\n  \"verticalSeparator\": \"^\\n\\n\"\n}\n```\n\n### Reveal.js Options\n\nDefine Reveal.js [options][37] in a `reveal.json` file at the project root. They'll be picked up automatically. Example:\n\n```json\n{\n  \"controls\": true,\n  \"progress\": true\n}\n```\n\n### Speaker Notes\n\nUse the [speaker notes][38] feature by using a line starting with `Note:`.\n\n### YAML Front matter\n\nSet Markdown (and reveal.js) options specific to a presentation with YAML front matter:\n\n```markdown\n---\ntitle: Foobar\nseparator: \u003c!--s--\u003e\nverticalSeparator: \u003c!--v--\u003e\ntheme: solarized\nrevealOptions:\n  transition: 'fade'\n---\n\nFoo\n\nNote: test note\n\n\u003c!--s--\u003e\n\n# Bar\n\n\u003c!--v--\u003e\n```\n\n### Live Reload\n\nUsing `-w` option changes to markdown files will trigger the browser to reload and thus display the changed presentation\nwithout the user having to reload the browser.\n\n```console\nreveal-md slides.md -w\n```\n\n### Custom Scripts\n\nInject custom scripts into the page:\n\n```console\nreveal-md slides.md --scripts script.js,another-script.js\n```\n\n- Don't use absolute file paths, files should be in adjacent or descending folders.\n- Absolute URL's are allowed.\n\n### Custom CSS\n\nInject custom CSS into the page:\n\n```console\nreveal-md slides.md --css style.css,another-style.css\n```\n\n- Don't use absolute file paths, files should be in adjacent or descending folders.\n- Absolute URL's are allowed.\n\n### Custom Favicon\n\nIf the directory with the markdown files contains a `favicon.ico` file, it will automatically be used as a favicon\ninstead of the [default favicon][39].\n\n### Pre-process Markdown\n\n`reveal-md` can be given a markdown preprocessor script via the `--preprocessor` (or `-P`) option. This can be useful to\nimplement custom tweaks on the document format without having to dive into the guts of the Markdown parser.\n\nFor example, to have headers automatically create new slides, one could have the script `preproc.js`:\n\n```javascript\n// headings trigger a new slide\n// headings with a caret (e.g., '##^ foo`) trigger a new vertical slide\nmodule.exports = (markdown, options) =\u003e {\n  return new Promise((resolve, reject) =\u003e {\n    return resolve(\n      markdown\n        .split('\\n')\n        .map((line, index) =\u003e {\n          if (!/^#/.test(line) || index === 0) return line;\n          const is_vertical = /#\\^/.test(line);\n          return (is_vertical ? '\\n----\\n\\n' : '\\n---\\n\\n') + line.replace('#^', '#');\n        })\n        .join('\\n')\n    );\n  });\n};\n```\n\nand use it like this\n\n```console\nreveal-md --preprocessor ./preproc.js slides.md\n```\n\n### Print to PDF\n\nThere are (at least) two options to export a deck to a PDF file.\n\n#### 1. Using Puppeteer\n\nCreate a (printable) PDF from the provided Markdown file:\n\n```console\nreveal-md slides.md --print slides.pdf\n```\n\nThe PDF is generated using Puppeteer. Alternatively, append `?view=print` to the url from the command-line or in the\nbrowser (make sure to remove the `#/` or `#/1` hash). Then print the slides using the browser's (not the native) print\ndialog. This seems to work in Chrome.\n\nBy default, paper size is set to match options in your [`reveal.json`][14] file, falling back to a default value 960x700\npixels. To override this behaviour, you can pass custom dimensions or format in a command line option `--print-size`:\n\n```console\nreveal-md slides.md --print slides.pdf --print-size 1024x768   # in pixels when no unit is given\nreveal-md slides.md --print slides.pdf --print-size 210x297mm  # valid units are: px, in, cm, mm\nreveal-md slides.md --print slides.pdf --print-size A4         # valid formats are: A0-6, Letter, Legal, Tabloid, Ledger\n```\n\nIn case of an error, please try the following:\n\n- Analyze debug output, e.g. `DEBUG=reveal-md reveal-md slides.md --print`\n- See `reveal-md help` for Puppeteer arguments (`puppeteer-launch-args` and `puppeteer-chromium-executable`)\n- Use Docker \u0026 DeckTape:\n\n#### 2. Using Docker \u0026 DeckTape\n\nThe first method of printing does not currently work when running reveal-md in a Docker container, so it is recommended\nthat you print with [DeckTape][40] instead. Using DeckTape may also resolve issues with the built-in printing method’s\noutput.\n\nTo create a PDF of a presentation using reveal-md running on your localhost using the DeckTape Docker image, use the\nfollowing command:\n\n```console\ndocker run --rm -t --net=host -v $OUTPUT_DIR:/slides astefanutti/decktape $URL $OUTPUT_FILENAME\n```\n\nReplace these variables:\n\n- `$OUTPUT_DIR` is the folder you want the PDF to be saved to.\n- `$OUTPUT_FILENAME` is the name of the PDF.\n- `$URL` is where the presentation can be accessed in your browser (without the `?view=print` suffix). If you are not\n  running reveal-md in Docker, you will need to replace `localhost` with the IP address of your computer.\n\nFor a full list of export options, please see the the [DeckTape github][40], or run the Docker container with the `-h`\nflag.\n\n### Static Website\n\nThis will export the provided Markdown file into a stand-alone HTML website including scripts and stylesheets. The files\nare saved to the directory passed to the `--static` parameter (default: `./_static`):\n\n```console\nreveal-md slides.md --static _site\n```\n\nThis should copy images along with the slides. Use `--static-dirs` to copy directories with other static assets to the\ntarget directory. Use a comma-separated list to copy multiple directories.\n\n```console\nreveal-md slides.md --static --static-dirs=assets\n```\n\nProviding a directory will result in a stand-alone overview page with links to the presentations (similar to a\n[directory listing][27]):\n\n```console\nreveal-md dir/ --static\n```\n\nBy default, all `*.md` files in all subdirectories are included in the generated website. Provide a custom [glob\npattern][41] using `--glob` to generate slides only from matching files:\n\n```console\nreveal-md dir/ --static --glob '**/slides.md'\n```\n\nAdditional `--absolute-url` and `--featured-slide` parameters could be used to generate [OpenGraph][42] metadata\nenabling more attractive rendering for slide deck links when shared in some social sites.\n\n```console\nreveal-md slides.md --static _site --absolute-url https://example.com --featured-slide 5\n```\n\n### Disable Auto-open Browser\n\nTo disable auto-opening the browser:\n\n```console\nreveal-md slides.md --disable-auto-open\n```\n\n### Directory Listing\n\nShow (recursive) directory listing of Markdown files:\n\n```console\nreveal-md dir/\n```\n\nShow directory listing of Markdown files in current directory:\n\n```console\nreveal-md\n```\n\n### Custom Port\n\nOverride port (default: `1948`):\n\n```console\nreveal-md slides.md --port 8888\n```\n\n### Custom Template\n\nOverride reveal.js HTML template ([default template][43]):\n\n```console\nreveal-md slides.md --template my-reveal-template.html\n```\n\nOverride listing HTML template ([default template][44]):\n\n```console\nreveal-md slides.md --listing-template my-listing-template.html\n```\n\n## Scripts, Preprocessors and Plugins\n\n- [reveal-md-scripts][45]\n- [How to add reveal.js plugins][58]\n\n## Related Projects \u0026 Alternatives\n\n- [Slides][46] is a place for creating, presenting and sharing slide decks.\n- [Sandstorm Hacker Slides][47] is a simple app that combines Ace Editor and RevealJS.\n- [Tools][48] in the Plugins, Tools and Hardware section of Reveal.js.\n- [Org-Reveal][49] exports Org-mode contents to Reveal.js HTML presentation.\n- [DeckTape][40] is a high-quality PDF exporter for HTML5 presentation frameworks.\n- [GitPitch][50] generates slideshows from PITCHME.md found in hosted Git repos.\n\n## Articles About reveal-md\n\n- [great slides with reveal markdown][51]\n- [Create your own auto-publishing slides with reveal-md and Travis CI][52]\n- [Beautiful presentations from markdown — who knew it could be so easy?][53]\n- [Using reveal-md to create technical presentations][54]\n- [Use reveal-md to generate multiple slides and host them on GitHub Page][55]\n\n## Thank You\n\nMany thanks to all [contributors][56]!\n\n## License\n\n[MIT][57]\n\n[1]: https://revealjs.com\n[2]: http://localhost:1948\n[3]: #installation\n[4]: #usage\n[5]: #revealjs-v4\n[6]: #docker\n[7]: #features\n[8]: #markdown\n[9]: #theme\n[10]: #highlight-theme\n[11]: #custom-slide-separators\n[12]: #custom-slide-attributes\n[13]: #reveal-md-options\n[14]: #revealjs-options\n[15]: #speaker-notes\n[16]: #yaml-front-matter\n[17]: #live-reload\n[18]: #custom-scripts\n[19]: #custom-css\n[20]: #custom-favicon\n[21]: #pre-process-markdown\n[22]: #print-to-pdf\n[23]: #1-using-puppeteer\n[24]: #2-using-docker--decktape\n[25]: #static-website\n[26]: #disable-auto-open-browser\n[27]: #directory-listing\n[28]: #custom-port\n[29]: #custom-template\n[30]: #scripts-preprocessors-and-plugins\n[31]: #related-projects--alternatives\n[32]: #thank-you\n[33]: #license\n[34]: https://github.com/hakimel/reveal.js/tree/master/css/theme/source\n[35]: https://github.com/isagalaev/highlight.js/tree/master/src/styles\n[36]: https://revealjs.com/markdown/#slide-attributes\n[37]: https://revealjs.com/config/\n[38]: https://revealjs.com/speaker-view/\n[39]: lib/favicon.ico\n[40]: https://github.com/astefanutti/decktape\n[41]: https://github.com/isaacs/node-glob\n[42]: http://ogp.me\n[43]: https://github.com/webpro/reveal-md/blob/master/lib/template/reveal.html\n[44]: https://github.com/webpro/reveal-md/blob/master/lib/template/listing.html\n[45]: https://github.com/amra/reveal-md-scripts\n[46]: https://slides.com/\n[47]: https://github.com/jacksingleton/hacker-slides\n[48]: https://github.com/hakimel/reveal.js/wiki/Plugins,-Tools-and-Hardware#tools\n[49]: https://github.com/yjwen/org-reveal\n[50]: https://github.com/gitpitch/gitpitch\n[51]: https://csinva.io/blog/misc/19_reveal_md_enhanced/readme.html\n[52]: https://ericmjl.github.io/blog/2020/1/18/create-your-own-auto-publishing-slides-with-reveal-md-and-travis-ci/\n[53]: https://mandieq.medium.com/beautiful-presentations-from-markdown-who-knew-it-could-be-so-easy-d279aa7f787a\n[54]: https://lacourt.dev/2019/03/12\n[55]: https://hanklu.tw/blog/use-reveal-md-to-generate-multiple-slides-and-host-them-on-github-page/\n[56]: https://github.com/webpro/reveal-md/graphs/contributors\n[57]: http://webpro.mit-license.org\n[58]: https://github.com/webpro/reveal-md/issues/102#issuecomment-692494366\n[59]: #code-section\n","funding_links":[],"categories":["JavaScript","Utilities","Presentations","运营","Markdown"],"sub_categories":["How to Embed","内容与文档"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebpro%2Freveal-md","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwebpro%2Freveal-md","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebpro%2Freveal-md/lists"}