# Install with a script tag

A script tag adds a Web Agent to a site that has no build step. There are two snippets. **JS / Auto** starts the widget as soon as the page loads. **JS / Manual** loads the same code and waits for your call to `Faustine.init`, which you need to identify users or to start the widget after sign-in.

## Before you begin

- The agent has a version served on the environment the page loads. Publishing the first version serves it on the release target, which is the first environment you selected in the wizard.

## Add the auto-mount tag

To start the widget on every page that has the tag:

1. In the portal, go to [**Web Agents**](https://auth.faustine.ai/go?to=%2Fweb-assistants) and select your agent.
2. In the **Overview** tab, find the **Install the assistant** card and select the **JS / Auto** tab.
3. Select **Copy**.
4. Paste the snippet into your site's HTML, before `</body>`.

```html filename="index.html"
<script src="https://webagent.faustine.ai/embed?wid=<AGENT_ID>" async></script>
```

The agent's launcher appears on the page when it loads.

The tag also defines `window.Faustine`. On a page installed this way, `Faustine.open()`, `Faustine.close()` and `Faustine.toggle()` control the panel. `Faustine.identify` has no effect, because an identity is applied by `Faustine.init`. To identify users, use the manual snippet.

## Start the widget from your code

To decide when the widget starts:

1. On the **Install the assistant** card, select the **JS / Manual** tab.
2. Select **Copy**.
3. Paste the snippet into your site's HTML.

```html filename="index.html"
<script src="https://webagent.faustine.ai/loader.js"></script>
<script>
  Faustine.init({ agentId: '<AGENT_ID>' });
</script>
```

The first tag has no `async` attribute, so `Faustine` is defined when the second script runs. Nothing appears on the page until `Faustine.init` runs. Call it where it suits your app: after sign-in, after the user accepts cookies, or on certain pages only.

`init` returns a handle with `identify`, `open`, `close`, `toggle`, `logout` and `shutdown`. The same functions are on `window.Faustine`.

```html filename="index.html"
<script src="https://webagent.faustine.ai/loader.js"></script>
<script>
  const agent = Faustine.init({ agentId: '<AGENT_ID>' });

  fetch('/api/me')
    .then((res) => (res.ok ? res.json() : null))
    .then((me) => {
      if (me) agent.identify({ jwt: me.faustineJwt });
    });
</script>
```

`/api/me` stands for your own endpoint that returns the signed-in user with a token. To sign the token, see [Verify your users with a signed token](https://docs.faustine.ai/web-agents/verify-users/).

## Load another environment

A page loads the Production environment by default, or the agent's first environment while it has no Production. To load another one, name it in the snippet.

| Snippet | Change |
| --- | --- |
| **JS / Auto** | Add `&env=Staging` to the script URL. |
| **JS / Manual** | Pass `env: 'Staging'` to `Faustine.init`. |

## Troubleshooting

| Symptom | Cause | Fix |
| --- | --- | --- |
| `Faustine is not defined` in the console | The loader tag has `async` or `defer`, or the inline script comes before it. | Load `loader.js` with a plain script tag, before the script that calls `Faustine.init`. |
| The user stays anonymous after `Faustine.identify` | The page uses the **JS / Auto** tag. | Use the **JS / Manual** snippet and call `identify` after `init`. |
| No launcher, and the request to `webagent.faustine.ai/embed` returns `404` | No environment of the agent serves a version. | [Publish a version](https://docs.faustine.ai/web-agents/publish-a-version/). |
| No launcher, and the same request returns `403` | The page's domain is not in the environment's allowed domains. | See [Restrict the domains that can load the agent](https://docs.faustine.ai/web-agents/restrict-domains/). |

## Next steps

- [JavaScript API](https://docs.faustine.ai/reference/javascript-api/): the options of `init` and the methods of the handle.
- [Verify your users with a signed token](https://docs.faustine.ai/web-agents/verify-users/): sign the token that `identify` sends.
- [Use your own launcher button](https://docs.faustine.ai/web-agents/custom-launcher/): open the panel from a button of your app.
- [Installation](https://docs.faustine.ai/web-agents/installation/): the other install methods.