Setting Up Your Store Favicon
A favicon is a small icon displayed on browser tabs and bookmark bars that helps customers quickly find your store among multiple tabs or bookmarks. From your SHOPLINE Admin, you can upload one favicon for your entire store so that your storefront pages and checkout page use the same icon, strengthening brand recognition.
This article explains what a favicon is, where and how you can set it up for your store, and which favicon takes priority.
What Is a Store Favicon
A favicon is a small image that represents your store. It typically appears in the following locations:
- Browser tabs: Displayed next to the website title on the browser tab.
- Bookmarks / Favorites: When customers bookmark your store, the favicon appears next to the bookmark name.
Where to Set Up Your Store Favicon
You can set up your favicon in either of the following locations:
| Setting Location | Path |
| Preferences | Online Store > Preferences > Favicon |
| Theme Settings | Theme Editor > Theme Settings > Favicon |
If you upload a favicon in both locations, SHOPLINE displays the favicon in Preferences first. The favicon in Theme Settings is displayed only when no favicon has been uploaded in Preferences.
For example, if you upload Icon A in Preferences and Icon B in Theme Settings, your store displays Icon A. If no icon has been uploaded in Preferences, your store displays Icon B.
| Note: We recommend setting up your favicon in Preferences so you can manage the favicon for your entire store in one place. |
Setting Up a Favicon in Preferences
To set up a favicon in Preferences:
- From your SHOPLINE admin, go to Online Store > Preferences.
- Locate the Favicon section.
- Under Image upload, upload the image you want to use.
Once the image is uploaded, the favicon takes effect and takes priority over the favicon in Theme Settings.
Setting Up a Favicon in Theme Settings
To set up a favicon in Theme Settings:
- From your SHOPLINE admin, go to Online Store > Design, then click Design on your published theme.
- Click Theme Settings, then locate Favicon.
- Upload the image you want to use, then click Save.
| Note: If you have already uploaded a favicon in Preferences, your store displays that favicon first, and the favicon in Theme Settings will not be displayed. |
Frequently Asked Questions About Store Favicons
Q1: Why doesn't the new favicon appear on the browser tab of some storefront pages after I upload it in Preferences?
This may be because your store uses an OS 2.1 or earlier theme, or an OS 3.0 private theme. These themes do not automatically use the favicon in Preferences. Instead, they continue to use the existing favicon in Theme Settings. Depending on your theme type:
- OS 2.1 or earlier themes: We recommend upgrading to an OS 3.0 theme. After the upgrade, your storefront pages automatically display the favicon in Preferences.
- OS 3.0 private themes: The theme code needs to be modified to display the favicon in Preferences. Please refer to the developer documentation.
Until you upgrade your theme or modify the theme code, you can also upload the same favicon in Theme Settings as in Preferences, so your storefront pages and checkout page display a consistent favicon.