How to make a “frozen” footer that does not reload when you navigate through the pages of the site?

Question

Audio

Greetings!
I am making a website for my internet radio station radiobd.ru. The player stuffed it into the Sticky Footer plugin, and when the site was a one-page longread, it worked. But now it was necessary to make internal pages, and when you go to them, the broadcast is interrupted, because. the page is completely reloaded. I have seen other radio stations (silver.ru, gorodkudrovo.ru) page transitions without interrupting the broadcast, but I don’t know how to do it, except to use a banal frameset with all the ensuing problems. The site is sculpted on Wordpress / Elementor.
Thank you in advance!

Answer 1

It is necessary to remake the site into a single page application (React Native, VueJS and other js frameworks).
example - https://premium.wpmudev.org/blog/creating-a-hybrid...

Answer 2

https://www.javascripting.com/view/smoothstate-js

Answer 3

The easiest way is to open a new window, directly with the player, which will work in the background.
Otherwise, you need to redesign the site.
In extremely crutch form

1. You can attach a handler to a click on an internal link.
   
2. Then fetch the link address and get the html.
   
3. Parse it and find the container you need with the content.
   
4. Replace content on current page with loaded
   

Answer 4

The most banal way is really to do all this through an iframe. As for me, not such a bad option, there are less minuses than pluses.
In general, it would be really possible to make a template on something in the spirit of AngularJS and simply load new data, redrawing the template if necessary.