How To: Turn your site into a Mobile Web App

Show and tell
, ,
1

If you would like to turn your Wix web site into a Mobile Web App , just follow these simple steps:

With your site opened in the Editor, choose Settings from the Main Menu :

481Ă—587 47.8 KB

Click on Dashboard in the Sidebar Menu :

254Ă—504 20.2 KB

Click SEO in the menu:

243Ă—623 17.3 KB

Under the Add Header Code Meta Tags section, click the link to open the Meta Tags editor:

1075Ă—400 41 KB

In the text box, enter the following lines into the text box:

<meta name="apple-mobile-web-app-title" content="My Food App" />
<meta name="apple-mobile-web-app-capable" content="yes">

1077Ă—414 40.7 KB

Make sure you Publish your site. And then, add to your device’s home screen:

1234Ă—1002 121 KB

This should work for both Apple and Android devices. If this doesn’t work for Android devices, delete apple- from the beginning of the strings.

Your website will now open in full screen on your mobile device. Upgrade to Premium if you want to customize the favicon for your “web app”.

16 Likes
2

Hi Yisrael, thank you so much for the post. This is great! I have a quick question regarding the favicon… every time I attach a favicon to my home screen on the Apple phone, the image is blurry. Any suggestions on how to make the image appear clearer? Is this possible?

3

I believe that there are recommended sizes and resolutions for a favicon. I suggest you contact the Wix support team for this as they will be able to help you better.

4

Add to home Scren appear without favicon ((

5

The favicon is only enabled with a Premium account.

6

@yisrael-wix I have a Premium account and i have a favicon but when add to home screen, no favicon on home screen

7

This is really neat. But is there any way you can have a user download the url to their homescreen as a shortcut from the website itself? E.g. a button or something that says “add to home screen”?

8

I already have a PWA built on another platform and have the redirect code that works fine when I’ve placed in the header of other websites. I’ve tried the SEO route and placing in html code box. Doesn’t take a mobile user directly to my PWA. Shows PWA inside small code box on my WIX site. Any suggestions?

9

Hi, did you find a way of adding a button allow a user to download to their homescreen?