Create Tooltips

Create Tooltips to communicate additional information to your users about the elements in your application using the following steps.

1.   Log in to the Apty Studio after loading it on your web browser.

2.  Click Select Application.

select application-1

3.  Choose the application you want to work with.

Note:

  • Ensure that you have added your applications to the Admin Portal before creating any content on it. 

4.  Once the application opens, select Tooltips on your Apty Studio.

tooltips

Note:

Ensure that your application is connected with the Apty Studio to seamlessly create Apty content. A connected application is indicated by a green icon. If the icon appears red, refresh your Apty Studio to reconnect with your application.

  Connected Not Connected
Apty Studio connected studio not connected studio
Browser Toolbar connected browser not connected browser

 

5.  Select a Frame to start creating Tooltips on your application page.

tooltip frame

 

Note:

  • Each page in your application must have a unique Frame connected with the Apty Studio to create Apty Content like ValidationsLaunchersTooltips, and Announcements
  • The Tooltips screen will prompt you to create a new Frame, unless it was created earlier, in which case Apty Studio will connect to one automatically. You can also choose a different Frame from the list of Frames that are already on the page. To understand the importance of Frames in the creation of Apty Content, see What are Frames.
 

6.  Click the + icon or Create New Tooltip button to start creating a Tooltip.

7.  Click Select Element on your Apty Studio and then hover you cursor over the element you want to select on your application.

Note:

Element Selection is a default selector when the user creates a new Tooltip. However, you can choose one of the following advanced selectors from the drop-down:

  • Custom Script
  • CSS Selector
  • XPath
  • Text Selection

For additional information on how advanced selectors work, see Advanced Element Selectors.

8.  Enter the Tooltip description and name in the input fields in your Apty Studio.

Note:

You can also combine hyperlinks, images, and videos with the Toltip text to enhance user experience on your application by capturing user's attention, presenting information in a more digestible way, and helping them navigate to the page they are interested in.

To learn more, see Add a Link, Image, or Video to the Tooltip.

9.  Under ICON POSITION, choose the desired Tooltip position.

icon position

Info:

You can use the Icon Offset bar to set up the display proximity of a balloon on the application page.

10. Select the THEME for your Tooltip from the drop-down.

themes wf

Info:

To learn how to create new themes, see Themes (Version 4.x).

11. Under AUTO PLAY, check the trigger notification box to auto display the Tooltip after a specific time of user inactivity.

autoplay tooltip

12. Set Display Conditions for announcements to control when and how they appear based on user criteria.

To learn more, see Visibility Rules and Display Conditions

Note:

  • Trigger Notification helps to nudge the user and assist them in completing the task when the user becomes inactive for a few seconds on your application.
  • You can select the time period from the dropdown to display the Tooltip. For example, when a user initiates an action on your application and then stays inactive for 5 seconds, you can configure the Tooltip to display on the user's screen after 5 to 30 inactive seconds to prompt them to finish the process.
  • The Trigger Notification will only work on HTML input fields and HTML select dropdowns (the elements which have focus event).

12. Select a segment to display your Tooltip for a specific user group in that segment.

segment wf

Note:

  • If no segments are selected, the Tooltip will be visible to all users on the application.

13. Check the Display between dates box to schedule the display of your Tooltip in the specified time zone between the specified dates.

schedule opt

14. Click Save.

Once you create a Tooltip, you can make it accessible for your end users by publishing it either through the Admin Portal or the Apty Studio.