Install guide: Angular

Add GetFoxChat to your Angular site

In src/index.html, the main HTML page of the app, just before </body>. The line loads the GetFoxChat chat bubble on every page, and the operator behind it answers your visitors from your own public pages.

Before you start: Access to the project's code and a rebuild and redeploy.

The line to add

Yours has your own site ID in place of YOUR_SITE_ID.

<script src="https://getfoxchat.com/widget.js" data-site-id="YOUR_SITE_ID" defer></script>

On Angular, this is what goes in src/index.html:

<script src="https://getfoxchat.com/widget.js" data-site-id="YOUR_SITE_ID" defer></script>

Add GetFoxChat to Angular, step by step

  1. In GetFoxChat, open the install step for your site and copy your snippet. It already has your site ID in it. No account yet? Create one free.
  2. Open src/index.html, the main HTML page served when someone visits your site. source
  3. Paste the GetFoxChat line just before </body> and replace YOUR_SITE_ID with your site ID. source
  4. Run ng build and deploy the new output. source
  5. Back in GetFoxChat, press Check my site. The chat switches on once GetFoxChat finds the snippet on your live pages.

Angular's own guide: Angular docs: Workspace and project file structure. Checked 2026-09-30; if Angular renames a menu, its guide has the current wording.

Angular gotchas

Removing it later

Delete the GetFoxChat script line from src/index.html, then rebuild and redeploy.

Checked against angular.dev (current Angular). Single-application workspaces keep the file at src/index.html; extra projects keep it under projects/<name>/src.

Find out what your visitors can't find

See the 5 questions your visitors are likely to ask that your pages don't clearly answer. Free, no account needed.

The chat starts as Foxy. Rename it and change the avatar anytime. Plans and what each includes: pricing.