> ## Documentation Index > Fetch the complete documentation index at: https://docs.guidinghand.ai/llms.txt > Use this file to discover all available pages before exploring further. # Website widget > Put your agent on your website with one script tag: a little character on a chat bar that opens into a chat. The widget puts an agent in the bottom right corner of your pages, as a chat bar. Under **Character** you can put a small pixel bot on the bar. While someone types, it follows the words along the bar. Press Enter and the bar grows into a chat. While the agent works, the character acts it out with one word beside it (**Thinking**, **Reading**, **Scouring**, **Writing**). When it runs a browser or computer task, the chat shows the task's [progress](https://docs.guidinghand.ai/concepts/conversations.md#progress): a bar and a few short steps written for the visitor, ticked off as the agent gets through them, with how long it's been going. Visitors see the agent's answers, the forms it shows them and that progress. They never see its tool calls, what its worker is doing at each moment, or its browser. ## Add it to your site 1. In the console, open the agent and go to **Widget**. Turn on **On your website**. 2. List the **Domains** that may show it, like `example.com`. Each domain covers its subdomains. Leave the list empty to allow any site. 3. Copy the snippet and paste it into your pages, before ``: ```html theme={null} ``` The **Widget** tab shows your own snippet, with these steps for each kind of site: | Your site | Where the snippet goes | | - | - | | Any site | Before `` on each page, or once in the layout your pages share. | | WordPress | Install the free **WPCode** plugin. In **Code Snippets → Header & Footer**, paste it under **Footer** and save. | | Shopify | **Online Store → Themes → ⋯ → Edit code**. In `layout/theme.liquid`, paste it just before `` and save. | | Webflow | **Site settings → Custom code**: paste it under **Footer code**, save, then publish the site. | | Google Tag Manager | Add a **Custom HTML** tag with the snippet, set its trigger to **All Pages**, then **Submit**. | | Next.js | In your root layout, add it with `next/script`, inside ``. | For Next.js: ```tsx theme={null} import Script from 'next/script'; ``` ## Share a link No website needed: turn on **Share link** in the agent's **Widget** settings and send the link (`https://guidinghand.ai/a/…`) to anyone. It opens a page that's only the chat with the published version. No one signs in, and the page can't be put in another site's frame. * **Off by default.** Turn it off and the link stops working at once; turn it on again and it's the same link. * **New link.** Makes a new address and ends the old one, for when a link has gone further than you meant. * **Same as the widget.** The same limits (counted together with the widget's), visitors see only their own conversations, and the chats appear in **Conversations** marked *share link* and are billed to your org like any other chat. ## How it works * **Isolated from your page.** The widget runs in an iframe, so your CSS can't change it and its CSS can't change your page. The iframe takes only the room the widget needs, and the rest of your page stays clickable. The iframe can only be shown on your listed domains: the browser enforces this with `frame-ancestors`. * **Visitors and their conversations.** Each visitor's browser keeps a random key and their conversation. When they come back to your site, the conversation is still there. **New chat** starts over. Only that browser can read or continue the conversation. * **In the console.** Widget conversations appear in **Conversations** marked *website*, with the site they came from. They are billed like any other chat, by tokens, to your org. * **Limits.** Each visitor can send 40 messages an hour, each network 120, and a widget answers up to 1,000 messages an hour across all its visitors. The widget accepts text messages and form answers. Visitors can't upload files. * **Coming back mid-reply.** If a visitor reloads or moves to another page while the agent is still answering, the widget picks the reply up when it finishes. * **On phones.** The widget rests as the character alone. Tapping it opens the chat full screen. Set the widget from code with [`GET` and `PATCH /v1/agents/{agent_id}/widget`](https://docs.guidinghand.ai/api-reference): `enabled`, `domains`, `character`, `placeholder` (the bar's text), `suggestions` (typing suggestions for visitors, on by default), `share` (the share link, `share_url` in the reply) and `new_share_link: true` (a new link, ending the old one). `character` is `none` (the bar alone, the default) or `bot` (the pixel support bot). This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.