How To Remove Mobile Audio UI?

Hola Everyone! 

On non-mobile, when someone hits the play button on the two audios I have on my site, a progression bar shows how long the audio is (about 5 minutes each) and keeps them on the page. On mobile, clicking on the audio launches a player only window- no site nav or back button, and no progress bar. That's really bad UI! Expecting visitors who arrive on your site cold to hit a back button or not get confused by the lack of navigation, no information, makes zero sense. I'm rolling the dice by having audio on mobile. Is there a way to force mobile plays of website audio to stay on the mobile page? Any sage insights are greatly appreciated. 

Thanks,
Bobby

Can you share link to page where you use audio? We can check easier

Ah man, sorry Tuan. I never get notified and even after checking, didn't know you asked for this @tuanphan  You'll have to open this on mobile to see what I'm talking about. The web and tablet interface is fine, but the mobile is really bad. Pops into an audio only audio - so easy for someone to get confused and click away after the audio plays. 

https://bobbyford.io/

12 hours ago, BobInAustin said:

Ah man, sorry Tuan. I never get notified and even after checking, didn't know you asked for this @tuanphan  You'll have to open this on mobile to see what I'm talking about. The web and tablet interface is fine, but the mobile is really bad. Pops into an audio only audio - so easy for someone to get confused and click away after the audio plays. 

https://bobbyford.io/

 

It shows this to me on mobile (Samsung/Chrome). I think both look same?

and on Desktop

Let me take a screenshot of what I'm getting on an iPhone, @tuanphan What you are showing is perfect, but not what Im seeing on the iPhone. BRB. 

On the iPhone, it leaves the page and populates the image below. Also, notice the url? Odd @tuanphan

On 6/29/2023 at 2:54 AM, tuanphan said:

You try adding this to Code Injection > Footer to prevent audio open in new tab in iOS

<script>
  window.addEventListener("load", function(){
    Y.UA.ios = 0; 
  })
</script>

 

Where do I put this script @tuanphan

Nevermind, @tuanphan - you noted where, I just read it too quickly. Will test. Many thanks

That worked, @tuanphan --- yay! I appreciate your time and help. 

I'm crosslinking this thread to my original answer from 2021: