Patch file | Chromium-based browser: Prompt to install web page as application

Aug 23, 2023#t133

AI Translation

This post is translated from Chinese into English through AI.View Original

AI-generated summary

This tutorial explains how to make a website run as an app on iOS devices. It provides instructions on creating a manifest.json file in the website's root directory and includes code to be added to the webpage's tags. The manifest file should include details such as background color, description, display type, icons, website name, short name, start URL, and theme color. The tutorial also suggests checking the JSON format and provides a website for validation. After following the instructions, the website should prompt users to install it as an app when accessed.

Can be used with this tutorial: IOS: Make your website run as an app

Implementation effect:

image-17-768x458

↑, Prompt to install the website as an app when visiting

Tutorial:#

Create a manifest.json file in the root directory of the website

Content reference: (Remove comments when using)

{
    "background_color": "#ffffff (background color)",
    "description": "(website description)",
    "display": "standalone (display type, currently parameter for windowed display)",
    "icons": [
        {
            "sizes": "192x192 (icon size)",
            "src": "icon-192x192.png (fill in the icon address)",
            "type": "image/png (icon file type)"
        }
    ],
    "name": "(website name)",
    "short_name": "(short name)",
    "start_url": "/ (website homepage)",
    "theme_color": "#000000 (theme color)"
}

! For more parameter introductions, please refer to this document on MDN: Web App Manifest

Pay attention to correct JSON format when writing: You can use this website to validate and fix

Add the following code inside the tag of the webpage:

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

Refreshing the webpage should display the above prompt. If not, please clear the cache.