Trying out web push for iOS ?

Since iOS 16.4, web push is available for iOS devices, and if you're using WonderPush, we've made sure your website was compatible.

But there's a catch: You have to add the website to your home screen first.
It's done like this:

Once you click on the homescreen icon of your website, it opens like a native application would: without the usual Safari / Chrome user interface, with a slim status bar and no controls.

From there, you can subscribe to push like you would on an Android phone.

Making sure your website is compatible with iOS web push

To be compatible with webpush on iOS, a website has to be able to appear as a native app on the home screen. This is achieved by adding the "display": "standalone" attribute to your website's manifest.json.

Manifests are explained here.

If you don't have one setup, then WonderPush will add one for you and there's nothing you need to do to support iOS web push.

If you have your own manifest setup though, WonderPush will not add one and you'll have to modify your own manifest to add the "display": "standalone" attribute. This attribute is documented on MDN.

Why doesn't my image show up ? What about buttons ?

iOS web push are text only.😅

The notification does display your site's favicon as notification icon though, so make sure to adapt it to make it look good. It seems that iOS adds a black background to a transparent favicon.