如何在普通的 Jekyll 页面上使用 Podlove 客户端？

Question

关注 https://docs.podlove.org/podlove-web-player/installation.html 上的 Podlove（JavaScript 播客播放器）文档，我尝试在新的 Jekyll 页面上使用 Podlove 播放器：

jekyll new my-awesome-site
cd my-awesome-site
mkdir -p assets/podcasts
cp /tmp/audio-file.mp3 assets/podcasts/audio-file.mp3
rm index.md

我创建了这个 index.html 文件：

---
layout: home
---

<h1>Podlove Test</h1>

<script src="https://cdn.podlove.org/web-player/embed.js"></script>

<script>
  podlovePlayer('#example', '/assets/podcasts/audio-file.mp3');
</script>

使用 bundle exec jekyll serve 启动 Jekyll 并浏览 URL http://localhost:4000

结果：

JavaScript 控制台显示此错误消息：

我按照文档进行操作，但缺少某些内容。

我需要做什么才能在 https://podlove.org/podlove-web-player/ 上显示喜欢的播放器？

Answer 1

网络播放器的香草嵌入记录在此处：https://docs.podlove.org/podlove-web-player/embedding.html

在您当前的实现中，dom 引用未包含在 html 中。此外，播放器只接受 JSON configuration，目前您正在传递纯音频文件参考。

<div id="example"></div>

<script src="embed.js"></script>
<script>
  podlovePlayer('#example', './fixtures/example.json');
</script>

如何在普通的 Jekyll 页面上使用 Podlove 客户端？

How to use the Podlove client on a vanilla Jekyll page?

javascript

jekyll