Как настроить имя приложения для ярлыка сайта (домашний экран)?

Question

У меня есть веб-сайт, который мой клиент хочет добавить на свой домашний экран на Android, поэтому, когда я делаю это (с Chrome), Chrome / Android просит предоставить / изменить отображаемое имя.В моем случае это заполнено «App».

Метка всплывающего окна, переведенная на английский: «Добавить в Homesceen»

Но когда я делаю то же самое, например, stackoverflow Я заполнил его «именем», вероятно, названием сайта.

так что я попробовал:

• У меня есть тег заголовка и я пытался его укоротить, но даже с очень маленьким заголовком все еще "Приложение"по умолчанию
• я добавил <meta name="application-name" content="name-X"> без эффекта, также попытался <meta name="apple-mobile-web-app-title" content="name-X">
• проверил разметку, которая проверяется без ошибок / предупреждений (w3c-validator)
• Значки приложений для разных устройств и размеров работают должным образом
• , и я попытался выполнить поиск в Интернете безуспешно: /
• Я даже не могу понять, откуда может появиться "Приложение"как это не происходит в источнике

за любую помощь, спасибо заранее :)

Answer 1

Вы ищете PWA JSON манифест .Он сообщит вашему браузеру о вашем приложении.

Как видно из приведенной выше ссылки, вы должны предоставить атрибут short_name и / или name .Не забудьте связать свой манифест:

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

Пример:

{
  "short_name": "Maps",
  "name": "Google Maps",
  "icons": [
    {
      "src": "/images/icons-192.png",
      "type": "image/png",
      "sizes": "192x192"
    },
    {
      "src": "/images/icons-512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ],
  "start_url": "/maps/?source=pwa",
  "background_color": "#3367D6",
  "display": "standalone",
  "scope": "/maps/",
  "theme_color": "#3367D6"
}