Skip to main content

How do I add a favicon to my website? - Knowledgebase / Design and Customizations - ShopFactory Help Center

How do I add a favicon to my website?

Authors list

According to Wikipedia, a favicon (short for favorites icon), also known as a shortcut icon, website icon, URL icon, or bookmark icon is a 16×16 or 32×32 pixel square icon associated with a particular website or webpage.

1. Generate the favicon.ico image file that is either 16x16 pixels or 32x32 pixels

There are online tools you can use to generate your favicon - simply google "generate favicons" -- or, you can manually create the .ico image file using a Photo editor.

You can try one of these online tools,

https://realfavicongenerator.net/

2. Copy your favicon.ico file into your shop's "Runtime" folder

Copy the favicon.ico into your shop's RUNTIME folder and then publish your shop. All the files in your Runtime folder will be uploaded to your server (including the favicon file).

- Open Windows Explorer. Or right-click the Windows "Start" button and click "Explore" to open your Windows Explorer and go to your shop-folder.

- By default, your shop folder should be in "My Documents\ShopFactory V14 Websites" directory. When you are at "ShopFactory V14 Websites" folder, locate your shop-folder.

- Double-click on that shop-folder to open it

- Locate the RUNTIME folder and double-click on it

- Copy the favicon.ico file

- Once you have copied the favicon file, proceed to item #3 below.

3. Add the favicon link tag to the <head> element

In ShopFactory, Google Analytics dialog box uses the <head> element so this is where you need to add the favicon link tag.

Note: You can add any custom html in this GA code window, where, the custom html code must be added within the <head> section for all pages. (This window is not solely for Google Analytics code.) You can add any html code that needs to be added within <HEAD> section.

  • Open your shop in ShopFactory
  • At the left tree menu, click on ShopFactory Central page (if you’re not already there)
  • Click on "Search Engine Optimization (SEO)" button
  • At the popup window, select Website Analytics -> and click inside the "Google Analytics code" box
  • Add this link tag in the Google Analytics box - this is to ensure it works in FireFox and Google Chrome browsers:

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

Note: If you have an existing Google Analytics code in there, make sure you add the favicon link tag below the existing html code to ensure you don't break the existing Google Analytics code in there.

15737AKXGBYXXHBQXBNQ0-1613604662729.png


- Click Close.

- Save and preview your shop

- Publish your shop again so that the favicon file gets uploaded to your server

- Check your website again in different browsers to see the favicon