Need help coding a static Radio / Media player in Webflow, like iHeart or Spotify!

Design help Custom code
1

Hi, good people of Webflow!

I´m going to re-create and then re-design the below site in webflow. BUT before I get started I have a couple of questions I need a little help with.

The website is for an independent radio station. I need to find out if there’s a way to embed a radio player in the header of the site. It needs to be able to remain live on the page even if people click away from the home page. So basically a radio player that remains live no matter what you do on the site.

So in it´s simplest form:
An uninterruptible radio player that follows the user. it´s radio for now, but could be video in the future.

My thoughts:
To embed the link and create a sticky header. That should fairly easy to do. The difficult question is that the stream is not interrupted when hopping from page to another on the website.

Webiste that will be re-created in weblow:

Radio player link:
http://edge-studio-01-production.mixlr.com/stations/ngrqp

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

@jimmyjdean,

The only real way this could work would be with an app.

Even iHeart, Spotify does not have this. When you change pages the data refreshes because it is accessing the server.

I wish you luck if you can find a solution, but do not think it is possible.

Best Regards,
~ Brandon

3

Screenshot 2019-12-30 at 13.39.25
Screenshot 2019-12-30 at 13.39.253160×1516 296 KB

Thanks for the reply. I checked iHeart out, they have something that works.

check the link:

as you can see the media player sticks to the bottom and stays in place and uninterrupted when clicking through the site.

pics also attached.

Do you know how that can be done in webflow?

Screenshot 2019-12-30 at 13.39.13
Screenshot 2019-12-30 at 13.39.133170×1522 543 KB

4

Anything is possible with the right custom code.

Best Regards,
~ Brandon

5

ok. thanks.

Is there anyone who can help with custom coding?

or have any other advice?

Thanks in advance.

6

@jimmyjdean,

first thing would be to figure out which player system you want to use.

From there someone here with more coding experience than me should be able to help.

You need to have some sort of feed for that to work and then not refresh when changing from page to page.

Best Regards,
~ Brandon

7

ok, great.

It´s using http://mixlr.com/ at the moment and will probably continue to do so.

Does anyone have any suggestions for alternatives?

Screenshot 2019-12-30 at 14.13.43
Screenshot 2019-12-30 at 14.13.433146×1516 615 KB

8

@jimmyjdean,

I’m going to change this category for custom code, since thats the help you need.

Best Regards,
~ Brandon

1 Like
9

Not sure if this works with a live audio stream but it’s worth checking out:
https://www.udesly.com/webflow-resources/webflow-audio-player/

1 Like
10

Thanks! i´ll check it out :slight_smile:

11

Hi, there @jimmyjdean.
Did you find any solution for this? Because I 'm also interested.

“The stream is not interrupted when hopping from page to another on the website.”
This feature is the one I am interested in.

Thanks

12

You should look into using the True Audio Player. The clonable has an example of the exact functionality that you’re looking for. Here’s the link to the webflow clonable Webflow Audio Player - Webflow Hope it helps :blush: