Markdown+Pandoc→HTML幻灯片速成(2)

当然,你实际上可以使用任何喜欢的幻灯片框架(比如Google I/O HTML5 slide template),只要让Pandoc在渲染HTML时使用你指定的模板即可。

自定义HTML模板

首先,如果你知道如何写CSS去定义页面外观、如何写JavaScript让<div>元素动起来,或者已经有了一个不错的HTML幻灯片模板,你就可以直接让Pandoc把Markdown转换成纯HTML片段,用来嵌到自己的模板里:

$ pandoc slides.md -o slides.html

生成一个完整的HTML页面(包含<html>、<head>、<body>标签和各种元信息):

$ pandoc slides.md -o slides.html -s

DZSlides

当然,我们完全没有必要写自己的HTML模板,因为Pandoc已经提供了对多种幻灯片模板的支持。DZSlides便是其中最简单的一种,支持键盘操作→/←翻页,PgUp/PgDn,Home/End。

Pandoc生成的DZSlides幻灯片中自包含了所需CSS和JavaScript,无需依赖任何外部文件。

采用默认模板渲染一个独立的DZSlides幻灯片:

$ pandoc slides.md -o slides.html -t dzslides -s

若要对模板的样式进行调整,可以用--template指定自定义模板。默认的模板为default.dzslides,因此上述命令等效于:

$ pandoc slides.md -o slides.html -t dzslides --templatedefault.dzslides

可以从这里https://github.com/jgm/pandoc-templates找到原来的模板,自行修改后替换掉原先的模板。其余幻灯片框架与此相仿,以后不再赘述。

Slidy

HTML Slidy是W3C开发的一个极简主义HTML幻灯片模板,没有任何多余的样式,支持鼠标单击翻页,键盘操作→/←,PgUp/PgDn,Home/End。

采用默认模板渲染一个独立的Slidy幻灯片:

$ pandoc slides.md -o slides.html -t slidy -s

或指定自定义模板:

$ pandoc slides.md -o slides.html -t slidy --templatedefault.slidy

Pandoc生成的Slidy HTML依赖于和这两个外部文件。若不想依赖,可以将它们保存为本地文件。

S5

S5(Simple Standards-Based Slide Show System)是一个公有领域的HTML幻灯片规范。它支持鼠标单击翻页,键盘操作→/←,PgUp/PgDn,Home/End。

为了使用S5作为幻灯片框架,需要从这里下载S5。解压之后把S5文件夹中的ui/default拷贝到幻灯片所在路径下,改名为s5/default即可。

渲染幻灯片:

$ pandoc slides.md -o slides.html -t s5 -s

在S5的幻灯片界面上,鼠标移到右下角可以看到若干控制选项。

Slideous

Slideous是另一个有些年头的HTML幻灯片框架。支持鼠标单击翻页,键盘操作→/←,PgUp/PgDn,Home/End。

下载和这两个文件,放到本地目录slideous/下即可。

渲染幻灯片:

$ pandoc slides.md -o slides.html -t slideous -s

Slideous的界面上提供了比较丰富的控制选项。

reveal.js

reveal.js这东西已经红得不能更红了,最近开始火起来的WYSIWYG在线幻灯片工具slid.es也是基于它。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/17342.html