How to Customizing the favicon in Portals.

General
,
1

What are steps do we need to follow to Ccustomize the favicon in Portals.

2

@Venkatk17188855

There’s an HTML Fragment call pyPortalIcon. You have to save it to your ruleset and refer your icon image in it. The fragment will be something like this:

<pega:choose>

  <pega:when test='pyIsMobile'>

  </pega:when>

  <pega:when test='pyIsConstellationUI'>

    <link rel="shortcut icon" href="images/pzPegaIcon.ico">

  </pega:when>

  <pega:otherwise>

    <link rel="icon" type="image/png" sizes="32x32" href="<pega:binaryfile name='pzPegaIcon32.png' app='images'/>">

    <link rel="icon" type="image/png" sizes="16x16" href="<pega:binaryfile name='pzPegaIcon16.png' app='images'/>">

    <link rel="shortcut icon" href="**(YOUR ICON IMAGE)**">

  </pega:otherwise>

</pega:choose>
3

@Venkatk17188855

  1. In Dev Studio, search for and open the pyPortalIcon HTML fragment Rule

  2. On the HTML tab, in the HTML Source text box, edit the HTML markup to point to the custom icon.

Below is the example:

<strong>

```
<pega:onlyonce name="pzPortalIcon">
  <link rel="icon" type="image/png" sizes="32x32" href="<pega:binaryfile name='custom_icon_32.png' app='webwb'/>">
  <link rel="icon" type="image/png" sizes="16x16" href="<pega:binaryfile name='custom_icon_16.png' app='webwb'/>">
  <link rel="shortcut icon" href="custom_icon.ico">
</pega:onlyonce>
```

</strong>
4

@Sindhu Nalajala

Hi,

I’m not able to see the icon in the portal what i changed.

5

@Venkatk17188855

Ensure that the context points to the Ruleset where you saved your binary file.

You might need to clear your browser cache to load the updated file/Image.