Customize Tooltip
- 04 Apr 2023
- 3 Minutes To Read
- Print
- DarkLight
- PDF
Customize Tooltip
- Updated On 04 Apr 2023
- 3 Minutes To Read
- Print
- DarkLight
- PDF
Article Summary
Share feedback
Thanks for sharing your feedback!
After creating a Tooltip, you can customize it based on your requirements.
You can customize the following in a Tooltip,
- Add Body and Header content
- Add images, and GIFs
- Add buttons and attach external and deep links
your title goes here
The customization options differ based on the Tooltip template you choose.
On the Whatfix Mobile Studio, choose a Tooltip template, and then click the Tooltip to configure the following,
Header
Under the Header section, you can edit the Header text, change the font, font size, font weight, text alignment, text color, and bottom margin. You can also add user property to personalize the experience for your end user.
You can align the Header to the top or bottom, add any content block, or delete the Header section using the action bar
Body
On the Body of the Tooltip, you can edit the text, font, font size, font weight, text alignment, text color, and bottom margin. You can also add user property to personalize the experience for your end user.
You can align the Body text to the top or bottom, add any content block, or delete the Body section using the action bar
Topspacer
You can increase, decrease, or delete the Topspacer using the action bar.
Media
- Under the Media section, you can click the Edit icon to add images and GIFs to your Tooltip from your local drive and then configure the image size, alignment, and bottom margin.
your title goes here
The image formats supported are .jpg, .png, and .svg.
Enable the CLICK ACTION toggle to link any action to your image. Clicking the image triggers the action that you configure.
Button Action Description Dismiss When the user clicks the media, the Tooltip is dismissed from the app screen External Link When the user clicks the media, they are routed to the URL that is attached to the media Deep Link When the user clicks the media, they are routed to the app screen within the same app that is attached to the media
your title goes here
You can provide a name for the action you add to your media using which you can track the analytics on how many users are clicking the media.
You can align the Media to the top or bottom, add any content block, or delete the Media section using the action bar.
Buttons
You can customize the button that appears on your Tooltip. You can choose to have one or two buttons, adjust the button width, alignment, height, radius, and the bottom margin.
Click the BUTTON dropdown to customize the individual buttons. You can change the button color, stroke of the button outline, text, font family, font size, font weight, and button action. You can also add user property to personalize the experience for your end user.
The following are the Button Actions you can configure,
| Button Action | Description |
|---|---|
| Dismiss | When the user clicks the button, the Tooltip is dismissed from the app screen |
| External Link | When the user clicks the button, they are routed to the URL that is attached to the button |
| Deep Link | When the user clicks the button, they are routed to the app screen within the same app that is attached to the button |
- You can align the Buttons to the top or bottom, add any content block, or delete the Buttons using the action bar
Layout
- In the navigation bar, click Layout to enable Overlay, change the Tooltip color, Tooltip size, and add Ripple Effect.
your title goes here
- You can also click the Edit icon to do the same.
You can change the Fill Color of the Overlay and enable your end user to dismiss the Tooltip by clicking the Overlay.
If you anchor your Tooltip to an element on the screen, you can change the shape and radius of the highlighted element. You can also enable your end users to dismiss the Tooltip by clicking the anchor element.
Click Done.
your title goes here
You can preview projects on your device before making it live for your end users.
After creating and designing the Tooltip, click Publish to make the Tooltip live for your end users. For more information on publishing Whatfix Mobile content, see Publish Whatfix Mobile content.
Was this article helpful?