Merge manifest.json and site.webmanifest

Problem

When you use OneSignal, it will generate a manifest.json for gcm_sender_id. When you use RealFaviconGenerator, it will generate a site.webmanifest for Android favicon.

But there should be only one rel=”manifest” tag in your page.

Reference: https://documentation.onesignal.com/docs/web-push-setup-faq#section-what-if-there-is-already-a-manifest-on-my-site-

The manifest.json

{
  "name": "modDIY.com",
  "short_name": "modDIY",
  "start_url": "/",
  "display": "standalone",
  "gcm_sender_id": "<your-ID>",
  "DO_NOT_CHANGE_GCM_SENDER_ID": "Do not change the GCM Sender ID"
}

site.webmanifest

{
	"name":"modDIY.com",
	"short_name":"modDIY",
	"icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],
	"theme_color":"#ffffff",
	"background_color":"#ffffff",
	"display":"standalone"
}

Solution

Merge them together and only put one manifest tag in your page header

<link rel="manifest" href="/site.webmanifest">
{
	"name":"modDIY.com",
	"short_name":"modDIY",
	"icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],
	"theme_color":"#ffffff",
	"background_color":"#ffffff",
	"display":"standalone",
	"start_url": "/",
	"gcm_sender_id": "<your-ID>"
}

Leave a Reply

Your email address will not be published. Required fields are marked *