Version 1.0

Getting started

Installation

Some parts of Pavior only work if you install Pavior on your website:

  1. Automatically sync your website users to our CRM
  2. Live chat with customers on your website
  3. Video calls to customers on your website
  4. Rewind time to watch videos of specific interactions on your site
  5. Allow customers and teammates to leave feedback by rageclicking or using a custom trigger
  6. Automated chat messages and announcements

Basic installation

To install Pavior on your site, you can use the following code snippet. Make sure to replace the team id with your team id:

<script src="https://app.pavior.com/embed"></script>
<script>
  Pavior('init', {
    'teamId': 'YOUR_TEAM_ID',
    'doChat': true,
    'doTimeTravel': true,
  });
</script>

The following options are commonly used:

Check out our API Reference for a full list of options.

Advanced configuration

If you know your visitor's email or id (for example, if it's a logged-in customer), you can replace the init script as follows:

Pavior('init', {
  'teamId': 'YOUR_TEAM_ID',
  'doChat': true,
  'doTimeTravel': true,
  'email': 'CUSTOMER_EMAIL',
  'id': 'CUSTOMER_ID',
});

If the id is not provided, the email will be used as the id. If an id or email is not provided, the user will be treated as anonymous until they identify themselves.

Secure configuration

If you provide just an id or email, the user will be identified, but not authenticated. That is, you don't know for certain whether it really is that user, or if it's someone pretending to be that user. If you want your team to be able to trust that the user is not an impostor, see our authentication guide.

Installing in next.js

Frameworks like next.js do not allow pasting scripts directly into your <head> tag. Instead, you can use the following:

import Script from 'next/script';

// ...

<Script src="https://app.pavior.com/embed" strategy="beforeInteractive"></Script>
<Script id="moment-init" strategy="beforeInteractive">
{`
  Pavior('init', {
    teamVanityId: 'REPLACE_WITH_YOUR_TEAM_ID',
    doChat: true,
    doTimeTravel: true,
    quadClickForFeedback: true,
  });
`}
</Script>

Use strategy="beforeInteractive" if you want time travel to capture events before the page has finished loading. If you are not using time travel, or you don't mind losing access to user events before page load, you can use strategy="afterInteractive".

Feedback or clarification