Starting with iOS/iPadOS 16.4, Apple supports web push notifications. To enable this, your website must include a properly configured Web Application Manifest file.

This guide explains how to create and implement a compliant manifest.json to support iOS/iPadOS web push functionality.

What is a Web Application Manifest?

A Web Application Manifest is a JSON file that defines how your web app appears and behaves when installed on a user's device. It includes metadata like:

• App name and short name
• Icons in multiple sizes
• Display mode (fullscreen, standalone, etc.)
• Start URL
• Optional ID to distinguish app instances

A valid manifest is required for web push on iOS/iPadOS.

💡

Use tools to quickly generate the manifest.json

Quickly generate a manifest using tools like SimiCart Manifest Generator.

Required manifest fields for iOS web push

Your manifest.json must include the following:

• $schema(required) - The JSON schema URL to validate structure.
• display (required) - Must be standalone or fullscreen.
• name (required) - The full name of your app.
• icons (required) - Multiple sizes are recommended. Include src, sizes, and type.
• start_url(required) - The entry point of your app.
• id (optional) - Assigns a unique identity to the app and allows your customers to install multiple instances of your web application with different preferences.

For a complete list of manifest keys, see MDN Web Docs.

Example manifest file

{
  "$schema": "https://json.schemastore.org/web-manifest-combined.json",
  "name": "OneSignal Manifest Example",
  "short_name": "OS Manifest",
  "display": "standalone",
  "start_url": "/",
  "icons": [
    { "src": "/icon-192x192.png", "sizes": "192x192", "type": "image/png" },
    { "src": "/icon-256x256.png", "sizes": "256x256", "type": "image/png" },
    { "src": "/icon-384x384.png", "sizes": "384x384", "type": "image/png" },
    { "src": "/icon-512x512.png", "sizes": "512x512", "type": "image/png" }
  ],
  "id": "?homescreen=1"
}

How to add a manifest file to your website

It's highly likely you already have a manifest.json file on your site. Make sure it includes the required fields listed above and is in the correct location.

1. Place the manifest.json in the root directory of your website.
2. Add the following <link> tag to every HTML page:

<link rel="manifest" href="/manifest.json"/>

📘

Using WordPress?

Try the Insert Headers and Footers by WPBeginner Plugin to inject the tag easily.

Test the manifest file

Open your browser to https://yoursite.com/manifest.json but replace "yoursite.com" with your actual website URL. You should see the manifest.json file publicly accessible with the required fields.

👍

Done! Your manifest.json file is set.

Next, review the Mobile Web Push for iOS/iPadOS docs and/or Getting Your Audience to "Add to Home Screen" to start collecting iOS web push Subscriptions.