This repository contains emacs lisp files providing HTML slideshow
export and publishing options for the new org-mode version 8 export
framework. The latest org-mode is available for checkout at
git://orgmode.org/org-mode.git, and includes these classes in the
contrib/lisp directory.
This will export/publish an org outline (or subtree) to a deck.js slideshow.
- Get a copy of deck.js from http://imakewebthings.com/deck.js/ or the github repositiory at https://github.com/imakewebthings/deck.js.
- Customize the variable
org-deck-directoriesto include the path to the directory created in (1) above. This is required to automatically identify available deck components (extensions, themes and transitions). - The exporter will create links to the themes, transitions and
extensions relative to the customization variable
org-deck-base-url.
The method org-deck-list-components, will list all the available
extensions, themes and transitions in the directories included in
org-deck-directories.
The following variables (in the customization group org-export-deck)
are available to customize the slideshow generation:
| option | in buffer option | publishing option | default |
|---|---|---|---|
| org-deck-base-url | DECK_BASE_URL | :deck-base-url | deck.js |
| org-deck-theme | DECK_THEME | :deck-theme | swiss.css |
| org-deck-transition | DECK_TRANSITION | :deck-transition | fade.css |
| org-deck-include-extensions | DECK_INCLUDE_EXTENSIONS | :deck-include-extensions | {all} |
| org-deck-exclude-extensions | DECK_EXCLUDE_EXTENSIONS | :deck-exclude-extensions | |
| org-deck-directories | ./deck.js |
deck.js creates “builds” through nested slides — any block level element with the class “slide” will be treated as a build. The exporter has two ways to accomplish this:
- Set the
:HTML_CONTAINER_CLASSproperty on a headline to a string includingslide. - To build a list, set the
:STEPproperty on the enclosing headline tot.
Standard org outlines are generated as XHTML 1.0 compatible documents. The “standard” for deck.js is HTML5. The latest version of the org exporter will allow you to modify the output as follows. By modifying the following options/variable:
| option | in buffer option | publishing option | value |
|---|---|---|---|
| org-html-container-element | HTML_CONTAINER | :html-container | section |
| org-html-doctype | HTML_DOCTYPE | :html-doctype | <!DOCTYPE html> |
| org-html-divs | ((preamble “header” “preamble”) (content “article” “content”) (postamble “footer” “postamble)) |
Note that org-html-divs cannot be set with a customization or
in-buffer option, but must be set with a BIND or local variable.
This will export/publish an org outline (or subtree) to an s5 slideshow.
- Get a copy of the s5 scripts from http://meyerweb.com/eric/tools/s5/.
- The exporter will create links to the javscript file and the
generic stylesheets in the default directory under
:s5-ui-url(org-s5-ui-url).
The following variables (in the customization group org-export-s5)
are available to customize the slideshow generation:
| customization variable | in buffer option | publishing option | default |
|---|---|---|---|
| org-s5-version | S5_VERSION | :s5-version | 1.2a2 |
| org-s5-theme-file | S5_THEME_FILE | :s5-theme-file | |
| org-s5-ui-url | S5_UI_URL | :s5-ui-url | ui |
| org-s5-default-view | S5_DEFAULT_VIEW | :s5-default-view | slideshow |
| org-s5-control-visibility | S5_CONTROL_VISIBILITY | :s5-control-visibility | hidden |
Note that if the :s5-theme-file is nil, it will use the file
default/screen.css relative to :s5-ui-url.
s5 creates “builds” by including the class incremental on a
headline or list (ul or ol). You can set the
HTML_CONTAINER_CLASS property on a headline to “incremental”, to
make it build. To make a list build, set the INCREMENTAL property
on the parent headline to t.
XOXO style slideshows (see S5 (XOXO Version)) can be generated
by setting the org-html-container-element to li. This can be done
in a number of ways as show in the table above under
Generating HTML5 compatible slideshows.
onepage is a deck.js exension which, logically, will display a deck.js slideshow as a single scrolling page. It can be toggled with the ‘o’ key, and will print with slides separated by rule instead of one slide per page.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent