A favicon, or browser icon, is a small square image that displays next to a page's title in browser tabs and in other places across the web. Adding a custom favicon makes your Squarespace 5 site recognizable in a browser full of tabs or bookmarks.
When creating a favicon image:
- Name the image file favicon.png.
- Currently, .ico files aren't supported.
- Favicon images work best across all browsers when sized between 100px × 100px and 300px × 300px, though they display at 16px × 16px. These are the standard favicon dimensions, and while some browsers support larger favicon files, all will support that size.
- In Internet Explorer, the favicon won't appear.
Step 1 - Upload the image to file storage
- In the Website Management bar, click File Storage under Data & Media.
- Add the favicon.png file to your file storage area, in General Storage (not a in folder).
Step 2 - Add the favicon
- In your Website Management bar, click Website Settings under Structure.
- In the Advanced tab, scroll down to the Favicon (Favorites Icon) Display section.
- In the Icon Location drop-down menu, choose Use an icon stored in your File Storage area (favicon.png).
- Click Update Information.
The favicon should now display in the logged-out version of your site. To see the new favicon, open your site in a private browser.
If you don't see the favicon:
- Open your site in a browser other than Internet Explorer. Internet Explorer doesn't display .png favicons.
- Clear your browser's cache and restart your browser.
- Ensure your image is a .png file and the image name is favicon.png. Squarespace 5 doesn't currently support .ico files.
- Ensure you added it to the main file storage area (not a folder).
Tip: While you're logged into your site, you'll see the Squarespace logo as the favicon.