---
title: "Customizations in Self Help"
slug: "customizations-in-self-help"
updated: 2026-09-29T10:17:25Z
published: 2026-09-29T10:17:25Z
canonical: "support.whatfix.com/customizations-in-self-help"
stale: true
---

> ## 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.

# Customizations in Self Help

Whatfix enables you to customize the appearance and behavior of the Self Help widget to align with your application's design. Customization includes updating the widget's icon, position, animations, interaction settings, personalizing content, and more, to provide a seamless experience for your users.

> [!NOTE]
> Info:
> 
> Expand the accordions for more details.

****Customizations in Improved Self Help****

> [!NOTE]
> Info:
> 
> Improved Self Help is a Beta feature. To enable Improved Self Help on your dashboard, contact [support@whatfix.com](mailto:support@whatfix.com?subject=Enable%20Improved%20Self%20Help&body=Hi%20team%2C%0A%0APlease%20enable%20Improved%20Self%20Help%20for%20our%20Dashboard%0AENT%20ID%3A%0A%0ARegards%2C). Improved Self Help provides an enhanced and revamped end-user experience of the Self Help.

> [!WARNING]
> Note:
> 
> To ensure that the Self Help widget is WCAG compliant, Whatfix recommends selecting colors and themes according to the [WCAG guidelines](/studio/docs/accessibility).

Use the following steps to customize an Improved Self Help segment:

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%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%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%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

Improved Self Help customizations are of the following types:

- **Customisations**: Enables you to configure the visual and layout aspects of the Improved Self Help widget.
- **Attention**: Enables you to configure icon animations and onboarding messages to draw users' attention to the Improved Self Help widget.
- **Interaction**: Enables you to configure how users interact with the content within the Improved Self Help widget.
- **Features**: Enables you to integrate Support options, Feedback mechanisms, and Chatbot integration into the Improved Self Help widget.
- **Smart features**: Enable QuickRead and personalize content for your end users based on their content usage history.

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Style.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

Expand the accordions for more details:

****Customisations****

In the **Customisations** tab, configure the visual and layout aspects of the Improved Self Help widget.

**Panel**

- **Mode**: Enable the **Mode** toggle. Choose between **Light** and **Dark** modes to adjust the widget’s background appearance.

