How to fix the mobile shortcut logo issue?

[MYWOOD]

Hi guys,

Anyone who can help me with the shortcut logo on mobile? I’ve lready added a favicon but I think it doesn’t work on mobile?

I’ve added a screenshot below

thanks in advance

[EBOOST]

Hi @MYWOOD

May I suggest to update code these steps:

1. Create manifest.json file with content below

{
  "short_name": "EC1",
  "name": "EC1",
  "icons": [
    {
      "src": "https://cdn.shopify.com/s/files/1/0657/0711/4750/files/DEF.png",
      "type": "image\/png",
      "sizes": "512x512"
    }
  ],
  "id": "https://www.mywoodpanels.com?source=pwa",
  "start_url": "https://www.mywoodpanels.com?source=pwa",
  "background_color": "#3367D6",
  "display": "standalone",
  "scope": "https://www.mywoodpanels.com",
  "theme_color": "#3367D6",
  "shortcuts": [
    {
      "name": "ECSS",
      "short_name": "E",
      "description": "S",
      "url": "https://www.mywoodpanels.com?source=pwa",
      "icons": [
        {
          "src": "https://cdn.shopify.com/s/files/1/0657/0711/4750/files/DEF.png",
          "sizes": "192x192"
        }
      ]
    }
  ],
  "description": "EC",
  "screenshots": [
    {
      "src": "https://cdn.shopify.com/s/files/1/0657/0711/4750/files/DEF.png",
      "type": "image\/png",
      "sizes": "540x720",
      "form_factor": "narrow"
    }
  ]
}

2. Go to Store Online-> theme → edit code
3. Assets-> add a new assets

4. Upload manifest.json file

5. Layout/theme.liquid

6. update code below likes the screenshot

[MYWOOD]

Hi Eboost,

Thank you, it worked but I’ve got an additional question.

How can I use the full height and width like the others?

You can find a screenshot below.

Thanks in advance

[EBOOST]

Hi @MYWOOD

How can I use the full height and width like the others? → what do you mean?

[MYWOOD]

Hello,

I mean the area which a marked in red. How can I fill the whole zone like the one of Google or Outlook?

Thanks in advance

[EBOOST]

Hi @MYWOOD

I think becase your image. You can go to https://maskable.app/editor to create a maskable → upload this image to your store → update image in the manifest.json file.