> For the complete documentation index, see [llms.txt](https://docs.supademo.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.supademo.com/customize/hotspot/invisible-hotspots.md).

# Invisible Hotspots

### What are invisible hotspots?

Available on HTML-based Sandbox Supademos, invisible hotspots allow you to make specific HTML elements clickable without any visual cues — helping you create a realistic, Sandbox experience.

Here's an example of a example Sandbox demo with invisible hotspots:

{% @supademo/embed demoId="cm8mktzxw0ijcxffbc3pjewnk" url="<https://app.supademo.com/demo/cm8mktzxw0ijcxffbc3pjewnk>" %}

As you'll notice in the above example, there are several invisible hotspots added within the HTML content, allowing users to click through and interact with specific elements on the screen.&#x20;

When they click an element(s) that are not interactive or have a hotspot, a **visual cue is shown to** highlight the interact-able elements.

### Adding or editing an invisible hotspot

**To add an invisible hotspot, simply:**

1. Click into Edit mode in any HTML Supademo&#x20;
2. Just below the demo window, click on **Sandbox Mode**
3. Click on any Element in your recorded window; then under **"Link to Step"** choose the Step you want to connect the element to.
4. Repeat this as many times as you'd like to make specific elements interactive but invisible
   1. To edit an *existing invisible hotspot*, click on the existing green link, to update the connected step.&#x20;
5. Click **Save** on the top right corner of the window to save your changes.&#x20;

You can use invisible hotspots to set up a sandbox-like experience. Alternatively to set up a full sandbox experience, we recommend using **Sandbox Mode** via the below tutorial:

{% @supademo/embed demoId="cmbxxl3azgkoesn1rm78j3k8z" url="<https://app.supademo.com/demo/cmbxxl3azgkoesn1rm78j3k8z>" %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.supademo.com/customize/hotspot/invisible-hotspots.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.