Guides and Surveys - Smart Tips

Smart Tips are interactive tooltips that provide contextual explanations exactly where users need them. They can appear as small pieces of text triggered when a user hovers over, clicks, or focuses on an element. Use Smart Tips to highlight new features, guide data entry, or explain lesser-used functions without interrupting the user's workflow.

This article covers the following:

• Creating a Smart Tip
• Hotspot beacons
• Smart Tip settings
• Reporting
• Frequently Asked Questions

Creating a Smart Tip

1. After navigating to Guides and Surveys, select Smart Tips from the sidebar.
2. Click Add Smart Tips.
3. Click Add Tip and give it a name.

Select an element

4. Use the Select Element button to choose the specific element your Smart Tip will be attached to. For more about element selectors, see Guides and Surveys: Finding Element Selectors on Your Website.

Orientation and close behavior

5. Choose the placement of your Smart Tip relative to the element (for example, top, bottom, left, or right).
6. Configure the Close on behavior:
   • Automatically - the Smart Tip will close automatically based on the trigger event.
   • Clicking on the Close Button - allows users to manually close the Smart Tip by clicking a close button.

Triggers

7. Choose a trigger for displaying the Smart Tip:
   • Mouseover element - when a user moves the cursor over the element.
   • Click on element - when a user clicks on the element.
   • Focus on element - when a user focuses on an input field.

Hotspot beacons

The hotspot beacon is an optional feature that highlights the location of a Smart Tip with an attention-grabbing visual indicator. When enabled, a beacon appears on the element to draw users' attention to discover more information.

Beacon styles

The hotspot beacon supports three styles:

• Pulsating point - a subtle animated dot.
• Question mark - a visual cue suggesting additional information.
• Information icon - a classic "i" icon indicating details.

To select the beacon style, use the Icon option in the Smart Tip settings. This option is only available when the beacon is enabled.

You can customize the appearance of the pulsating point (such as its color and size) using Custom CSS in a Theme.

Beacon positioning and offset

Beacons are positioned on the element in one of four locations:

• Top - above the element.
• Bottom - below the element.
• Left - to the left of the element.
• Right - to the right of the element.

By default, the beacon appears at the middle right position over the element, at the rightmost point on the horizontal axis. If the element is small, the beacon may overlay it.

To adjust the beacon position, use the Offset adjustment fields:

• Horizontally - a positive number moves the beacon to the right; a negative number moves it to the left.
• Vertically - a positive number moves the beacon upward; a negative number moves it downward.

The default values of 0 and 0 represent the default beacon position on the element.

Alignment

You can control where the Smart Tip bubble appears relative to the beacon or the element:

• Align to Beacon - the Smart Tip bubble will appear next to the beacon.
• Align to Element - the Smart Tip bubble will appear next to the element.

Advanced trigger options

When a beacon is enabled, you can configure what the user must interact with to trigger the Smart Tip:

• Targeting the Element - the Smart Tip bubble will appear when the user interacts with the element (for example, click or hover).
• Targeting the Beacon - the Smart Tip bubble will appear when the user interacts with the beacon.
• Both - combine element and beacon targeting for better flexibility.

Smart Tip settings

In the Settings, you can define where and how often the Smart Tip will show:

• Show to User - choose whether the Smart Tip is displayed every time the conditions are met or only once per user.
• Page Targeting - limit the Smart Tip to specific pages or conditions (more info in Page Targeting).
• If you have a custom Theme, you can assign it to your Smart Tip.

Reporting

While viewing a Smart Tip, click the Analyze tab in the top center of the page. Click Build to go back to building your Smart Tip.

Smart Tip reports help you measure visibility and engagement. On the Analyze view you can see:

• Assists (last 30 days): How many times users interacted with the Smart Tip in a way that counted as a successful assist (for example, opening the tooltip or dismissing it after reading).
• Views: How many times the Smart Tip was displayed (rendered on screen) to users. Use this to gauge visibility and reach.

The report includes a performance Overview chart showing daily assists and views over the selected time range, and a detail table with per-tip views so you can compare which tips are seen and engaged with most.

Additional reporting options:

• To filter by user segment or time period, or to export data, see Guides and Surveys: Reporting.
• For deeper analysis in Fullstory, Smart Tip events and properties are described in Guides and Surveys: Custom Events and Properties — Smart Tip.

Frequently Asked Questions

What is a hotspot beacon?

A hotspot beacon is an optional visual indicator (such as a pulsating dot, question mark, or information icon) that highlights the location of a Smart Tip on an element, drawing users' attention to discover more information.

How do I move a beacon that is overlapping text?

Use the Offset adjustment fields in the beacon settings. Enter a positive or negative number in the Horizontally and Vertically fields to shift the beacon away from its default position.

How do I clone or duplicate a Smart Tip?

At the Smart Tips page, click the 3 dots (…) next to the Smart Tip you wish to duplicate, and select Clone Smart Tip. For Umbrella accounts, users who have been added to additional Fullstory accounts will see an option to select a destination space, which represents the Fullstory accounts which the user can access.