@userback/widget
Quickly integrate Userback via NPM or Yarn with this step-by-step guide and code samples
Overview
The Userback JavaScript package allows you to seamlessly integrate the Userback Widget into your JavaScript or TypeScript application for feedback collection and management.
- Official NPM Package: https://www.npmjs.com/package/@userback/widget
- Official GitHub Repository: https://github.com/userback/widget-js/tree/develop/widget-js
Installation
To install any of the packages and embed Userback, you'll need a Widget Access Token.
NPM Installation
npm i @userback/widget
Yarn Installation
yarn add @userback/widget
Quickstart
To embed the Userback Widget, use the following example code snippets:
JavaScript Example
import Userback from '@userback/widget'
Userback('**Widget Access Token**')
Examples
Here are some examples to customize the behavior of the Userback Widget:
Example 1: Show the Widget Immediately
Userback('**Widget Access Token**').then(ub => {
ub.show('bug')
})
Example 2: Delay Showing the Widget
Userback('**Widget Access Token**', { autohide: true }).then(ub => {
document.querySelector('button.show-feedback').addEventListener('click', function(){
ub.show()
})
})
Example 3: Enable Native Screenshots
const userback = await Userback('**Widget Access Token**', { native_screenshot: true })
document.querySelector('button.screenshot').addEventListener('click', (event) => {
event.preventDefault()
userback.open('bug', 'screenshot')
})
Example 4: Get a Reference to the Userback Widget
import { getUserback } from '@userback/widget'
document.querySelector('button.screenshot').addEventListener('click', (event) => {
event.preventDefault()
getUserback().open('bug', 'screenshot')
})
For advanced customization information, refer to our JavaScript SDK documentation.
Updated about 2 months ago
Whatβs Next