Having a sticky audio player is a stunning feature and will improve the overall UX of your website. There are 2 ways to get persistent and continuous audio playback on your website. Each with their pro and cons. Here you go:
1. Continuous audio playback using browser’s cookies
The concept is pretty simple. User start the audio player. We save the revelant times in a cookie session. When user loads a new page, everything is reloaded but the audio player resume where it left.
Pro: Easy to implement. Work on any WordPress site. Compatible with any third-party plugins. Use our MP3 Audio Player plugin for WordPress which has this feature built-in! Great for WooCommerce, Beatstore, and Music online shops.
Cons: There will be a small audio gap when you switch the page because, in this scenario, the whole page is being (re)loaded, including the player. And the audio will resume when the page has loaded. Another issue is on some browsers, you won’t be able to auto-resume the song because of the browser auto-play policies. If the user has not explicitly set his browser’s preferences to allow auto-play, he might have to click play to resume the song.
Demo: Check out our MP3 Audio Player Pro that offers continuous playback through Cookie sessions.
2. Continuous audio playback using AJAX
In this scenario, the audio player is not being reloaded on each page. It’s a true, persistent player that remains stick on your website. To do this, your WordPress theme must offer Ajax page loading so your website becomes a kind of SPA (Single Page Application). It mostly means that the header and audio player will remain persistent on your website and the content of your page will be loaded via AJAX instead of a standard page loading.
Pro: Absolutely no cuts between page load. This is what the professional websites use (eg: Soundcloud, Spotify, etc.)
Cons: You must use an AJAX-powered WordPress theme and they are hard to find! There is no plugin available for this. Also, not all third-party plugins will be compatible with AJAX page loading. Eg: WooCommerce is not compatible with AJAX page loading.
Demo: Check out our Music AJAX WordPress themes for Musicians and Podcasters. They are all AJAXified and audio does not stop when you switch to another page.
If you have additional questions about continuous audio player, lets have a chat!
