Before you start
- An AtomicX account. The free plan works; add AI when you're ready.
- Umbraco 13 or later.
- A backoffice user with access to the Settings section.
- Live sites in Production runtime mode (and Umbraco Cloud live) can't edit templates in the backoffice. Make the change in your code or development environment and deploy.
1. Copy your snippet from AtomicX
- Sign in to AtomicX and go to Insights › Widget generator.
- Under 1. Select Configuration, choose the chat you want on this site.
- Pick 2. Display Mode (Floating corner bubble or Full Page), 3. Button Position and 4. Widget Theme. The Live Preview shows the result.
- Under 5. Integration Method, choose Auto-Initialize. It's one snippet that starts the chat when the page loads.
- Under 6. Generated Code, click Copy.
2. Add it to Umbraco
- Log in to the Umbraco backoffice and open the Settings section.
- Under Templates, open your master layout template (the one other templates use as their master).
- Find the closing
</body>tag and paste your AtomicX snippet on the line just above it. - If the snippet contains an @ sign, write it as @@. Templates are Razor, where @ means code.
- Click Save.
There's no publish step for templates. Purge any CDN or output cache in front of the site.
3. Check it works
- Open your site in a private or incognito window, so you're not seeing a cached or logged-in version.
- Look for the chat button in the corner you picked.
- Ask it a question you know the answer to. Then check the conversation appears in Conversations in your AtomicX dashboard.
Good to know
- Edits made on a staging or development server are overwritten by the next code deploy unless they're also in source control.
- Sites with more than one master template need the snippet in each.
Update or remove it
Open the master template again, remove or replace the snippet, and save (or change it in code and redeploy).
If something isn't right
- No chat button? Clear your site's cache, check you published or saved, and try a private window with ad blockers off.
- Two chat buttons? The snippet is installed twice, for example in your site and in Google Tag Manager. Keep one.
- Still stuck? Contact us and tell us your platform and site address.
Official Umbraco documentation: Umbraco: Templates
