Tools

org 导出 PPT/slide

用 org-reveal 或者 org-re-reveal 都可以 不过org-re-reveal forked 自 org-reveal
显得更强大一些, 项目里也很多 test-case 模板可以参考, 文档虽然抄自org-reveal
但是也加了一些更细的东西 建议直接使用 org-re-reveal

Doom Emacs 安装 org-reveal

package.el

1

(package! org-reveal)

config.el

1
2
3
4
5
6
7
8

(use-package! ox-reveal
  :after iedit
  :config
  (setq org-reveal-hlevel 1)
  ;; 使用 reveal.js 来渲染样式  不然就是一张 html 网页 看不到幻灯片效果
  ;; 也可以使用本地reveal.js  但注意要把org-reveal-root 指向整个revealjs 目录的路径 而不是单个 reveal.js 文件
  ;; 因为在浏览器中渲染的话需要css 等文件都是在 revealjs 文件夹内的
  (setq org-reveal-root "https://cdn.jsdelivr.net/npm/reveal.js"))

doom sync

Doom Emacs 安装 org-re-reveal

init.el

1

(org +pandoc +present)

打开org 的 present 特性, 这样在 doom sync 的时候就会去跑 present 这个文件
里面有关于 org-re-reveal 的设置

doom sync

简单使用

基本设置

1
2
3
4
5
6
7
8
9

#+REVEAL_INIT_OPTIONS: slideNumber:true
#+REVEAL_REVEAL_JS_VERSION: 4
# #+REVEAL_THEME: serif
#+OPTIONS: toc:1 timestamp:t num:t reveal_width:1400 reveal_height:1000 
#+REVEAL_PLUGINS: (multiplex notes search zoom)
#+REVEAL_TRANS: slide
# #+REVEAL_TOC_SLIDE_TITLE: Agenda
#+TITLE: Airmate-S30239 Review
#+AUTHOR: 王传强

其中
#+REVEAL_INIT_OPTIONS: slideNumber:true 在右下角显示页码
#+OPTIONS: toc:1 timestamp:t num:t reveal_width:1400 reveal_height:1000
带时间戳 目录只包含一级标题 标题前加数字 PPT 大小设置为1400*1000
#+REVEAL_TRANS: slide 切换效果为滑过
效果如下:

设置图片大小

#+ATTR_HTML: :width 100% :align center

强制分页

#+REVEAL: split
或者
#+REVEAL: split : t

设置切换幻灯片的效果

1

#+REVEAL_TRANS: slide

none

无

fade

淡入淡出

slide

滑过

convex

类似魔方旋转的效果

concave

类似魔方旋转的效果, 但是比 convex 舒服一些

zoom

这个效果不怎么好 容易眼花

如果嫌标题的字体太大了

可以把标题打成三级 四级标题 这样出来的效果自然就小了

生成html

org-reveal

C-c C-e R R/B

org-re-reveal

C-c C-e v v/b

效果

浏览器打开生成的html 和简单操作

按 ? 可以调出快捷键菜单

f 进入全屏

ESC 退出全屏

o 或者 ESC 开关预览

s 进入导航

方向键或者鼠标左键点击来切换幻灯片

发布给别人

正常做法

  1. 需要把 org-re-reveal-root 设成相对路径的 “./revealjs”
  2. C-c C-e v v/b
  3. 把 img revealjs 和 html 打包

使用自己写的函数一个函数搞定

使用这个函数的前提已经按照 Doom Emacs 安装 org-re-reveal 启用了 org-re-reveal 并且没有修改过 org-re-reveal-root 的值

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

(defun my/tar-reveal-html ()
  " 本函数把org-re-reveal 生成的html 和 依赖的img 打包到 reveal-dir 下"
  (interactive)
  (let ((html-file (buffer-name)) html-content  all-img-path img-path
        (img-prefix "img src=") (reveal-dir "./reveal-dir/") img-dir
        reveal-root
        dst-html-file
        )
    (setq img-dir (concat reveal-dir "img/"))
    (setq reveal-root (concat reveal-dir (file-name-as-directory (file-name-nondirectory  (directory-file-name org-re-reveal-root)))))
    (if (not (file-exists-p img-dir))
        (mkdir img-dir t))
    (if (s-ends-with-p ".org" (buffer-name))
        (setq html-file (concat (file-name-base (buffer-name)) ".html")))
    ;; (message "html-file : %s" html-file)
    ;; copy html file to reveal dir
    (setq dst-html-file (concat reveal-dir (file-name-nondirectory html-file)))
    (copy-file html-file dst-html-file t)  ;; 如果存在 则覆盖
    ;; copy img to img-dir
    (setq html-content (f-read-text html-file))
    ;; <p><img src="img/_20220531_112904screenshot.png" alt="_20220531_112904screenshot.png" width="100%" align="center" />
    (setq all-img-path (s-match-strings-all (concat img-prefix "\".*?\"")  html-content))
    (dolist (each-file all-img-path)
      (setq img-path (substring (car each-file) (+ (length img-prefix) 1) -1))
      (copy-file (expand-file-name img-path) img-dir t))
    (if (file-exists-p reveal-root)
        (delete-directory reveal-root t))
    (copy-directory org-re-reveal-root reveal-dir)
    ;; 替换 html 文件里的依赖
    (find-file dst-html-file)
    (replace-regexp org-re-reveal-root (concat "./" (file-name-as-directory (file-name-nondirectory (directory-file-name org-re-reveal-root))))
                    nil (point-min) (point-max))
    (save-buffer)
    (kill-buffer)
    (message "all done!")
    ))