Web App Install Banner 1.0

Нет прав для скачивания
Увеличение взаимодействия с веб-приложение установить баннер для вашего сайта XenForo
Что это делает добавить установки баннера, который показывает, при определенных обстоятельствах, когда кто-то посещает ваш сайт с помощью Chrome на Android устройства. Ваш сайт должен быть протокол HTTPS для этой работы.

См:

Пожалуйста, войдите или зарегистрируйтесь для просмотра текста.



Обратите внимание, что вы делаете это на свой страх и риск. Я не могу обеспечить большую поддержку, и я не несет ответственности, если вы нарушите ваш сайт.

ZIP файл содержит пять файлов, которые должны быть загружены на ваш форум корня после редактирования: manifest.json, пусковая-икона-2x.png, пусковая-икона-3x.png, пусковая-икона-4x.png, и sw.js ,

manifest.json должен быть отредактирован, чтобы заменить детали, показанные ниже в оранжевый цвет с вашими деталями сайта:

Код:
{
  "short_name": "SeriousCompacts",
  "name": "SeriousCompacts.com - Quality Photography with Smaller Cameras",
  "icons": [
    {
      "src": "launcher-icon-2x.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "launcher-icon-3x.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "launcher-icon-4x.png",
      "sizes": "192x192",
      "type": "image/png"
    }
  ],
  "start_url": "https://www.seriouscompacts.com/?utm_source=webapp",
  "display": "standalone",
  "orientation": "portrait"
}
START_URL ссылается на страницу, которую вы хотите быть загружены, когда кто-то запускает свой веб-приложение. Ваш может заканчиваться / форумах или index.html в зависимости от вашей домашней страницы URL. При желании можно добавить параметры кампании для отслеживания в Google Analytics (благодаря @Pierce этой рекомендации).

Три PNG файлы (пусковая-иконка-2x.png, пусковая-икона-3x.png, пусковая-значок-4x.png) должен быть заменен с вашим логотипом в формате PNG на эти размеры изображения (96x96, 144x144, 192x192px, соответственно ).

Файл sw.js может быть загружен без предварительного редактирования. То есть именно то, как это предусмотрено Google здесь:

Пожалуйста, войдите или зарегистрируйтесь для просмотра текста.



Я ничего, кроме имени файла (сервис-worker.js изменено на sw.js) не изменится.

И, наконец, добавьте следующие строки в ваш шаблон PAGE_CONTAINER сразу после тега <HEAD>.


Код:
<link rel="manifest" href="/manifest.json">
<script>
    window.addEventListener('load', function() {
      var outputElement = document.getElementById('output');
      navigator.serviceWorker.register('sw.js', { scope: '/' })
        .then(function(r) {
          console.log('registered service worker');
        })
        .catch(function(whut) {
          console.error('uh oh... ');
          console.error(whut);
        });
      window.addEventListener('beforeinstallprompt', function(e) {
        outputElement.textContent = 'beforeinstallprompt Event fired';
      });
    });
</script>

Это было взято из примера Google здесь:

Пожалуйста, войдите или зарегистрируйтесь для просмотра текста.

с небольшим изменением в объеме от '. / 'до' / ', а также такое же изменение имени файла упоминалось ранее (сервис-worker.js изменено на sw.js).

Мой форум корень тоже мой изначальный. Если ваш корневой форум находится в директории под начало координат, то вам может понадобиться изменить путь к вашему manifest.json и sw.js соответственно.

В настоящее время Chrome устанавливается автоматически показывать баннер тогда и только тогда, когда кто-то посещает ваш сайт, по крайней мере в два раза, разделены по меньшей мере 5 мин. Если кто-то отвергает или игнорирует баннер, это не похоже, чтобы показать еще раз, если они не удалить данные о работе браузера с Chrome.

Некоторые удобные инструменты для проверки вашего баннера:

1) Включить хром: // флаги / # двухконтурности приложение-баннер-обручальных-чеки, чтобы заставить баннер, чтобы показать без проверки, если вы побывали дважды отделены друг от 5 мин. Не забудьте отключить это позже, в противном случае баннер будет держать выскакивают.

2) Если баннер не работает для вас, проверить свой адрес в этом manifest.json валидатора:

Пожалуйста, войдите или зарегистрируйтесь для просмотра текста.



3) Если баннер не работает для вас, инструменты пользователя для разработчиков в Chrome, и посмотреть на вкладке Приложения. Проверка сферы обслуживания и манифеста, который должен выглядеть следующим образом:
Автор
Bodanna
Скачивания
2
Первый выпуск
Обновление
Оценка
0.00 звёзд 0 оценок

Другие ресурсы пользователя Bodanna

  • Brivium - Extra Thread Views
    Brivium - Extra Thread Views
    Дополнительные критерии пользователей на просмотр тем
  • Brivium - Comment Each Post
    Brivium - Comment Each Post
    Плагин позволяет комментировать сообщения, полный аналог сообщениям