Audio Player That Continues Playing on Page Loads

Looking for a way to have an audio player that once clicking play, remains playing when users leave the original page that has the audio player and views other pages on the website. This is common on most radio station and news websites.

I’d be ok if the audio cuts on the new page load but it needs to remain at the spot and have audio controls that show up on each page.

Haven’t seen anyone else successfully build this in Webflow yet and wondering how possible it will be (I’d imagine there is no way to do this natively in Webflow).

Any help is appreciated! Happy to pay someone if they believe they can dev this.

In most modern sites that’s achieved by using an SPA/AJAX site design, where you never actually reload the page, and therefore never actually terminate the audio stream.

That’s not impossible in Webflow but there are no built-in tools to support it either.
It might be worth searching for a Webflow+SPA toolset that can provide some of that capability, but I’ve not encountered anything personally, only built custom solutions there.

Another approach is to open the audio player as a separate pop-up window, so that it’s independent of the main HTML page, and won’t close when you navigate… however that’s a bit touchy, as different browsers have different rules on JS window opening, and ad blockers add another layer of interference.

The upshot is that your only reliable option is to design your site specially, or to prevent nav-away by targeting all of your links to _blank so the don’t interrupt the audio playback.

If interruption is ok, this approach is the most doable.

If you are using a live stream, or if your player can handle positioning and position update events, you can make the page-reloads fairly seamless as well by auto-playing at the same position you left the prev page from.

That’s an interesting scenario I’d have some fun looking into. If you want to PM me with some details, your site link, the player you want to use, and the audio stream you’re connecting to, I’ll look a bit deeper and see what it would take for me to build that for you.