> ## Documentation Index > Fetch the complete documentation index at: https://wiredesk.ai/docs/llms.txt > Use this file to discover all available pages before exploring further. # Install the widget > One script tag puts the chat bubble on every page of your site. `widget.js` is the only thing that goes on your site. It is about 6 KB gzipped, draws a launcher, and opens the conversation in an iframe. Paste it immediately before the closing `` tag of the layout every page shares: ```html theme={null} ``` Your widget key is on the agent's **Install** page, already filled in to the snippet there. A widget key is public — anyone can read it from your page source. To keep it from working elsewhere, set [allowed domains](/docs/widget/allowed-domains). The iframe is not created until a visitor shows intent — hover, focus, touch or click — so a page nobody chats on loads one small script and nothing else. Whether the panel is open is kept per tab, so clicking through to another page does not close a conversation in progress. ## By platform Paste the snippet immediately before `` in your site's layout or template. Publish, then load any page. 1. In your GTM workspace, choose **Tags → New → Custom HTML**. 2. Paste the snippet into the HTML box exactly as it is. 3. Set the trigger to **All Pages**, leave **Support document.write** off, then **Save** and **Submit** to publish the container. Install **WPCode** or **Insert Headers and Footers** and paste the snippet into the Footer / Body box. Or, in a child theme, add it to `footer.php` just before ``. Editing the parent theme works until the next update overwrites it. If your site caches aggressively (WP Rocket, LiteSpeed), purge the cache once after saving. 1. **Admin → Online Store → Themes → ⋯ → Edit code**. 2. Open **Layout → theme.liquid** and paste the snippet just above ``. 3. Save. Checkout pages are served separately — add the same line under **Settings → Checkout → Order status page scripts** if you want the widget there too. **Project Settings → Custom Code → Footer Code**, paste the snippet, save, then publish the site. Custom code only runs on the published site, never in the designer preview. **Settings → Advanced → Code Injection**, and paste the snippet into the Footer box. Needs a Business plan or above. In the Next.js App Router, add it to the root layout so it survives client-side navigation: ```tsx app/layout.tsx theme={null} import Script from "next/script"; export default function RootLayout({ children }) { return ( {children} ``` A second copy of the script on the same page does nothing, so a duplicate tag never draws a second bubble. ## It is not showing up Work through [the chat bubble is not showing up](https://wiredesk.ai/help/the-chat-bubble-is-not-showing-up) in the help centre. The usual causes are a tag manager container that was never published, a page cache serving the old HTML, or a page that is not on the widget's [allowed domains](/docs/widget/allowed-domains).