> ## Documentation Index
> Fetch the complete documentation index at: https://docs.usechar.com/llms.txt
> Use this file to discover all available pages before exploring further.

# LiveView (Phoenix)

> Embed Char in Phoenix LiveView with a persistent root-level widget

Use `phx-update="ignore"` so LiveView does not re-render the agent element.

```heex theme={null}
<body>
  <%= @inner_content %>

  <div phx-update="ignore">
    <char-agent id="char-widget" publishable-key="pk_live_..."></char-agent>
  </div>

  <script>
    window.addEventListener("phx:page-loading-stop", () => {
      const agent = document.getElementById("char-widget");
      const idToken = window.currentUserIdToken;
      if (idToken) {
        agent.connect({ publishableKey: "pk_live_...", idToken });
      }
    });
  </script>
</body>
```
