# sho > A tiny commonmark to HTML slideshow generator Latest version **1.0.3** (published 2016-03-03) · MIT license · 0 weekly downloads ## Install ```sh npm install sho pnpm add sho yarn add sho bun add sho ``` Provides the command `sho`. ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 1.0.3 | | Published | 2016-03-03 | | First published | 2015-07-31 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 6 | | Known vulnerabilities | 0 (+1 in 1 direct dependencies) | | Install scripts | no | | GitHub stars | 3 | | Author | csauve | | Maintainers | csauve | ## Links - npm: https://www.npmjs.com/package/sho - Repository: https://github.com/csauve/sho - Issues: https://github.com/csauve/sho/issues - npm.io page: https://npm.io/package/sho ## Dependencies (6) - [jade](https://npm.io/package/jade.md) 1.11.0 - [minimist](https://npm.io/package/minimist.md) ^1.1.2 - [remarkable](https://npm.io/package/remarkable.md) ^1.6.0 - [highlight.js](https://npm.io/package/highlight.js.md) ^8.7.0 - [jstransformer-scss](https://npm.io/package/jstransformer-scss.md) ^0.1.1 - [jstransformer-coffee-script](https://npm.io/package/jstransformer-coffee-script.md) ^0.1.0 ## Recent versions - 1.0.3 (latest) — 2016-03-03 - 1.0.2 — 2016-01-07 - 1.0.1 — 2016-01-07 - 1.0.0 — 2015-07-31 ## README # Sho A command-line tool for creating simple, self-contained HTML slideshows from Markdown documents. Use horizontal rules to separate slides: ```md # Title Page Header ## A subheader --- ### Slide 1 Header Bacon ipsum dolor amet [frankfurter brisket](www.example.com). * jowl ham hock hamburger * kielbasa shank short ribs Short loin `spare ribs` pork doner venison. ``` ![sho slides example 1](http://csauve.github.io/sho/examples/example-1.png) ## Features * Comes pre-styled so you can concentrate on content * [CommonMark](http://commonmark.org/) support with sensible defaults * Code highlighting with [highlight.js](https://highlightjs.org) * Arrow-key navigation * Slide progress bar * Can watch your source file for continuous editing * Generated HTML has no external dependencies * Text scales down for low resolution projectors and screens * Supports background images and colours * Included CSS for left/right floating images ## Getting Started Requires [Node.js](https://nodejs.org/download/) to install and run: ```sh $ npm install -g sho # generates slides.html if slides.md is present $ sho # generates presentation.html $ sho presentation.md # or specify both paths $ sho input.md output.html # you can also watch files $ sho presentation.md --watch ``` Just open the HTML file in your favourite browser and you're ready to go! ## Helpers CommonMark allows the [inclusion of HTML tags](http://spec.commonmark.org/0.21/#html-blocks) in your markdown. Sho's stylesheet includes some special classes and IDs for customizing your slides: ![sho slides example 1](http://csauve.github.io/sho/examples/example-2.png) ### Backgrounds To include a **background image in all slides**, add an `img` tag with `id="background"` anywhere in your Markdown document. The `src` should be relative to the destination HTML file: ```md # Title Page etc... ``` To include a **background image in one slide**, add an `img` tag with `class="background"` inside the slide you want affected. This background will override an all-pages background. ```md --- ### Slide 5 etc... --- ``` For a **solid colour background**, a styled span with `class="background"` or `id="background"` will behave the same way: ```md # All slides are purple by default --- ### Slide 1 This slide is green. ``` ### Formatting To **center-align** text, wrap it in a `class="center"` div. Don't forget to [pad inner Markdown with blank lines](http://spec.commonmark.org/0.21/#example-120): ```md
by [@Author](www.author.example.io)
``` You can **left/right float images** by adding the corresponding class to an `img` tag: ```md ``` A tag can be styled **inline-block** with the `inline` class: ```md

Example:

`code fragment` ``` ## API This module can programmatically transform Markdown files. Install the module non-globally: ```sh npm install sho ``` Then require and call Sho: ```js var sho = require("sho"); sho("~/docs/input.md", "~/docs/output.html"); ``` ## Alternatives Sho is pretty minimal and might not fit your needs. It is inspired by [Cleaver](https://github.com/jdan/cleaver) and [reveal.js](http://lab.hakim.se/reveal-js/#/). ## Contributing 1. Fork this repo 2. Clone your fork 3. Install dependencies with `npm install` 4. Hack away! 5. Use `npm link` to test your edited Sho on the command-line 6. Commit and push changes to your fork 7. Create a pull request describing the change License: MIT --- _Source: https://npm.io/package/sho · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._