> ## Documentation Index
> Fetch the complete documentation index at: https://docs.unifygtm.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Website tag

> Set up the Unify Intent client on a marketing website.

## Installation

You can automatically load and install the client by placing a `<script>` tag in the `<head>`
or `<body>` of your website's HTML. The minified script can be found [here](https://app.unifygtm.com/dashboard/settings/integrations/unify-intent-client)
in Unify.

```html index.html theme={null}
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <!-- Your Unify JavaScript tag here -->
  </head>
  <body>
    <!-- Or here... -->
  </body>
</html>
```

<Warning>
  Be sure to only initialize the client one time on your website.
</Warning>

Once added, it will start collecting page visits automatically. Often, no
further setup is required unless you wish to track visitor interactions
manually. For more details, see [Usage](#usage) below.

### Content Security Policy

If your site has a content security policy defined, you will need to modify
two of the policy's directives to permit the Unify client to load and function:

* Add `https://tag.unifyintent.com` to the `script-src` directive
  * This allows your site to load and execute the script which installs the Unify client
* Add `https://api.unifyintent.com` to the `connect-src` directive
  * This allows the Unify client to make requests to the Unify API

Here is an example content security policy definition. Yours will likely contain additional
values beyond the ones defined here:

```http theme={null}
Content-Security-Policy:
  default-src 'self';
  script-src 'self' https://tag.unifyintent.com;
  connect-src 'self' https://api.unifyintent.com;
```

### Additional instructions

If you're using one of the tools below, you can follow the provider-specific
instructions for that tool to install the website tag.

<AccordionGroup>
  <Accordion title="Google Tag Manager">
    Follow these steps to install the website tag using Google Tag Manager:

    1. Log in to your Google Tag Manager account.
    2. Select the container associated with your website.
    3. Click **Tags** in the left sidebar, then click **New**.
    4. Click **Tag Configuration** and select **Custom HTML**.
    5. Copy the website tag script from the Unify [settings page](https://app.unifygtm.com/dashboard/settings/integrations/unify-intent-client)
       and paste the website tag snippet into the HTML field.

    <Frame>
      <img src="https://mintcdn.com/unify-19/hCdysogYM6qFbUs-/images/developers/intent-client/google-tag-manager-install.png?fit=max&auto=format&n=hCdysogYM6qFbUs-&q=85&s=70b042e703a2fa60a96e4ab8ec8389c7" width="3456" height="1818" data-path="images/developers/intent-client/google-tag-manager-install.png" />
    </Frame>

    6. Under **Triggering**, select **All Pages**.
    7. Save the tag.
    8. Click **Submit** to publish the container.
    9. Visit your website and confirm the tag is firing correctly.

    Lastly, be sure to enable support for `document.write` in the tag settings.
    This is required for the website tag to work correctly.

    For more information, see the official Google Tag Manager support docs
    [here](https://support.google.com/tagmanager/answer/6107167).
  </Accordion>

  <Accordion title="HubSpot CMS">
    Follow these steps to install the website tag on a site hosted with HubSpot CMS:

    1. Log in to your HubSpot account.

    2. Navigate to **Settings → Website → Pages**.

    3. Open the **Templates** or **Pages** tab (depending on your setup).

    4. Choose one of the following approaches:

       * **Global install (recommended):**

         1. Open **Website → Pages → Templates**.
         2. Edit your main site template.
         3. Paste the website tag snippet inside the `<head>` section.

       * **Per-page install:**

         1. Open a specific page.
         2. Go to **Advanced Settings**.
         3. Paste the snippet into the **HTML Head** field.

    5. Save and publish your changes.

    6. Visit your site and confirm the tag is running.

    <Note>
      A global template install is recommended to ensure full site coverage.
    </Note>
  </Accordion>

  <Accordion title="Shopify">
    Follow these steps to install the website tag on a Shopify store:

    1. Log in to your Shopify admin.
    2. In the left sidebar, go to **Online Store → Themes**.
    3. Find your active theme and click **⋯ → Edit code**.
    4. Under the **Layout** section, open `theme.liquid`.
    5. Locate the closing `</head>` tag.
    6. Paste the website tag snippet **immediately before** the closing `</head>` tag.
    7. Click **Save**.
    8. Visit your storefront and confirm the tag loads correctly.

    <Note>
      Installing the tag in `theme.liquid` ensures it runs on all pages of your site.
    </Note>
  </Accordion>

  <Accordion title="Squarespace">
    Follow these steps to install the website tag on a Squarespace site:

    1. Log in to your Squarespace account.
    2. Open the site you want to install the tag on.
    3. Go to **Settings → Advanced → Code Injection**.
    4. In the **Header** field, paste the website tag snippet.
    5. Click **Save**.
    6. Publish your site if it is not already live.
    7. Visit your site and verify that the tag is loading.

    <Note>
      Adding the script to the Header ensures it loads on every page.
    </Note>
  </Accordion>

  <Accordion title="Static hosts (e.g., Netlify, Vercel, Cloudflare Pages)">
    Use these steps if your site is deployed as a static site or via a modern framework:

    1. Open your project’s source code locally.

    2. Identify the file that controls your global HTML layout, such as:

       * `index.html`
       * `_document.tsx` (Next.js)
       * `app.html` (SvelteKit)
       * A shared layout or template file

    3. Paste the website tag snippet inside the `<head>` section of that file.

    4. Save your changes.

    5. Commit and push the changes to your Git repository.

    6. Deploy the site using your hosting provider (Netlify, Vercel, Cloudflare Pages, etc.)

    7. Once the deployment completes, visit the live site and verify the tag loads correctly.

    <Note>
      Ensure the script runs on all pages and is not conditionally excluded during build or runtime.
    </Note>
  </Accordion>

  <Accordion title="Webflow">
    Follow these steps to install the website tag on a Webflow site:

    1. Log in to your Webflow account.
    2. Open the project you want to install the tag on.
    3. Go to **Project Settings**.
    4. Select the **Custom Code** tab.
    5. Paste the website tag snippet into the **Head code** field.

    <Frame>
      <img src="https://mintcdn.com/unify-19/hCdysogYM6qFbUs-/images/developers/intent-client/webflow-install.png?fit=max&auto=format&n=hCdysogYM6qFbUs-&q=85&s=52a753bc219787d46885e76a5f54b326" width="1858" height="410" data-path="images/developers/intent-client/webflow-install.png" />
    </Frame>

    6. Click **Save Changes**.
    7. Publish the site to apply the changes.
    8. Visit your site and verify the tag is loading.

    <Note>
      The tag will run on all published pages of the site.
    </Note>
  </Accordion>
</AccordionGroup>

## Usage

Once the website tag is installed, the Unify Intent client will automatically
start collecting events on your website. Often, there is nothing else you need
to do.

If you'd like to manually trigger events in specific places on your website, you
can do so by calling the client directly. When you include the tag in your HTML,
you will immediately be able to access the client at `window.unify` (or simply
`unify` since `window` is global).

```js Console theme={null}
// Trigger a "page" event
unify.page();

// Trigger a custom event
unify.track("See More Button Clicked");

// Trigger an "identify" event
unify.identify("user@email.com");

// You can also pass standard Person/Company fields as a second argument
unify.identify("jane@unifygtm.com", {
  firstName: "Jane",
  lastName: "Doe",
  company: { name: "Unify", domain: "unifygtm.com" },
});
```

<Tip>
  As demonstrated above, you can pass standard Person & Company fields as a second argument to the
  `identify` method. See [Field Mappings](/reference/integrations/salesforce/field-mappings#available-fields)
  for all available fields.
</Tip>

For details on how this works and the available options, see the full [Usage guide](/developers/intent-client/usage-guide).
