Get the Latest Player Release
Having bower installed on your system, run
to get the player package.
You will find a lot of examples in
Some of them are explained here in greater detail.
Integrate the web player into a website
Example directory structure
As you can see there are 2 HTML pages. The page.html contains your content and placeholders that the podlove-web-moderator will replace with iframes containing the player.html. You could include the player directly into your page but would miss out on later features like embedding your player on third party pages. As of now it is highly recommended to use this two page setup to circumvent certain problems like overriding CSS rules.
This file will be the host for the iframe of the embedded player (player.html).
Add an element where the player should appear.
You can use any HTML element but the audio tag also serves as the non-js fallback.
Add the moderator script to the head of your html file
Now, tell the moderator which elements to replace with embedded players.
This file will show the player itself.
Choose a theme css-file and place it in the head of your document. Further information about ‘Themes’.
Create the audio element that will extended.
Add following scripts at the bottom of your document:
Call the player script with the configuration object as its only parameter:
You can view the result for both the page and the player itself below.