Sometimes a picture is worth a thousand words and your Tooltip may be more helpful if it includes a screen or an icon that simplifies understanding of certain concepts / rules / hints. This article covers a step-by-step procedure of creating a Tooltip consisting of text and screenshots.
To access a Launchers option in the Apty Studio:
|
1. Open the Apty Studio application and select the hosting application you plan to work with. The Apty Studio menu opens. 2. Click on the Tooltips icon. 3. The system will prompt you to create a Frame, unless it was created earlier. If the required Frame for this page was created earlier, select it from the list. |
 |
To create a Tooltip with an image:
1. On the Tooltips page click Create New Tooltip or the + (Plus) button at the top right corner of the screen. You are redirected to the Tooltip creator page.
2. Click Select Spotlight. The control is now passed to the application page in the browser. Select the input field or another interactive element that is supposed to be validated.
3. Compose your hint text. Tooltips may vary from simple one-line hints to a more complex instructions that may combine text, hyperlinks and images depending on the complexity of the task. The standard toolbar at the top of the text area allows adding text styles (bold, italic, header, alignment).
NOTE: If the toolbar at the top of the text area is invisible, click the text area and at the bottom right corner of the text area the T(Toggle Rich Text Editor) button appears, click it to access the styles toolbar.
4. To add an image to your Tooltip, click the 
icon on the toolbar. The Insert/edit image screen opens. To attach an mage to a Tooltip, define the following details:
- Source: Provide a source URL to the image. Your image should be posted and stored online to make it accessible to Apty.
- Image description: Provide an alternative text to the icon / image you are adding to the Tooltip.
- Dimensions: Since Tooltips are usually smaller in size, make sure that your image size is not too big. Define height and width of the image.
- Constraint Properties: Check this box if you want to safe the ratio of width to height and make sure they are proportionate and the image is not too stretched in height or width.
5. Provide the Name for your Tooltip element. It should be unique within the Frame it belongs to.
6. Define the button position:
- Apty offers 12 predefined positions to locate the balloon around the field it belongs to. The preview of the position is available on the hosting application in the live mode.
- Icon offset: Allows setting up the proximity of a balloon to a field.
7. Click Save to start using a new Launcher. It is now available as a part of a Frame in the Admin Console, but to make it active, the Frame should be in a published state. For more details refer to: Publishing Frames
Comments
0 comments
Please sign in to leave a comment.