All Collections
Build My Storefront
Advanced Site Customization
How to Set a Home Screen Icon for your site on iPhone and Android
How to Set a Home Screen Icon for your site on iPhone and Android

Customize the icon displayed when a customer saves a shortcut from your site to their smartphone's home screen.

Updated over a week ago

Even if your store does not have an App, it is still possible for your Users to create a shortcut to your Website on their mobile device’s home screen.

You can assign a custom icon to be displayed on a home screen shortcut to give you more control over your branding.

NOTE: The shortcut image that you want to use should ideally be a minimum of 152x152px in size or a 1:1 aspect ratio.

First, it will be important to upload the image that you want to use to a stable image hosting platform.

You can upload directly to Amazon AWS through your store under the Customization tab, where you'll click Advanced > Assets.

Once your image is uploaded, you will want to copy or keep the link somewhere for later use. You can click the Copy icon to the right, next to the Trash/Delete icon.

If you're using a Theme Home Page (see below for Landing Pages):

  1. You will want to navigate to your Checkout Snippets in this way. Under the Customization tab again, you'll click three dots > Checkout Snippets. There, you'll find the Head Code Snippet section.

  2. You will need to insert the code below into the Head Code Snippet.

    <link rel="apple-touch-icon" href="imagehere">

  3. Replace the imagehere text, in bold above, between the quotation marks with the link you copied from the Assets panel, above.

If you are using a Landing Page as your homepage:

  1. Add a Custom HTML Block anywhere on your Landing Page

  2. Paste one of the code below in the Custom HTML section

    <script> document.head.innerHTML += '<link rel="apple-touch-icon" href="imagehere" />'; </script>

  3. Replace the imagehere text, in bold above, between the quotation marks with the link you copied from the Assets panel, above.

Your icon should now appear when adding your site to a smartphone home screen:

Did this answer your question?