Customize the appearance of Self Help

Customize the visual and layout aspects of the Improved Self Help widget in it’s open state.

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

  

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

  

• Layout: Configure the content layout within the Improved Self Help widget. The available options are Detailed and Minimal.

  

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

  

Customize the Header of the Improved Self Help widget in it’s open state.

• Color: Configure the header’s color using the color picker or by entering the hex code.

• Header Text: Customize the header text.

Note:

The Header Text can have up to 25 characters.

• Description: Customize the description text.

Note:

The Description can have up to 150 characters.

Customize the FAB of the Improved Self Help widget in it’s closed state.

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

  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.

  

• Color: Configure the FAB icon’s background color using the color picker or by entering the hex code.

  

• Size: Set the size of the FAB icon. The default size is a maximum of 56x56 px.

  

• Icon: Change the FAB 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. For more information on adding a custom icon, see Add an icon to Self Help.

  

• Icon Text: Customize the FAB icon text. This changes the text that appears when you hover your cursor over FAB. For more information, see Rename the Self Help widget.

  Note:

  The Icon Text can have up to 15 characters.

  

• Text and Icon color: Configure how Self Help text and the FAB icon appear when a background color is selected. Whatfix automatically adjusts colors to ensure contrast and visibility. The available options are:

  1. Light: Text and icons automatically turn white when you select a dark background.

  2. Dark: Text and icons automatically turn dark when you select a light background.

  

• Position: Change the default position of FAB. Choose one of the 12 available position options. FAB appears in this position for all end users. However, you can allow end users to change the position of FAB by enabling them to drag and drop it to their preferred location. To do this, enable the Allow drag-and-drop toggle. For more information, see Reposition the Self Help Widget.

  

• Allow drag-and-drop: Enable or disable the drag and drop toggle. This enables end users to freely move the FAB icon anywhere on their screen.