如何使用Emacs Org模式和Reveal.js创建幻灯片

在过去的一年左右的时间里，我开始大量重新使用Emacs和Org模式包（用于记录笔记，组织自己等等）。 我也开始将脚趾浸入水中，进行简短的演讲。 我一直在想如何将Emacs与演讲结合起来。

演示与文本编辑器有什么关系？ 实际上，还可以！

像许多演讲者一样，我在演讲时会使用幻灯片。 我的是最小的-每张幻灯片只需要几个单词或一张图像。 我使用Reveal.js来创建这些幻灯片，这也使我有机会稍微拥抱一下自己的内心怪人并手工编写一些HTML。

那么，Emacs和Reveal.js的融合在哪里发生？ 这是以Emacs软件包Org-Reveal的形式出现的。 让我们看一下如何使用Emacs，Org-Reveal和Reveal.js创建简单的演示幻灯片。

入门

我假设您在计算机上安装了Emacs和Org模式。 如果不是，请为您的操作系统获取Emacs ，然后下载组织模式的最新版本。 组织模式网站还介绍了如何安装。

您还需要安装Org-Reveal ，并获取Reveal.js存档的副本。 您可以在任何喜欢的地方解压缩Reveal.js。 我将其放在文件夹~/slides/reveal.js ，在其中存储我的幻灯片。

完成所有这些操作后，将以下内容添加到您的.emacs文件中，以将Org-Reveal集成到Emacs中：

   
   
     
     
     
     

    
    
      
      
      
      

       
       
       
       
     
     ;; Reveal.js + Org mode
     
     
       
       
       
       

(require 'ox-reveal)
     
     
       
       
       
       

(setq Org-Reveal-root "file:///path-to-reveal.js")
     
     
       
       
       
       

(setq Org-Reveal-title-slide nil)
    
    
      
      
      
      
   
   
     
     
     
     

在上面的path-to-reveal.js中，您可以将Reveal.js归档文件解压缩path-to-reveal.js reveal.js。 在我的设置中，该条目为file:///home/scott/slides/reveal.js 。

那有点工作。 幸运的是，您只需要执行一次。 现在，您准备好了。

创建幻灯片和幻灯片

启动Emacs并创建一个新文件。 随便命名文件，但要确保文件扩展名为.org 。 该扩展名告诉Emacs这是一个组织模式文件。 每当您打开带有该扩展名的文件时，Emacs都会应用正确的语法突出显示并使Org菜单在菜单栏上可用。

将以下信息添加到文件的顶部：

   
   
     
     
     
     

    
    
      
      
      
      

       
       
       
       
     
     #+OPTIONS: num:nil toc:nil
     
     
       
       
       
       

#+REVEAL_TRANS: None/Fade/Slide/Convex/Concave/Zoom
     
     
       
       
       
       

#+REVEAL_THEME: Black/White/League/Sky/Beige/Simple/Serif/Blood/Night/Moon/Solarized
     
     
       
       
       
       

#+Title: Title of Your Talk
     
     
       
       
       
       

#+Author: Your Name
     
     
       
       
       
       

#+Email: Your Email Address or Twitter Handle
    
    
      
      
      
      
   
   
     
     
     
     

该块就像幻灯片的元数据。 让我们看一下该块中的前三个项目：

• num:nil和toc:nil在生成幻灯片时取消标题编号和目录表的创建
• 当您在幻灯片之间移动时， #REVEAL_TRANS控制过渡效果 。 我通常选择“无”，但随时可以尝试
• #REVEAL_THEME控制幻灯片的外观 。 我通常会坚持使用黑色或白色，但请再次尝试

在元数据块之后添加一个标题，方法是输入一个星号，后跟一个空格，然后是一些文本。 这将是标题幻灯片。 （给标题打个好！）

如果要在标题下添加姓名，请按Enter。 Emacs在标题下方添加了一个空白的缩进空间。 在该空格内输入您的名字和其他信息。

通过向文件添加标题（带有星号且前面带有空格的文本，还记得吗？）来向幻灯片添加新幻灯片。 很简单，不是吗？

这是Emacs中的一个简单演示文稿：

这是网络浏览器中的外观：

如果您要创建仅带有文字的幻灯片，则效果很好。 带有图像的幻灯片呢？

添加图像

我在幻灯片中使用的图像与使用文本一样多。 这些图像并不会使我的观众眼花or乱。 它们提供了一些视觉环境，并为我提供了视觉提示。 它并非适用于每张幻灯片或每一次演讲，但使用正确的图像可能会有效。 这可能很有趣。

要将图像添加到幻灯片中，请首先在保存幻灯片文件的文件夹中为图像创建一个子文件夹。 我通常将其称为文件夹images ，虽然没有什么想象力，但可以做到。 将您要在幻灯片中使用的图像拖放到该文件夹​​中。

接下来，在幻灯片文件中创建一个空标题-一个带星号且没有文本的标题。 按Enter在该标题下添加一个空格，然后将该文本块添加到该空格：

   
   
     
     
     
     

    
    
      
      
      
      

       
       
       
       
     
     :PROPERTIES:
     
     
       
       
       
       

:reveal_background: images/name-of-image
     
     
       
       
       
       

:reveal_background_size: width-of-image
     
     
       
       
       
       

:reveal_background_trans: slide
     
     
       
       
       
       

:END:
    
    
      
      
      
      
   
   
     
     
     
     

用图像的文件名（包括扩展名）替换name-of-image 。 将width-of-image替换width-of-image以像素为单位的图像宽度，例如640px 。 确保图像不要太宽，否则图像会超出屏幕边缘。 我尝试将幻灯片中的图像保留在1000像素以下。

添加演讲者备注

Reveal.js具有一个漂亮的功能，可让您在提供幻灯片的计算机上显示演讲者的备忘。 只有您看到这些笔记，并且仅在您按键盘上的s键时才会出现。

要将注释添加到幻灯片，请按Enter键在标题下创建一个空白区域，然后将此文本块添加到该空间：

   
   
     
     
     
     

    
    
      
      
      
      

       
       
       
       
     
     #+BEGIN_NOTES
     
     
       
       
       
       

Your note
     
     
       
       
       
       

#+END_NOTES
    
    
      
      
      
      
   
   
     
     
     
     

更换Your note与提醒或提示您有关该幻灯片的要点文本。

生成幻灯片

您已经制作了演示文稿中的每张幻灯片。 怎么办？ 您将要生成幻灯片组HTML版本。 为此，请按键盘上的Ctrl + c Ctrl + e 。 这将打开组织模式导出缓冲区。 接下来，键入R + R。 Emacs在保存幻灯片文件的文件夹中创建一个HTML文件。

在网络浏览器中打开该HTML文件。 您可以通过按键盘上的箭头键在幻灯片中移动。

最后的想法

Reveal.js和Org-Reveal可以做很多事情。 我没有进行太多深入的探讨，因为我希望幻灯片保持简单。

将Emacs和Org模式与Reveal.js一起使用来创建演示幻灯片似乎有点过分。 而且，老实说，我不会在所有幻灯片演示中都使用该组合。 但是，当我需要快速组合滑梯时，它们做得很好。

而且，由于我的关心，我创建了一个简单的Org-Reveal幻灯片模板 ，您可以下载并使用或修改您的心脏内容。 别客气。

翻译自: https://opensource.com/article/18/2/how-create-slides-emacs-org-mode-and-revealjs