NudgeDocs

Install the website agent

One line of code, pasted once on every page of your site. Everything else is set in the Nudge app, without touching the code again.

How it works

The Website Agent lives in a small widget: the chat bar at the bottom of your pages. To put it on your site, you paste one line of code (the snippet) once, in the part of your site shared by every page. That is the whole installation.

The snippet only says which widget to load: your workspace and your form. Everything else (appearance, the pages where the widget appears, display rules) is read from Nudge each time a page loads. When you change a setting in the app and publish it, your site picks it up on its own, within a few minutes. You never paste the code again.

Before you start

  • A Nudge workspace. Onboarding creates the conversational form the widget runs on. The widget always belongs to a form.
  • Access to your site's code, or to the "custom code" settings of your site builder.
  • An active plan or trial. Without one, the snippet loads nothing (see Verify the installation).

The snippet

It looks like this, with your own workspace and form in place of the two values:

<script src="https://app.asknudge.ai/widget/loader.js"
  data-org="your-workspace"
  data-form="your-form" async></script>
AttributeWhat it is
srcThe Nudge loader. Always https://app.asknudge.ai/widget/loader.js.
data-orgYour workspace identifier, the one in your app URL (app.asknudge.ai/w/your-workspace).
data-formThe identifier of the form the widget runs.
asyncLets your page load without waiting for the widget. Keep it.

Always copy the snippet from the app instead of typing it: it then holds the right values.

Where to copy it

The same snippet is shown in several places in the app. Use whichever is closest:

  • Onboarding, last step: Install the agent on your site. Pick your tool, copy the code, and check the installation from the same screen.
  • Agents › Website Agent › On your site: on the Widget row, click Copy the snippet.
  • Agents › Website Agent › Customise (the Appearance screen): the Installation code card, with Copy the code.
  • Settings › Integrations › Website: pick WordPress, Webflow, Framer, Google Tag Manager or Code snippet. Each one shows the snippet with the path to follow in that tool.
  • Forms › your form › Share: the Embed code of that form, with its Direct link.

Where to paste it

Paste the snippet once, in the code shared by all your pages:

  • just before the closing </body> tag, or
  • in the "custom code" or "footer code" area of your site builder.

The end of the <head> tag works too: the widget waits for the page to be ready.

Then publish your site. Most builders only run custom code on the published site, not in their editor or preview.

Paste it only once

Do not paste the snippet on each page separately, or twice in the same page (for example in the theme and in a plugin). One copy in the shared code is enough.

Inline mode

By default, the widget is the chat bar at the bottom of the page and needs no space in your layout. If a form is set to the Inline embed display mode, the snippet comes with a container: put the div where the form must appear in the page.

<div data-nudge-embed></div>
<script src="https://app.asknudge.ai/widget/loader.js"
  data-org="your-workspace"
  data-form="your-form" async></script>

The app adds the div to the copied snippet for you when the form uses that mode.

Step-by-step guides

After installing

  1. Open a page of your published site once, in a normal browser window.
  2. Back in the app, click Re-check installation. The status changes to Live as soon as a page of your site has loaded the widget.

Details, statuses and fixes for common problems: Verify the installation.

If your site sends a Content Security Policy, it may block the widget until you allow Nudge: see Content Security Policy (CSP).

Good to know

  • One site, one domain. Install the snippet on the website you gave Nudge during onboarding. The chat is tied to that site (with or without www). To run the widget on another domain, contact support.
  • Where it shows. To hide the widget on some pages (checkout, client area…), add URL patterns under Where it appears on the Appearance screen. You do not need to remove the snippet from those pages.
  • Older snippets keep working. Snippets copied before the current version (with ?v=5 or design attributes such as data-color) still work. The settings saved in the app take precedence over those attributes.
  • Nothing to update. Nudge ships widget updates on its side. Your snippet stays the same.

On this page