Web Player

Play audio tracks directly in the browser or embed the player on your website. The player supports chapters, variable playback speed, and AirPlay streaming.

Quick Start

Direct Link — open in new tab:

<a href="https://huebsch.schoenreden.com/play/your-client/track-slug" target="_blank">
  Listen to audio
</a>

Embed — iframe on your page:

<iframe
  width="100%"
  height="100"
  src="https://huebsch.schoenreden.com/play/your-client/track-slug"
  allow="autoplay"
></iframe>

URL Structure

Format	Example	Use Case
Slug-based	`/play/your-client/article-path`	Human-readable, recommended
UUID	`/play/550e8400-e29b-41d4-a716...`	Direct track ID access

The slug comes from the slug field in your intake request, prefixed with your client slug.

Query Parameters

Parameter	Values	Default	Description
`theme`	`dark`, `system`	light	Force dark mode or follow system preference
`lazy`	`true`	`false`	Defer audio loading until play is clicked

Example with parameters:

/play/your-client/track?theme=dark&lazy=true

Embedding

Responsive Behavior

The player adapts to its container:

Viewport Height	Behavior
> 450px	Player with cover, title, controls, chapters
> 250px	Player with title, controls, chapters
> 150px	Controls with chapter preview
≤ 150px	Controls only

Full Example

<iframe
  width="100%"
  height="100"
  src="https://huebsch.schoenreden.com/play/your-client/track?lazy=true"
  allow="autoplay"
  style="border: none;"
></iframe>

The allow="autoplay" attribute permits audio playback inside the iframe.

Player Controls

Control	Behavior
Rewind	Jump back 30 seconds
Play/Pause	Toggle playback
Fast-forward	Jump forward 30 seconds
Progress bar	Seek to position
Speed	Click to cycle: 0.5×, 0.8×, 1.0×, 1.2×, 1.5×, 1.7×, 2.0×, 2.5×, 3.0×, 3.5×, 4.0×
AirPlay	Stream to compatible devices (Safari only)

Chapters

If the track includes chapters (from marker nodes in your content), the player displays:

Current chapter — shown immediately when playback enters a chapter
Up next — appears 10 seconds into the current chapter, click to skip ahead

Analytics

The player automatically reports listening engagement to the Beacon API.

What's collected:

Track ID
Listening segments (start/end timestamps in seconds)
Anonymous session identifier (hashed IP + User-Agent)

Privacy: No personal data is stored. Only segments longer than 2 seconds are recorded. Beacons are sent on pause, seek, and page unload.

Tips

Lazy loading — Use ?lazy=true for embeds below the fold to avoid unnecessary audio preloading
Media controls — The player integrates with OS media controls (lock screen, notification center) displaying track title and cover art
Multiple players — Each embedded player operates independently

Player URLs display rich previews automatically when shared. No configuration needed.

Platforms that support oEmbed will embed the player directly. Others show an audio card with cover art and track info.

Web Player

On this page