How to add a custom favicon to a SuiteCommerce site

Changing the default NetSuite favicon to a custom favicon is one of the first things you should do when you setup a SuiteCommerce site. Not only does it give your site a professional look, but it also makes it easier for customers to locate your site link in their bookmarks bar.

The process of changing the favicon depends on if you are using SuiteCommerce Standard or SuiteCommerce Advanced.

SuiteCommerce Favicon

SuiteCommerce Standard:

  1. Navigate to the SuiteCommerce configuration record. Commerce > Websites > Configuration (This may be in a different location depending on when your environment was last updated)
  2. Enter into the configuration record for the site and domain you want to change the favicon at via the dropdown fields.
  3. Find the field titled "Favicon of the Website" under the Advanced tab and make it blank. There should be nothing in this field. Save the configuration record.
  4. Navigate to the File Cabinet. Documents > Files > File Cabinet
  5. Navigate to the following folder: Web Site Hosting Files > Live Hosting Files > SSP Applications > NetSuite Inc. - SCS : SuiteCommerce Standard > extensions > SuiteCommerce > the theme currently active on your site > scs version > img.
  6. Replace the favicon.ico file in this folder with the favicon file you want the site to display.
  7. Cache invalidate the site (Commerce > Content Management > Cache Invalidation Requests). Go to Setup > SuiteCommerce Advanced > Cache Invalidation Requests > New
  8. From the Available Domains list, select your domain and use the controls to move domains between the Available Domains box and the Selected Domain box
  9. Choose the type of operation = Clear cache for the whole domain(s). Click Submit
  10. Hard refresh the site (Cntrl + Shift + R) to validate that the favicon appears as you intended.

SuiteCommerce Advanced

  1. Navigate to the SuiteCommerce configuration record. Commerce > Websites > Configuration (This may be in a different location depending on when your environment was last updated)
  2. Enter into the configuration record for the site and domain you want to change the favicon at via the dropdown fields.
  3. Find the field titled "Favicon of the Website" under the Advanced tab and make it "/" (just the slash, no quotation marks). Save the configuration record.
  4. Navigate to the File Cabinet. Documents > Files > File Cabinet
  5. Navigate to the following folder: Web Site Hosting Files > Live Hosting Files > SSP Applications > NetSuite Inc. - SCA : 20XX.X (the version of your suitecommerce site) > Development
  6. Click on the New Folder button.
  7. Name the folder img in all lower case, and click save.
  8. Add the favicon file to the img folder and name it favicon.ico (it is important to name the file with the file extension, ".ico").
  9. Cache invalidate the site (Commerce > Content Management > Cache Invalidation Requests). Go to Setup > SuiteCommerce Advanced > Cache Invalidation Requests > New
  10. From the Available Domains list, select your domain and use the controls to move domains between the Available Domains box and the Selected Domain box
  11. Choose the type of operation = Clear cache for the whole domain(s). Click Submit
  12. Hard refresh the site (Cntrl + Shift + R) to validate that the favicon appears as you intended.

Hopefully, this post helped you customize your SuiteCommerce website and become more recognizable to customers. If you have any questions and want some free consulting advice, feel free to contact our team at Anchor Group.

Your cart
    Checkout