Install Userback Code

Install the Userback widget using the method that fits your stack.

📘

Before you start

You'll need your Userback access token. Click the Code icon in the top-right corner of your workspace to find it.


Method 1: JavaScript snippet

Use this method for static websites or web apps. Note that the script loads asynchronously, so early console logs and errors may not be captured — use Method 2 if that matters to you.

  1. Copy your JavaScript snippet from the Userback dashboard.
  2. Paste it before the closing </body> tag in your HTML.
<script>
  window.Userback = window.Userback || {};
  Userback.access_token = 'YOUR_ACCESS_TOKEN';

  // identify your logged-in users (optional)
  Userback.user_data = {
    id: "123456", // example data
    info: {
      name: "someone", // example data
      email: "[email protected]" // example data
    }
  };

  (function(d) {
    var s = d.createElement('script');s.async = true;
    s.src = 'https://static.userback.io/widget/v1.js';
    (d.head || d.body).appendChild(s);
  })(document);
</script>

Method 2: Script tag

Use this method if you need console log synchronization. It loads the script in <head> so all logs and errors are captured from page load.

  1. Insert the script as early as possible in the <head> of your HTML.
  2. Initialize with Userback.init().
<head>
  <script src="https://static.userback.io/widget/v1.js"></script>
</head>
<body>
  <script>
  Userback.init('YOUR_ACCESS_TOKEN', {
    user_data: {
      id: "123456", // example data
      info: {
        name: "someone", // example data
        email: "[email protected]" // example data
      }
    }
  });
  </script>
</body>

Method 3: Using npm

Install the package:

npm install @userback/widget

Initialize as early as possible during your page load:

import Userback from '@userback/widget';

// identify your logged-in users (optional)
const options = {
  user_data: {
    id: "123456",
    info: {
      name: "someone",
      email: "[email protected]"
    }
  }
};

Userback('YOUR_ACCESS_TOKEN', options);

See the framework-specific docs for React, Vue, Next.js, and Angular.


Need help? Visit the Help Center or use the chat bubble on this page to contact our support team.