🎉 Events

Control the behavior of your Userback widget by triggering specific actions during load, open, or close events. This allows for a more tailored user interaction.

🔐 Company Plan or higher required - Uses JavaScript SDK, more details here.

Prerequisites

• Userback Widget installed

Basic Usage

Event Handling

To log a message when the Userback widget loads, you can use the following code snippet:

Userback.on_load = () => {
  console.log("Widget Loaded");
};

Basic Use Cases

Execute Actions When the Widget Opens

Userback.on_open = () => {
  console.log("Widget Opened");
};

Execute Actions When the Widget Closes

Userback.on_close = () => {
  console.log("Widget Closed");
};

Advanced Use Cases

Manipulate the DOM When the Widget Loads

By combining on_load with DOM manipulation, you can create a more interactive experience. For instance, show a tooltip when the widget is loaded:

Userback.on_load = () => {
  let tooltip = document.createElement("span");
  tooltip.className = 'tooltip';
  tooltip.innerText = 'Userback is ready!';
  document.body.appendChild(tooltip);
};

Tracking User Behavior with Custom Analytics

When the widget is opened or closed, you might want to track this behavior for analytics purposes.

Userback.on_open = () => {
  console.log("User opened the widget");
};

Userback.on_close = () => {
  console.log("User closed the widget");
};

Redirect After Feedback Submission

You might want to direct the user to another webpage after feedback is sent:

Userback.after_send = () => {
  window.location.href = 'https://www.yourdomain.com/thankyou';
};

Available Event Handlers

Event Handlers: on_load, on_open, on_close, before_send, after_send

Support & Further Reading

For more information, consult the JavaScript SDK Documentation.

Encounter issues? Please send a message to our support team.