Known Issue: Classic Theme Favicon Always Displayed When Using Microsoft IE11

This article describes a known issue specific to Microsoft Internet Explorer 11 (IE11) as documented on LPS-88702. In IE11, after navigating to a website page, the favicon will always be shown as the classic theme favicon for IE11. This is due to always using the LayoutSet since there is no themeDisplay available to use the current theme.

The following conditions must be true in order for this phenomenon to happen:

  • A custom theme with a custom favicon is used
  • The website navigation happens on Microsoft Internet Explorer 11

Our research has found the root cause of the issue to be within IE11.


Status: Workaround Available

Anyone regularly experiencing this issue would benefit from the use of another browser, such as Mozilla Firefox or Google Chrome, as neither of these other browsers manifest the same issue.

If it is not possible to use a different browser, you may follow one of the three workarounds listed below:

Being a change that deals with third-party configurations and high availability,  proceeding with these workarounds is at your own discretion.

  1. Theme generated using LDS build gradle: Add the following two lines of code inside the head tag of portal_normal.ftl file(src/main/webapp/templates/portal_normal.ftl) and add custom favicon under (src/main/webapp/images/favicon.ico) then IE11 will start displaying the respective favicon.

    Theme generated using NPM: Add the following two lines of code inside the head tag of the portal_normal.ftl file(src/templates/portal_normal.ftl) and add custom favicon under (src/images/favicon.ico)
    <link rel="icon" href="${images_folder}/favicon.ico" type="image/x-icon" />
    <link rel="shortcut icon" href="${images_folder}/favicon.ico" type="image/x-icon" />

    Note: This workaround will work only if Liferay resides on the root context of the application server

  2. Replace the incorrect favicon that IE11 uses as the default one with your custom favicon. The location of the default favicon to replace can vary across application servers.
  3. Handle the favicon replacement on the web server, that is, redirect all the requests from:

    "{protocol}://{host} : {port} / {context-path} /o/favicon"

Additional Information

For more information from Microsoft, see the following links:

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 1 de 1