![SH_Panel_mode.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Panel_mode.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Corner radius**: Set the corner radius for the Improved Self Help widget and its content cards. The available options are **Sharp**, **Regular**, **Smooth**, and **Round**, with **Regular** set as default.

![SH_Corner_radius.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Corner_radius.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Layout**: Configure the content layout within the Improved Self Help widget. The available options are **Detailed** and **Minimal**. ![SH_Layout.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Layout.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Spacing**: Set the spacing between the content in the Improved Self Help widget. The available options are **Compact** (4px), **Regular** (8px), and **Relaxed** (12px), with **Regular** set as default. ![SH_Spacing.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Spacing.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

---

**Header**

- **Color**: Configure the header’s color using the color picker or by entering the hex code.
- **Header Text:** Customize the header text.

> [!WARNING]
> Note:
> 
> The **Header Text** can have up to 30 characters.
- **Description**: Customize the description text.

> [!WARNING]
> Note:
> 
> The **Description** can have up to 150 characters.

![SH_Header.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Header.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

---

**Fab**

Customize the **Floating Action Button (FAB)** of the Improved Self Help widget in its closed state.

![Self Help Content Creator FAB](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_FAB_Content%20Creator.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

- **Style**: Choose the elements to display in the FAB. The available options are:

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Style(1).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
  1. **Only icon**: Displays only the icon without a text label.
  2. **Icon & label**: Displays both the icon and a text label.
  3. **Only label**: Displays only the text label without the icon.

- **Size**: Set the size of the FAB. Drag the slider from **Min** to **Max** to change the size. The default size is 56×56 dp, which is the largest size available.

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Fab.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Corner rounding**: Set how rounded the FAB corners are, from a square to a fully rounded shape. Drag the slider toward **Square** for sharp corners or toward **Round** for a fully rounded FAB. ![FAB Corner rounding slider from Square to Round](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_CornerRounding.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

> [!WARNING]
> Note:
> 
> **Corner rounding** applies only to the FAB. To change the corners of the open widget and its content cards, use **Corner radius** in the Self Help **Panel**.
- **Edge spacing**: Set how far the FAB sits from the edge of the browser window. Drag the slider from **Min** to **Max** to increase the spacing. You can set the spacing up to 20 px. ![FAB Edge spacing slider from Min to Max](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_EdgeSpacing.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Color**: Configure the FAB icon’s background color using the color picker or by entering the hex code.

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Color.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Icon**: Change the Pin icon. Five predefined icon options are available, with the **Bulb** icon set as the default for the Improved Self Help widget. You can also upload custom icons using the **Plus** icon. The icons must be in PNG or SVG formats. The file size should not exceed 25 KB, and the dimensions must be 32×32 px. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Fab_Text(1).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Icon Text**: Customize the Pin icon text. This changes the text that appears when you hover your cursor over Pin.

> [!WARNING]
> Note:
> 
> The **Icon Text** can have up to 20 characters.

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Fab_Text.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Position**: Change the default position of Pin. Choose one of the 12 available position options. Pin appears in this position for all end users. However, you can allow end users to change the position of Pin by enabling them to drag and drop it to their preferred location. To do this, enable the **Allow drag-and-drop** toggle. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Pin_Position.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Allow drag-and-drop**: Enable or disable the drag and drop toggle. This enables end users to freely move the Pin icon anywhere on their screen.

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Pin_Position(1).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

****Attention****

In the **Attention** tab, configure icon animations and onboarding messages to draw users' attention to the Improved Self Help widget.

**Animate icon**

- Enable or disable animations for Pin. Select amongst three animation options: **Ripple**, **Flash**, and **Pulse**. View the animation for each of these options in the preview beside the accordion.
- Configure the frequency of display, that is, how often the animation appears to users.![SH_Animate_icon.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Animate_icon.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

---

**Nudge**

- Nudges appear when end users first see Improved Self Help. A nudge is a tool-tip that displays on Improved Self Help notifying the end user about the feature. To enable it, in the **Nudge** accordion, toggle **Enable** on. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Improved_SH_nudge(1).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- In the **Show message tool-tip on**, choose between showing the nudge on Pin and showing the nudge on the Improved Self Help panel. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/image(564).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- Change the message shown on the tool-tip. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/image(565).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- Choose how many times the nudge appears using the **Number of times to be shown** dropdown. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/image(566).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- Change the text on the button that end users click to acknowledge and close the nudge in the **Button text** section.

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/image(567).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

****Interaction****

In the **Interaction** tab, configure how users interact with the content within the Improved Self Help widget.

**Execute Pdfs and Links**

Select how you want to execute PDFs and links, such as opening in a new tab or within the same page.

![SH_Interactions.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Interactions.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

---

**Execute Flows**

Select how you want to execute Flows, such as on the same page, in a new tab, as a Pop-up, or as a Slideshow.

![SH_Execute_Flows.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Execute_Flows.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

****Features****

The Features section enables you to integrate Support options, Feedback mechanisms, and Chatbot integration into the Improved Self Help widget.

**Support**

- Enable or disable [**Email**](/desktop/docs/integrate-email-support-in-self-help), [**Chat**](/desktop/docs/enable-live-chat-when-self-help-search-result-is-empty), and **Ticketing support**.
- Customize the message that appears when no search results are found.![SH_support.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_support.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

---

**Feedback**

- **Collect feedback**

Enable or disable the **Collect feedback** toggle. It enables you to collect feedback from end users to gauge the usefulness of help content and enable them to provide feedback on the underlying application. ![SH_Feedback_Toggle.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Feedback_Toggle.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Header Text**: Customize the header text on the feedback form. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Header_Text(1).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

> [!WARNING]
> Note:
> 
> The Header Text can have up to 50 characters.
- **Helper Text**: Customize the helper text to help your end users understand the purpose of the feedback form. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Header_Text(2).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

> [!WARNING]
> Note:
> 
> The Helper Text can have up to 150 characters.
- **Add Dropdown**

Enabling the **Add Dropdown** toggle enables you to provide predefined categories for end users to select when submitting feedback. You can add up to five categories.

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Add_Dropdown(1).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Require email**

Get your end users' email IDs by enabling the **Require email** toggle. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Require_Emaill_Toggle(1).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Allow screenshot attachment**

Enables users to attach screenshots with their feedback.

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Require_Emaill_Toggle(2).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- **Email notifications**

> [!WARNING]
> Note:
> 
> - **Daily**: Receive email notification every day at 9:30 PM IST for all the feedback received in the last 24 hours.
> - **Weekly**: Receive email notification every Monday at 9:30 PM IST for all the feedback received in the previous week.
> - **Instantly**: Receive email notification immediately after the feedback is submitted.
> 
> There can be a maximum of 200 feedback per email, beyond which any additional feedback is ignored.
  - Enable or disable the **Email notifications** toggle.
  - Enter the Recipients' email addresses. You can add up to seven recipients.
  - Select a **Frequency** in which you want to receive the email notification. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Email_notification.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

---

**Chatbot**

- Enable or disable the [**Chatbot integration**](/desktop/docs/integrate-chatbot-in-improved-self-help). The Chatbot functionality in Improved Self Help enables you to integrate a chatbot directly into the Improved Self Help, providing users with automated assistance without leaving the application.
- Customize the **Chatbot header text**.
- Enter the **URL** for the chatbot you want to integrate. ![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Enable_Chatbot.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

****Smart features****

In the **Smart features** tab, enable [QuickRead](/studio/docs/quickread) and [Personalization](/studio/docs/personalization-1) for your end users based on their content usage history.

1. After customizing the Improved Self Help, click **Save**.

![](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SH_Save(1).png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

> [!WARNING]
> Note:
> 
> - Once previewed, you must perform a [Push to Production](/desktop/docs/publishing-whatfix-content) for these changes to reflect for your end users.

****Customizations in Old Self Help****

> [!NOTE]
> Info:
> 
> The old Self Help experience will be deprecated after June 2025. If you'd like to enable the Improved Self Help experience earlier, contact [support@whatfix.com](mailto:support@whatfix.com?subject=Enable%20Improved%20Self%20Help%20Experience&body=Team%2C%20kindly%20enable%20the%20improved%20Self%20Help%20experience%20for%20the%20following%20ENT).

> [!WARNING]
> Note:
> 
> To ensure the Self Help widget is WCAG compliant, Whatfix recommends selecting colors and themes according to the WCAG guidelines.

Use the following steps to customize an Old Self Help segment:

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%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%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%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

1. In the **Appearance** section, make the following configurations:

- Change the widget label and text color in the minimized state.
- Define the widget position.
- Show or hide the header label.
- Change the color of the close icon.
- Change the widget header label and text color in expanded state.
- Change the background color.
- Change the content text color.
- Change the content background color.
- Change the search bar background color. ![sh_styles_appearance.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/sh_styles_appearance.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

1. In the **Attention** section, make the following configurations:

- Change the widget animation and the frequency of display. ![RB_DB_SH_animateSHicon](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/RB_DB_SH_animateSHicon.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- Change the onboarding themes.
- Change the button text, background color, and text color. ![RB_DB_SH_onboardingthemes1](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/RB_DB_SH_onboardingthemes%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
- Enable or disable the onboarding message when your users open the Self Help widget.
- Edit the onboarding message.
- Choose to display the onboarding message on Self Help in an opened or closed state.
- Change the number of times the onboarding message is shown to your end users. ![RB_DB_SH_Onboardingmessageoptions](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/RB_DB_SH_Onboardingmessageoptions.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

> [!WARNING]
> Note:
> 
> When enabled, the onboarding message is displayed to all your end users (not just new users) for the set number of times. For more information, see [Animate the Self Help Tab](/desktop/docs/animate-the-self-help-tab).

1. In the **Interaction** section, make the following configurations:

- Select how you want to execute links.
- Select how you want to execute Flows. ![sh_styles_interaction.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/sh_styles_interaction.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

> [!WARNING]
> Note:
> 
> For more information, see [Configure Content Interaction](/desktop/docs/configure-how-users-interact-with-self-help-content) in Self Help.

1. In the **Support** section, make the following configurations:

- Enable or disable email, chat, and ticketing support. ![sh_styles_support.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/sh_styles_support.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)

> [!WARNING]
> Note:
> 
> Link [email](/desktop/docs/integrate-email-support-in-self-help), [chat](/desktop/docs/enable-live-chat-when-self-help-search-result-is-empty), and [ticketing](/desktop/docs/enableticketinginselfhelp) support when your end users get no results in Self Help.

1. In the **Smart features** section, enable [QuickRead](/desktop/docs/quickread-summarized-answers-in-self-help) and [Personalization](/studio/docs/personalization-1) for your end users based on their content usage history. ![personalization_quickread.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/personalization_quickread%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A39%3A40Z&se=2026-11-12T09%3A39%3A40Z&sr=c&sp=r&sig=D1WdTI4X63hrGHY29oeTeADKAFwn8xg6DhRq%2BhCvYMA%3D)
2. Click **Save**.

> [!WARNING]
> Note:
> 
> - Once previewed, you must perform a [Push to Production](/desktop/docs/publishing-content) for these changes to reflect for your end users.