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

Following the Podlove (JavaScript podcast player) docu on I try to use the Podlove player on a fresh Jekyll page:

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

I create this index.html file:

layout: home

<h1>Podlove Test</h1>

<script src=""></script>

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

Fire up Jekyll with bundle exec jekyll serve and browse the URL http://localhost:4000

The result: Screenshot of the browser

The JavaScript console shows this error-message: enter image description here

I follow the documentation but something is missing.

What do I have to do to get a player like displayed on ?

enter image description here


The vanilla embedding for the Webplayer is documented here:

In your current implementation the dom reference is not included in the html. Also the player only accepts a JSON configuration, currently you are passing in a plain audio file reference.

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

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