---
title: "Add an icon to Self Help"
slug: "add-an-icon-to-self-help"
updated: 2026-08-13T14:00:34Z
published: 2026-08-13T14:00:34Z
canonical: "support.whatfix.com/add-an-icon-to-self-help"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://support.whatfix.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Add an icon to Self Help

Whatfix enables you to add icons to the Self Help widget. Choose a default icon, such as a question mark, or a custom icon that matches other icons in your application.

> [!NOTE]
> Info:
> 
> Expand the accordion(s) for more details.

**Add an icon to the Old Self Help**

Use the following steps to add icons to your Old Self Help widget:

1. On the Whatfix Guidance dashboard, click **Style**. ![ia_left%20nav_style](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/ia_left%20nav_style.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)
2. Click **Self Help**. ![styles_sh.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/styles_sh.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)

1. In the **Appearance** section, under **Widget Icon**, click the dropdown menu next to **Type**. Select either **Label with Icon** or **Icon only** based on your requirements. ![RB_DB_SH_addicon](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/RB_DB_SH_addicon.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)
2. In the **Icon** section, choose the **Custom** option. ![DB_SH_Themes_Addicon1](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/DB_SH_Themes_Addicon%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)
3. Click **Choose Icon**, then select the image you want to use from your device. ![DB_SH_Themes_chooseicon](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/DB_SH_Themes_chooseicon.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)

> [!WARNING]
> Note:
> 
> - Whatfix supports **PNG** and **SVG** formats for custom icons.
> - The image resolution can be up to 24x24 pixels.
> - The file size should be less than 25 KB.

1. After uploading the image, click **Save**. ![RB_DB_SH_Clicksavesupport](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/RB_DB_SH_Clicksavesupport.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)

> [!WARNING]
> Note:
> 
> For changes to reflect, [push the changes made to Production](/desktop/docs/publishing-content).

**Add an icon to the Improved Self Help**

Use the following steps to add icons to your Improved Self Help widget:

1. On the Whatfix Guidance dashboard, click **Style**. ![ia_left%20nav_style](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/ia_left%20nav_style.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)
2. Click **Self Help**. ![styles_sh.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/styles_sh.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)

1. In the **Customisations** section, click **FAB**. ![DB_SH_Fab.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/DB_SH_Fab%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)
2. In the **Icon** section, click the **+** icon. ![SH_Click_Plus_Icon.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Click_Plus_Icon.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)
3. Select the image you want to use from your device.

> [!WARNING]
> Note:
> 
> - Whatfix supports **PNG** and **SVG** formats for custom icons.
> - The image resolution can be up to 32x32 pixels.

1. Add a text for your icon. The text appears on hover over the FAB icon. ![SH_Add_Text.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Add_Text.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)
2. Click **Save**. ![RB_DB_SH_Clicksavesupport](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/RB_DB_SH_Clicksavesupport.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A49%3A47Z&se=2026-11-12T09%3A49%3A47Z&sr=c&sp=r&sig=qbOe%2BNkp0Xs2MkX88r7x7GSxRhvgGxplNs6kpr%2BcyL8%3D)

> [!WARNING]
> Note:
> 
> For changes to reflect, [push the changes made to Production](/desktop/docs/publishing-content).