# Fullscreen android from homescreen

**URL:** <https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881>\
**Category:** Tips\
**Created:** [June 25, 2017, 11:57am UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881 "2017-06-25T11:57:04Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![ashley.benson.tait](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/ashley.benson.tait/32/13292_2.png) [@ashley.benson.tait](https://forum.bubble.io/u/ashley.benson.tait)\
**Post date:** [June 25, 2017, 11:57am UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/1 "2017-06-25T11:57:04Z")

</div>

Hey @anon58826714

I noticed you appreciating the IOS fullscreen mode when opened from the homescreen icon and you were wondering about android. Yeah, me as well! Throw this in yer meta tags section and you’re GOLDEN!

meta name=“mobile-web-app-capable” content=“yes”  
Of course, throw this in html tags…

LUV THIS\>

MUST HAVE!!! @romanmg… I’m assuming you already know about this right?

---

<div class="post-metadata">

**Author:** ![JohnMark](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/johnmark/32/42431_2.png) [@JohnMark](https://forum.bubble.io/u/JohnMark)\
**Post date:** [June 25, 2017, 12:17pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/2 "2017-06-25T12:17:26Z")

</div>

Thanks

---

<div class="post-metadata">

**Author:** ![ashley.benson.tait](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/ashley.benson.tait/32/13292_2.png) [@ashley.benson.tait](https://forum.bubble.io/u/ashley.benson.tait)\
**Post date:** [July 7, 2017, 3:55am UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/6 "2017-07-07T03:55:43Z")

</div>

Cool right? I a basic must have!

Happy building!

---

<div class="post-metadata">

**Author:** ![JohnMark](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/johnmark/32/42431_2.png) [@JohnMark](https://forum.bubble.io/u/JohnMark)\
**Post date:** [July 8, 2017, 12:04pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/7 "2017-07-08T12:04:36Z")

</div>

Hello @ashley.benson.tait have you an example? I tried on html and header with no success.

* * *

 ![](https://us1.discourse-cdn.com/bubble/original/2X/a/a606e875968fe3648ba114598693e00164451131.png) ![](https://us1.discourse-cdn.com/bubble/original/2X/4/43f53dba2625a978c9d73e5f04badbcf3dac2f46.png)

---

<div class="post-metadata">

**Author:** ![philip](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/philip/32/17830_2.png) [@philip](https://forum.bubble.io/u/philip)\
**Post date:** [July 8, 2017, 2:22pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/8 "2017-07-08T14:22:53Z")

</div>

Might as well add the iOS version too (I think the \< \> characters were stripped in @ashley.benson.tait’s original message)

 ![](https://us1.discourse-cdn.com/bubble/original/2X/c/c7b925d896da5e4145a1e13b621b2c10de18d26b.png)

For anyone else reading, this is best placed in the Settings tab under SEO & Metatags → Advanced settings:

 ![](https://us1.discourse-cdn.com/bubble/original/2X/d/dd69ba4436d5697351aea26959ebf6f129c8f60d.png)

---

<div class="post-metadata">

**Author:** ![JohnMark](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/johnmark/32/42431_2.png) [@JohnMark](https://forum.bubble.io/u/JohnMark)\
**Post date:** [July 8, 2017, 3:03pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/9 "2017-07-08T15:03:19Z")

</div>

@philip it suppose to full screen the app? not working with iphone or android in my side.

* * *

 ![](https://us1.discourse-cdn.com/bubble/original/2X/3/38d2a0805ff9bb9f896d0fe40fbc6ea90ba6f82f.png)

---

<div class="post-metadata">

**Author:** ![philip](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/philip/32/17830_2.png) [@philip](https://forum.bubble.io/u/philip)\
**Post date:** [July 8, 2017, 3:38pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/10 "2017-07-08T15:38:13Z")

</div>

This currently only works if a user saves the app URL to their phone home screen as a quick link icon either via Safari or Chrome. I have a tutorial in my apps teaching people how to do this on signup. Keep in mind you must have fully functional navigation built in to your app since people will not be able to see the native browser nav.

---

<div class="post-metadata">

**Author:** ![JohnMark](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/johnmark/32/42431_2.png) [@JohnMark](https://forum.bubble.io/u/JohnMark)\
**Post date:** [July 8, 2017, 3:44pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/11 "2017-07-08T15:44:30Z")

</div>

It work well. Good to know.

---

<div class="post-metadata">

**Author:** ![ashley.benson.tait](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/ashley.benson.tait/32/13292_2.png) [@ashley.benson.tait](https://forum.bubble.io/u/ashley.benson.tait)\
**Post date:** [July 9, 2017, 11:33am UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/12 "2017-07-09T11:33:25Z")

</div>

Hey @JohnMark

```
<meta name="mobile-web-app-capable" content="yes">
<meta name=viewport content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="theme-color" content="#041E42">

```

That is what I’m using. Yes, people need to add the icon to their homescreen before it’ll work. But it’s so nice once it’s installed!

But you can ALSO (drum roll) add a popup to your site inviting users to add an icon to their homepage (it feels just like an app!) Bubble has this installed on their site (have you tried Bubble.is on mobile?) It pops up at some point while you’re on the site.

Here’s the instructions for that

> **[How to add “Add to Homescreen” popup in web app](https://blog.betapage.co/how-to-add-add-to-homescreen-popup-in-web-app-99d5237fabff)**
>
> Few days ago Lighthouse by Google was trending on BetaPage. 
> Lighthouse is Web Apps Audit tool. It is an open source, automated tool for…

Happy Building!

Sincerely,

Ashley

---

<div class="post-metadata">

**Author:** ![JohnMark](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/johnmark/32/42431_2.png) [@JohnMark](https://forum.bubble.io/u/JohnMark)\
**Post date:** [July 10, 2017, 12:35pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/13 "2017-07-10T12:35:17Z")

</div>

Perfect, can’t wait to try that. Thanks @ashley.benson.tait @philip

---

<div class="post-metadata">

**Author:** ![ashley.benson.tait](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/ashley.benson.tait/32/13292_2.png) [@ashley.benson.tait](https://forum.bubble.io/u/ashley.benson.tait)\
**Post date:** [July 10, 2017, 12:59pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/14 "2017-07-10T12:59:30Z")

</div>

Awesome @JohnMark. It’s such a clean experience! Yay 😃 let me know if there’s any more trouble with that!

Sincerely,

Ashley

---

<div class="post-metadata">

**Author:** ![carstenkring](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/carstenkring/32/16943_2.png) [@carstenkring](https://forum.bubble.io/u/carstenkring)\
**Post date:** [December 15, 2017, 2:45pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/15 "2017-12-15T14:45:47Z")

</div>

Great and very usefull, thx very much. Can I ask if you know a way to do this dynamically with bubble?. I am building a site that enables each user to customize their own mobile page(s). Ideally, each page or collection of page should have their own custom background color and “add to homescreen” - e.g. seperate service-worker.js, manifest etc etc. Or?

Brgds Carsten

---

<div class="post-metadata">

**Author:** ![louisadekoya](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/louisadekoya/32/217422_2.png) [@louisadekoya](https://forum.bubble.io/u/louisadekoya)\
**Post date:** [January 6, 2018, 1:06am UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/16 "2018-01-06T01:06:25Z")

</div>

@ashley.benson.tait, were you able to upload a service-worker and a manifest.json file to your root folder? I tried but had no joy. An image file works fine.

**Edit** : I was eventually able to upload the manifest.json file, once I put some actual text in it. I still l can’t upload a blank service-worker.js file as per the instructions, though. I suspect it’s because there’s already one uploaded.

I also get the impression that the manifest only works after deploying to live, which I haven’t done yet. So I’ll revisit this again after I deploy.

---

<div class="post-metadata">

**Author:** ![louisadekoya](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/louisadekoya/32/217422_2.png) [@louisadekoya](https://forum.bubble.io/u/louisadekoya)\
**Post date:** [January 10, 2018, 11:47pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/17 "2018-01-10T23:47:56Z")

</div>

> [@ashley.benson.tait](#):
>
> Here’s the instructions for that
> 
> [How to add &#8220;Add to Homescreen&#8221; popup in web app](https://blog.betapage.co/how-to-add-add-to-homescreen-popup-in-web-app-99d5237fabff)

In case anyone else is interested, the instructions at this link didn’t work until I added the following to my service-worker.js file:

```
self.addEventListener('fetch', function(event) {

});

```

Also, I had trouble uploading the service-worker.js file until I closed all Bubble instances, logged out of Bubble and signed back in

All worth the effort though as I now have A2HS for my app.

---

<div class="post-metadata">

**Author:** ![unveryalincak](https://avatars.discourse-cdn.com/v4/letter/u/ecd19e/32.png) [@unveryalincak](https://forum.bubble.io/u/unveryalincak)\
**Post date:** [February 15, 2018, 1:25pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/18 "2018-02-15T13:25:21Z")

</div>

Hi,  
I really need to learn how can I upload **blank service-worker.js**. I tried everything. Can you explain how did you succeed please?  
Thanks a lot

---

<div class="post-metadata">

**Author:** ![louisadekoya](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/louisadekoya/32/217422_2.png) [@louisadekoya](https://forum.bubble.io/u/louisadekoya)\
**Post date:** [February 15, 2018, 2:00pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/19 "2018-02-15T14:00:48Z")

</div>

I had to log out of Bubble and close all instances. Only after doing this was I able to upload the file. You may also want to try emptying the browser’s cache and clearing cookies etc.

---

<div class="post-metadata">

**Author:** ![unveryalincak](https://avatars.discourse-cdn.com/v4/letter/u/ecd19e/32.png) [@unveryalincak](https://forum.bubble.io/u/unveryalincak)\
**Post date:** [February 16, 2018, 7:32am UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/20 "2018-02-16T07:32:08Z")

</div>

I tried everything but no success…☹. I couldnt upload 0 KB file. If I put even a space in the file. It accepts. Is this the right place

 ![Ads%C4%B1z](https://us1.discourse-cdn.com/bubble/original/3X/b/3/b3d558f8689694d0afb62a62d740a8133b055209.png)

Thanks a lot.

---

<div class="post-metadata">

**Author:** ![louisadekoya](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/louisadekoya/32/217422_2.png) [@louisadekoya](https://forum.bubble.io/u/louisadekoya)\
**Post date:** [February 17, 2018, 1:46pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/21 "2018-02-17T13:46:41Z")

</div>

As it turned out for me, the service-worker file didn’t actually work without an event listener in it, so even though I eventually managed to upload a blank file, I ultimately had to edit it to add an empty event listener as below.

```
self.addEventListener('fetch', function(event) {

});

```

So I suggest adding the same to your file.

---

<div class="post-metadata">

**Author:** ![unveryalincak](https://avatars.discourse-cdn.com/v4/letter/u/ecd19e/32.png) [@unveryalincak](https://forum.bubble.io/u/unveryalincak)\
**Post date:** [February 17, 2018, 3:47pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/22 "2018-02-17T15:47:32Z")

</div>

Yes I did and It is ok now. Thx a lot. By the way did you find a way to use it with IOS ?

---

<div class="post-metadata">

**Author:** ![louisadekoya](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/louisadekoya/32/217422_2.png) [@louisadekoya](https://forum.bubble.io/u/louisadekoya)\
**Post date:** [February 17, 2018, 4:31pm UTC](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881/23 "2018-02-17T16:31:53Z")

</div>

Glad to hear it. No, I haven’t tried this with iOS. I know that users can add websites to the home screen on iOS but I don’t think you can prompt them to do so. According to [this article](https://dockyard.com/blog/2017/07/13/safari-ios-and-progressive-web-apps), as of July 2017, Safari did not support service workers or web app manifests, though it states in an update that work on it had begun.

[Next page](https://forum.bubble.io/t/fullscreen-android-from-homescreen/14881.md?page=2)
