Open the widget with your own feedback button

Great. You want to start collecting feedback from your users and customers. If you want to use your own feedback buttons and not use the standard Usersnap ones, no problem. Here's a short guide on how to proceed.

Create a feedback project and in case, you haven't installed the Usersnap snippet code yet, please follow this installation guide. Next, you need a few lines of JavaScript code in your website or web application. Ready to collect feedback.

Control the displaying of the buttons and feedback widgets with this API reference.

Hide the standard button of the feedback widget

You have to configure the "Display rules" right so that the widgets only appear when someone clicks on your button.

In the "Configuration" - Display tab please check the Activation to be Auto Popup.
And then simply set the Audience to "Nobody".

🚧

Do not forget to press the "Set live" button of the project. This controls whether the project is available at all or not.

Implement your own button

This is an example of JavaScript code to open a specific feedback widget:

window.Usersnap.show('[Project-API-key]').then((widgetApi) => widgetApi.open());

Here's an example of a button opening a specific project.

<a href="javascript:api.show('[Project-API-key]').then((widgetApi) => widgetApi.open());"><button>test</button></a>

That's all you have to do.

How to find the API-key of a specific project?

You can find the Project-API-key in the "Configuration".

🚧

In case are using the project-specific snippet code in the installation

If you installed the standard Usersnap snippet code, you don't have to read this.

In case you used the project-specific snippet code, please, be aware that the JavaScript code is a bit different.

Reference


Did this page help you?