Favicon in Shopify

  1. Favicon in the theme settings: Online Store → Themes → Customize → Theme settings, then upload icon-512.png under Logo or Favicon. Shopify creates the browser favicon from it.

  2. Upload the touch icon: Themes → … → Edit code → Assets → Add a new asset and upload apple-touch-icon.png.

  3. Add code to theme.liquid in layout/theme.liquid, right before </head>:

    <link rel="apple-touch-icon" href="{{ 'apple-touch-icon.png' | asset_url }}">
<meta name="theme-color" content="#ffffff">

Theme updates sometimes overwrite code changes – check the touch icon after updating.

← Back to the favicon generator