> For the complete documentation index, see [llms.txt](https://help.usejimo.com/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.usejimo.com/docs/experiences/hints.md).

# Hints

Pin always-on tips to elements of your app: when to use hints, how to create a hint group, and how the builder is organized.

## What are hints?

Hints are **targeted tips,** anchored to specific UI elements the same way as tooltips. Unlike Tours or Surveys, they’re non-sequential and **all displayed simultaneously**, acting like a persistent layer of guidance.

This approach is perfect for **inline help**, **feature discovery**, or **self-paced onboarding**, where users can hover or click to see more info at their own pace.

**You will have at the end:** a hint group created from a template or from scratch, each hint attached to an element of your app and ready to target and publish.

***

## When to use hints

| You want to                                                    | Use                                                                                                |
| -------------------------------------------------------------- | -------------------------------------------------------------------------------------------------- |
| Explain elements of a page that users can explore in any order | Hints                                                                                              |
| Walk users through steps in a fixed order                      | A tour with tooltip and hotspot steps, see [Tours & Modals](/docs/experiences/tours-and-modals.md) |
| Give users a list of tasks to complete                         | [Checklists](/docs/experiences/checklists.md)                                                      |
| Show one short message across the page                         | [Banners](/docs/experiences/banners.md)                                                            |

## Anatomy of a hint group

<figure><img src="https://2794860263-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FKzAcDWQbK1gKbpra7bkb%2Fuploads%2Fi8DpKqjVP3PNeAfPHqcy%2Fhint-01-anatomy.png?alt=media&amp;token=d2734a29-180a-41ab-baf2-0c11ed687b4f" alt="A neutral app mock with three elements outlined: an icon hint on Reports with its card open, a New label hint on Export, and a Take the tour button hint under Filters. Numbered labels name each hint type, the card and the target element."><figcaption><p>A hint group: every hint is pinned to an element and all show at once.</p></figcaption></figure>

* **Hint group:** what you create. All its hints share the same targeting settings and show at the same time; their order is only for organizing.
* **Hint:** pinned to one element of your app. Its type (Icon, Label, Target element or Button) sets what users see and whether a card opens.
* **Card:** opens from an Icon, Label or Target element hint. It holds text, media and buttons.
* **Button hint:** a button with no card. A click runs its action, for example launching a tour.

The four types side by side are in [Hint components](/docs/experiences/hints/components.md).

## Target it

<figure><img src="https://2794860263-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FKzAcDWQbK1gKbpra7bkb%2Fuploads%2FSifCcqCvx9j979Ix004b%2Fhints-04-no-show-on.png?alt=media&amp;token=2e5bcb56-d49a-40e7-81e8-0b75a9154c30" alt="Three condition cards, Where, Who and Element, each marked Applies, lead to a result card Hints show. A strip below shows Show on crossed out and marked Does not apply to hints."><figcaption><p>Hints have no Show on: Where, Who and the element decide.</p></figcaption></figure>

Hints have no [Show on](/docs/publish/trigger-on-the-right-spot-show-on.md) section: there is no trigger to pick. A hint shows on its element, on the pages set in [Where](/docs/publish/target-specific-urls-domains-where.md), to the users set in [Who](/docs/publish/target-right-people-who.md).

| Condition | For hints                                                                                                        |
| --------- | ---------------------------------------------------------------------------------------------------------------- |
| Where     | The pages the hints can show on                                                                                  |
| Who       | The users who see them. Conditions on the segment can drop users from it, and those users stop seeing the hints. |
| Element   | Each hint shows only where its element exists. If the element is not unique, every matching element is targeted. |
| Show on   | Does not apply to hints                                                                                          |

#### When the element is not on the page

<figure><img src="https://2794860263-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FKzAcDWQbK1gKbpra7bkb%2Fuploads%2F96ppoSTPlKRuj3MubY06%2Fhint-03-element-missing.png?alt=media&amp;token=d67912fb-9472-4c6d-a738-2c0988aca36b" alt="Two app mocks side by side. On the reports page the Export button is there and the hint shows next to it; on the settings page there is no Export button and no hint. A tip below advises pinning hints to stable elements or a data-jimo-id attribute."><figcaption><p>No element on the page, no hint.</p></figcaption></figure>

A hint pinned to an element only shows on pages where that element exists. To avoid display issues, pin hints to fixed elements, or give the element a unique identifier such as a `data-jimo-id` attribute. How to pick the element is in [Positioning](/docs/build/positioning.md); for elements that change from one deploy to the next, see [Targeting on dynamic apps](/docs/build/positioning/targeting-on-dynamic-apps.md).

***

## Overview

### Tutorial: first hints

{% embed url="<https://youtu.be/zsp8F-hE-Fc>" %}
First Hints
{% endembed %}

* **Always-On Guidance:** All hints appear together, so users can explore them as needed without moving step by step.
* **UI-Integrated:** Attach each hint to a targeted element, such as a button or icon, making help seamlessly integrated into your product.
* **Optional Entry Points:** Hints can link out to other experiences (e.g., a Tour or Survey) for users who want deeper context.

***

## Use cases

Explore our [demo website](https://explore.usejimo.com/dashboard) to see Hints in action. Choose between different experience examples to see how multiple hints can be **effectively scattered** in context.

<figure><img src="https://2794860263-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FKzAcDWQbK1gKbpra7bkb%2Fuploads%2FzkNblIGVFbpotI48AhAG%2Fimage.png?alt=media&amp;token=3a9edacb-8a72-4add-9ad5-31818cc22bea" alt=""><figcaption></figcaption></figure>

* **Inline Help:** Provide immediate clarifications or definitions near key UI elements.
* **Self-Guided Onboarding:** Let users discover relevant tips on demand, rather than a mandatory tour.
* **Contextual Reminders:** Highlight underused or advanced features with subtle nudges.

***

## How to access

1. **Navigate to Experiences:**\
   From your [Jimo dashboard](/docs/build/dashboard.md), go to [**Hints**](https://i.usejimo.com/hints).
2. **Create or Select Hints:**
   * **First-Time Users:** Click **"Create Your First Hints"**.
   * **Returning Users:** Click the **+ New Hints** button in the top-right corner.<br>
3. **Choose a Template or Start from Scratch:**
   * **Templates:** Select from prebuilt hint layouts for common use cases.
   * **From Scratch:** Create your own hints set, customizing each hint as desired.<br>

***

## Main features

Jimo’s Hints come with a **robust set of tools** that let you create **simultaneous, context-sensitive tips** across your UI. Below is an overview of how Hints work. For a detailed breakdown of hint types, styling, and positioning, visit our [**Hints Components** **page**](/docs/experiences/hints/components.md).

### Builder

Since Hints don’t follow a step-by-step flow, you won’t see a Flow Builder tab, only the **Content Builder**.

All hints are managed in a **single tab** interface, where you can add or remove hints via a top bar. Ordering them here doesn’t affect user flow, each hint displays independently on the page.

<figure><img src="https://2794860263-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FKzAcDWQbK1gKbpra7bkb%2Fuploads%2FLYq9sQ4acZiflYP05toE%2Fimage.png?alt=media&amp;token=1dea7274-e2b8-4762-b5b6-305dd8def357" alt=""><figcaption></figcaption></figure>

<details>

<summary><strong>Name and Back Button (A)</strong></summary>

* **Edit Name:** At the very top, you can edit the name of your hints group for easy identification.
* **Back to Dashboard:** Use the arrow next to the name to quickly return to the [Dashboard](/docs/build/dashboard.md) overview of all your hints groups.

</details>

<details>

<summary><strong>Step Manager (B)</strong></summary>

When you create a new Hint, you’re actually creating a **hint group** that shares the same targeting settings.

*Since all hints within the group display simultaneously, their order is purely for organizational purposes.*

From the **Step Manager** at the top of the builder, you can:

* **Delete Hints**: Hover over a hint and click the trash icon to remove it.
* **Add New Hints**: Click the `+` button to create a new hint. You’ll be prompted to select its type. See [components types](/docs/experiences/hints/components.md).
* **Reorder Hints**: Drag and drop hints within the manager to rearrange them for better organization.

</details>

<details>

<summary><strong>Action Buttons (C)</strong></summary>

* **Save:** Secure your progress with the 'Save' button, which also saves your work automatically at regular intervals.
* [**In-App Editor:**](/docs/build/builders/in-app-builder.md) Visualize and edit the hints within the context of your actual website by indicating the starting point URL.
* [**Preview:**](/docs/build/preview.md) See how your hints appear and behave.
* [**Target & Publish:**](/docs/publish/target-and-publish.md) Set the criteria for who will see the hints and when they will be displayed.

</details>

### Content Builder

Within the [Content Builder](/docs/build/builders/content-builder.md), you’ll **attach** each hint to a UI element and **customize** its text, icon, and basic behaviors. This central pane ensures you can configure all hints in one place, keeping the process streamlined while letting you match your brand’s style.

<figure><img src="https://2794860263-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FKzAcDWQbK1gKbpra7bkb%2Fuploads%2FV3XAb7VbLkaHYkHqrScM%2Fimage.png?alt=media&amp;token=307430f4-9671-465a-9835-dc737b1a7122" alt=""><figcaption></figcaption></figure>

<details>

<summary><strong>Properties Sidebar: Elements Editor (A)</strong></summary>

* **Modify Attributes:** Adjust positioning, styling, and animations for the currently selected element in the navigator.

</details>

<details>

<summary><strong>Builder Menu (B)</strong></summary>

* [**Navigator:**](/docs/build/navigator.md) Manage and edit elements within the hint.
* [**Themes:**](/docs/build/theme.md) Apply consistent styling across your hint.
* [**Translations:**](/docs/build/multiple-languages.md) Manage multi-language versions.

</details>

<details>

<summary><strong>Navigator (C)</strong></summary>

* **Element List:** See all elements in the hint, with the selected element highlighted.
* **Element Selection:** Click to edit specific elements via the Properties Sidebar.

</details>

<details>

<summary><strong>Live Step Preview (D)</strong></summary>

* **Real-Time Editing:** View and edit elements in the central preview.
* **Element Interaction:** Click on elements to modify content directly.

</details>

<details>

<summary><strong>Target element (E)</strong></summary>

* [**Positioning:**](/docs/build/positioning.md) Use the quick access pop-up to pick the element your hint attaches to in your app, or enter a CSS selector. Adjust the position from the step parameters in the sidebar.

</details>

***

## Best practices

{% stepper %}
{% step %}
**Don’t Overcrowd**

Too many hints can overwhelm users; focus on the most crucial tips.
{% endstep %}

{% step %}
**Keep Them Subtle**

Hints should feel like helpful signposts, not distracting pop-ups.
{% endstep %}

{% step %}
**Use Clear Labels**

Provide short, descriptive text that instantly clarifies an element’s purpose.
{% endstep %}

{% step %}
**Offer Deeper Links**

Allow hints to link to a more in-depth Tour or documentation if users want more details.
{% endstep %}

{% step %}
**Segment Wisely**

Show hints only to the relevant audience (e.g., novices, advanced users) for maximum relevance.
{% endstep %}
{% endstepper %}

***

## From your assistant

Ask:

> Add a hint on the Compose button of /f/inbox that says Start a draft from here, for new users only.

The assistant asks you to capture the button in your app, checks that the capture matches one element (if it matches several, it asks for a more specific element or a `data-jimo-id` on it), then drafts the hint with its title, text and button. It never takes a CSS selector. The preview link opens your app with the hint on the button. The hint type, icon and effects stay in the builder. More in [What to ask?](/docs/integrations/mcp/what-to-ask.md)

## Verify

* Open the [Preview](/docs/build/preview.md) on the page you target and check that every hint sits on its element.
* A hint missing on a page: check that its element is on that page (see [Target it](#target-it)), then see [Why my experience does not show](/docs/getting-started/publish-your-first-experience/why-my-experience-does-not-show.md).

***

## Go further

* [Hint components](/docs/experiences/hints/components.md): the four hint types and every setting.
* [Positioning](/docs/build/positioning.md): attach a hint to the right element and keep it there.
* [Content Builder](/docs/build/builders/content-builder.md): how the builder screen is organized.
* [Target & Publish](/docs/publish/target-and-publish.md): choose who sees the hints and when.
* [Themes](/docs/build/theme.md): keep hints consistent with your other experiences.
* [Where](/docs/publish/target-specific-urls-domains-where.md): the pages hints can show on, and what happens with an element that is not unique.
* [Who](/docs/publish/target-right-people-who.md): the users who see the hints.
* [Show on](/docs/publish/trigger-on-the-right-spot-show-on.md): the triggers other experiences use; hints have none.
* [Targeting on dynamic apps](/docs/build/positioning/targeting-on-dynamic-apps.md): keep hints on their element when your front-end changes.
* [Experience links](/docs/build/actions/experience-links.md): what a Button hint holds when it launches another experience.
* [Metrics by experience type](/docs/analyze/analytics/metrics-by-experience-type.md): what the hint statistics count.
* [Why my experience does not show](/docs/getting-started/publish-your-first-experience/why-my-experience-does-not-show.md): the causes to check, one by one.
* [Troubleshooting](/docs/settings/troubleshooting.md): the tool that lists why an experience shows or waits.
* [Tours & Modals](/docs/experiences/tours-and-modals.md): when tips must follow a fixed order.
* [Checklists](/docs/experiences/checklists.md): a list of tasks, which a Button hint can open.

**Next page:** [Hint components](/docs/experiences/hints/components.md)