Forum Discussion

HayleyBird-2856's avatar
HayleyBird-2856
Community Member
3 years ago

Browser URL bar taking up screen when viewing course on mobile.

When publishing my e-learning to web and displaying on mobile, I am finding the browser bar is taking up around 25% of the screen. The course is viewed in landscape mode so this is having a big impact on the amount of space available!

I have all settings in the player to launch in new window and display without browser controls, yet am still finding this issue. The course is intended to be viewed on multiple devices so this is becoming a big problem to the overall look and functionality of it. 

Can anyone shed some light as to how to have the mobile course full screen? 


  • Hello Hayley, 

    I did a quick test on my iPhone using a course published with settings to allow it to launch in full screen, and I can confirm that the URL bar was still visible at the bottom of the screen after launching the course. I went ahead and created support case 03266349 for you so we can review the behavior. 

    You're in good hands, and a member of our support team will be reaching out to your shortly!

  • I have the same problem. Please contact me as well when you haver the solution. 

  • Hello Gilles! 

    I understand how frustrating it can be to have the mobile version of your course not displaying as expected. I have created a support case on your behalf so our team can take a look at your file. 

    You will be hearing from our team shortly! 

    Have a great afternoon!

    • GillesDemers-66's avatar
      GillesDemers-66
      Community Member

      Hello,

      Any news on the matter?
      Maybe this additional info could help :

      Here’s a tool I designed a few years ago with SL360 :
      https://boussole-modes-ens.netlify.app/
      When opened on a phone, the file opens in full screen with an instruction, that I would translate like that : “drag from the top to the bottom and press the return button to quit the full screen mode”. That’s perfect (see “Mobile-OK.png” attached file)

      Here’s a tool I just designed with SL360:
      https://normefc-microlearning.netlify.app/
      When opened on a phone, the file opens with an info bar at the top that I can’t remove and takes of 30% of the screen space. ”. That’s bad (see “Mobile-not-OK.png” attached file)

      Hope this helps and please stay connected. I can’t release my mobile tools in that state.

      Thank you and have a good day!

  • Hi Gilles,

    I attached your files to your existing case and escalated your case to our Tier 2 Support Engineers. You should be hearing from them usually within one business day, but usually sooner.

    Thanks for reaching out!

      • kklxd's avatar
        kklxd
        Community Member

        Hi everyone,

        I came across the same problem and after a lot of troubleshooting this is what I found:

        1. Publishing to the web means the course will open in a browser and you cannot force full screen by default. You'll need to have the user choose full screen mode for viewing comfort.
        2. To get rid of the browser bar you need to KEEP the Storyline PLAYER in a minimal form and toggle "full screen" mode on. When the user clicks on the full screen icon it will make the browser bar disappear.
        3. Consider resizing your story to fit all available space (e.g. 2:1 ratio). You'll need to test to see what works best.

        This was not obvious to me as I'm a beginner user of Storyline. So just leaving this here for all those who are struggling with the same problem :)