Getting started

Installation

Userowl offers several ways to install depending on your tech stack. Follow the steps below to install Userowl in your application or website.

You need to have a project in Userowl to start collecting feedback. If you haven't created a project yet, you can follow the steps in Set up a project.

Finding your APP ID

Go to Widget > Install page to find your APP ID. You can either copy the code for your installation method or just copy the APP ID.

Here are the different ways to install Userowl in your application or website.

Place the following snippet in the <head> tag of your website or web app. You will need to change Your_APP_ID_Here with your APP ID.

<script>
  //Your APP ID
  var APP_ID = 'Your_APP_ID_Here';

  window.UserowlSettings = {
    appId: APP_ID
  };
  (function() { var w = window; var uo = w.Userowl = w.Userowl || []; uo.methods = ["open", "close", "identify"]; w.UserowlQueue = []; uo.f = function(c) { return function() { var args = Array.prototype.slice.call(arguments); window.UserowlQueue.push({ c: c, a: args }) } }; for(i = 0; i < uo.methods.length; i++){ uo[uo.methods[i]] = uo.f(uo.methods[i]); } var d = document; var s = d.createElement('script'); s.async = true; s.src = 'https://app.userowl.com/static/widget.js'; (d.head || d.body).appendChild(s); })();
</script>

  1. Install the Userowl npm package.
npm install @userowl/js
or 
yarn add @userowl/js
  1. Place the following code to your application. You will need to change Your_APP_ID_Here with your APP ID.
import Userowl from '@userowl/js';

Userowl.initialize(
  'Your_APP_ID_Here' //Your APP ID
);

If your application has logged-in users, you can identify users by calling the identify method. This is helpful to track user's feedback and activities. Your logged-in users will not have to fill in their details like name and email when they provide feedback.

This method takes an object with user's details. You can call this method before or after the initialize method.

Userowl.identify({
  id: 'abc123456', //User's unique identifier
  email: '[email protected]', //User's email
  name: 'Simone Miles' //User's name
});

To find about more on the default fields and custom fields you can pass, check the identify method documentation.

After you follow the steps above, you can validate the installation by opening your website or web app. You should see the Userowl widget on your website or web app.

There are several methods you can use to control and customize the Userowl widget. You can find the documentation for these methods in the JavaScript SDK documentation.