如何主持一个reveal.js 演示文稿

Posted 2023-03-04

【中文标题】如何主持一个reveal.js 演示文稿

【英文标题】：How to host a reveal.js presentation

【发布时间】：2015-09-18 17:55:36

【问题描述】：

我对所有这些 Web 开发都是新手（我只知道在本地做事）。我使用reveal.js 做了一个演示，我希望能够在网上看到它（例如在我的手机上）。我知道我应该主持它，但我真的不知道该怎么做。我尝试使用幻灯片（reveal.js 的在线编辑器）来完成，但我无法添加脚本和这类东西（我在演示文稿中使用了 highcharts）。如果您能给我一些建议，程序会很好。

【问题讨论】：

您是否考虑过使用 github pages（免费）之类的东西？ cynng.wordpress.com/2014/10/08/…有教程

你能给出一个答案我会验证它

【参考方案1】：

在 GitHub 上创建 new 存储库

我们称之为reveal_HelloWorld

在本地机器上克隆它：

git clone [e-mail]:yourusername/reveal_HelloWorld.git

在本地机器上克隆reveal.js：

git clone [e-mail]:hakimel/reveal.js.git

将reveal.js文件夹的内容移动到reveal_HelloWorld文件夹中

修改index.html文件

创建并切换到新分支

git checkout -b 'gh-pages'

推

git push

来自 GitHub 网站 repo 设置：

将“gh-pages”分支设置为默认分支 删除“主”分支

你已经完成了。

幻灯片发布在yourusername.github.io/reveal_HelloWorld。

来源：How to deploy Reveal.js presentations on Github

截屏：https://vimeo.com/241196662

信用：Angelo Basile

【讨论】：

如果您希望演示文稿被称为“index.html”以外的名称怎么办？

@HelloGoodbye 在我的index.html 我有一个<title>My Title</title> 部分。如果设置此项，标题将显示在浏览器选项卡中。如果这不是您的意思，而您只是想更改文件名 - 我很确定您可以这样做并正常导航到该文件（或从 index.html 重定向到该文件）

值得注意的是：这个答案的基本思想也适用于普通的网络服务器（不是由 github 提供的）。只需将reveal.js 文件夹和演示文件复制到服务器上即可。如果它在本地工作但不能在线工作，则可能是index.html 中的导入路径错误。例如。我在本地使用了/dist，但不得不在线使用相对路径，因为服务器根目录不再是文件所在的位置。

我在 github 中看到了显示中的演示文稿，这些演示文稿没有附带reveal.js 文件夹......我想知道如何？

可能通过CDN url加载reveal.js依赖。

【参考方案2】：

现在（2016 年 10 月）您不再需要创建特定的分支 (gh-pages)。创建您的仓库，然后选择“设置 -> 选项”。有一个“GitHub Pages”面板，您可以在其中设置要发布为网页的任何分支。

【参考方案3】：

Bruno's answer 作为一次性解决方案非常好。但是，如果用户想在 GitHub Pages 中托管多个演示文稿，那么他们需要每次都重复该过程。另一种方法是使用一个 GitHub 存储库进行多个演示。

步骤如下：

在 GitHub 中创建一个干净的存储库（没有 README 等），例如 presentations

在 Linux 中初始化 git repo 并链接到 GitHub，这将是

mkdir presentations
cd presentations
git init
git remote add origin [e-mail]:username/presentations.git

将reveal.js 添加为“远程”并拉取存储库

git remote add upstream [e-mail]:hakimel/reveal.js.git
git pull upstream master

为您的演示文稿创建一个空分支并清理工作目录

git checkout --orphan my-fancy-presentation
git reset --hard

将演示文稿复制到当前文件夹并提交您的更改

cp path/to/my_fancy_presentation.html .
git add .
git commit -m 'Initial commit'

切换到母带并在那里合并您的演示文稿

git checkout master
git merge my-fancy-presentation

将所有分支推送到 GitHub

git push --all origin

将 GitHub Pages 设置为分支 master 并在 https://username.github.io/presentations/my_fancy_presentation.html 上欣赏您的演示文稿

现在，只要您想添加另一个演示文稿，您只需重复步骤 4-7。此外，每当你想更新reveal.js，你可以简单地做git pull upstream master。

作为这种方法的示例，请参阅https://github.com/dougmvieira/presentations。

【讨论】：

我们需要添加所有带有示例和东西的reveal.js文件夹，还是只添加js文件夹？